@directcryptopay/sdk 0.2.1 → 0.2.3

package/dist/embedded-wallet-Pn0I_XLn.js

@@ -0,0 +1,820 @@
+import { c_ as Y, cX as g, df as W, cM as K, cY as c, d8 as _, di as V, dC as G, cU as R, cV as z, cW as B, cL as N, cE as m, dD as j, d2 as k, d3 as C, d4 as h, d1 as L, dE as X, dF as v, cG as D, cF as O, cH as q, d0 as Q } from "./index-D_8VUmn1.js";
+import { r as l, c as w, n as d } from "./index-CEqcN8QP.js";
+import "./index-I7VDqINw.js";
+import { e as Z, n as J } from "./ref-CpgjXAw7.js";
+import "./index-CmAv0Tzr.js";
+import { H as I } from "./HelpersUtil-DfMFC7Bf.js";
+import { o as ee } from "./if-defined-CdZSZ6UL.js";
+import "./index-C4M5s_AM.js";
+import "./index-BEswjY9r.js";
+import "./index-Oz72I9VP.js";
+import "./index-UclsHkJ0.js";
+import "./index-X8zir_1j.js";
+import { N as te } from "./NavigationUtil-kj9LEOOd.js";
+const ie = Y`
+  div {
+    width: 100%;
+  }
+
+  [data-ready='false'] {
+    transform: scale(1.05);
+  }
+
+  @media (max-width: 430px) {
+    [data-ready='false'] {
+      transform: translateY(-50px);
+    }
+  }
+`;
+var F = function(e, t, i, r) {
+  var n = arguments.length, o = n < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, i) : r, s;
+  if (typeof Reflect == "object" && typeof Reflect.decorate == "function") o = Reflect.decorate(e, t, i, r);
+  else for (var a = e.length - 1; a >= 0; a--) (s = e[a]) && (o = (n < 3 ? s(o) : n > 3 ? s(t, i, o) : s(t, i)) || o);
+  return n > 3 && o && Object.defineProperty(t, i, o), o;
+};
+const P = 600, M = 360, oe = 64;
+let E = class extends g {
+  constructor() {
+    super(), this.bodyObserver = void 0, this.unsubscribe = [], this.iframe = document.getElementById("w3m-iframe"), this.ready = !1, this.unsubscribe.push(W.subscribeKey("open", (t) => {
+      t || this.onHideIframe();
+    }), W.subscribeKey("shake", (t) => {
+      t ? this.iframe.style.animation = "w3m-shake 500ms var(--apkt-easings-ease-out-power-2)" : this.iframe.style.animation = "none";
+    }));
+  }
+  disconnectedCallback() {
+    var t;
+    this.onHideIframe(), this.unsubscribe.forEach((i) => i()), (t = this.bodyObserver) == null || t.unobserve(window.document.body);
+  }
+  async firstUpdated() {
+    var i;
+    await this.syncTheme(), this.iframe.style.display = "block";
+    const t = (i = this == null ? void 0 : this.renderRoot) == null ? void 0 : i.querySelector("div");
+    this.bodyObserver = new ResizeObserver((r) => {
+      var s, a;
+      const n = (s = r == null ? void 0 : r[0]) == null ? void 0 : s.contentBoxSize, o = (a = n == null ? void 0 : n[0]) == null ? void 0 : a.inlineSize;
+      this.iframe.style.height = `${P}px`, t.style.height = `${P}px`, K.state.enableEmbedded ? this.updateFrameSizeForEmbeddedMode() : o && o <= 430 ? (this.iframe.style.width = "100%", this.iframe.style.left = "0px", this.iframe.style.bottom = "0px", this.iframe.style.top = "unset", this.onShowIframe()) : (this.iframe.style.width = `${M}px`, this.iframe.style.left = `calc(50% - ${M / 2}px)`, this.iframe.style.top = `calc(50% - ${P / 2}px + ${oe / 2}px)`, this.iframe.style.bottom = "unset", this.onShowIframe());
+    }), this.bodyObserver.observe(window.document.body);
+  }
+  render() {
+    return c`<div data-ready=${this.ready} id="w3m-frame-container"></div>`;
+  }
+  onShowIframe() {
+    const t = window.innerWidth <= 430;
+    this.ready = !0, this.iframe.style.animation = t ? "w3m-iframe-zoom-in-mobile 200ms var(--apkt-easings-ease-out-power-2)" : "w3m-iframe-zoom-in 200ms var(--apkt-easings-ease-out-power-2)";
+  }
+  onHideIframe() {
+    this.iframe.style.display = "none", this.iframe.style.animation = "w3m-iframe-fade-out 200ms var(--apkt-easings-ease-out-power-2)";
+  }
+  async syncTheme() {
+    const t = _.getAuthConnector();
+    if (t) {
+      const i = V.getSnapshot().themeMode, r = V.getSnapshot().themeVariables;
+      await t.provider.syncTheme({
+        themeVariables: r,
+        w3mThemeVariables: G(r, i)
+      });
+    }
+  }
+  async updateFrameSizeForEmbeddedMode() {
+    var r;
+    const t = (r = this == null ? void 0 : this.renderRoot) == null ? void 0 : r.querySelector("div");
+    await new Promise((n) => {
+      setTimeout(n, 300);
+    });
+    const i = this.getBoundingClientRect();
+    t.style.width = "100%", this.iframe.style.left = `${i.left}px`, this.iframe.style.top = `${i.top}px`, this.iframe.style.width = `${i.width}px`, this.iframe.style.height = `${i.height}px`, this.onShowIframe();
+  }
+};
+E.styles = ie;
+F([
+  l()
+], E.prototype, "ready", void 0);
+E = F([
+  w("w3m-approve-transaction-view")
+], E);
+const re = R`
+  a {
+    border: none;
+    border-radius: ${({ borderRadius: e }) => e[20]};
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding: ${({ spacing: e }) => e[1]};
+    transition:
+      background-color ${({ durations: e }) => e.lg}
+        ${({ easings: e }) => e["ease-out-power-2"]},
+      box-shadow ${({ durations: e }) => e.lg}
+        ${({ easings: e }) => e["ease-out-power-2"]},
+      border ${({ durations: e }) => e.lg} ${({ easings: e }) => e["ease-out-power-2"]};
+    will-change: background-color, box-shadow, border;
+  }
+
+  /* -- Variants --------------------------------------------------------------- */
+  a[data-type='success'] {
+    background-color: ${({ tokens: e }) => e.core.backgroundSuccess};
+    color: ${({ tokens: e }) => e.core.textSuccess};
+  }
+
+  a[data-type='error'] {
+    background-color: ${({ tokens: e }) => e.core.backgroundError};
+    color: ${({ tokens: e }) => e.core.textError};
+  }
+
+  a[data-type='warning'] {
+    background-color: ${({ tokens: e }) => e.core.backgroundWarning};
+    color: ${({ tokens: e }) => e.core.textWarning};
+  }
+
+  /* -- Sizes --------------------------------------------------------------- */
+  a[data-size='sm'] {
+    height: 24px;
+  }
+
+  a[data-size='md'] {
+    height: 28px;
+  }
+
+  a[data-size='lg'] {
+    height: 32px;
+  }
+
+  a[data-size='sm'] > wui-image,
+  a[data-size='sm'] > wui-icon {
+    width: 16px;
+    height: 16px;
+  }
+
+  a[data-size='md'] > wui-image,
+  a[data-size='md'] > wui-icon {
+    width: 20px;
+    height: 20px;
+  }
+
+  a[data-size='lg'] > wui-image,
+  a[data-size='lg'] > wui-icon {
+    width: 24px;
+    height: 24px;
+  }
+
+  wui-text {
+    padding-left: ${({ spacing: e }) => e[1]};
+    padding-right: ${({ spacing: e }) => e[1]};
+  }
+
+  wui-image {
+    border-radius: ${({ borderRadius: e }) => e[3]};
+    overflow: hidden;
+    user-drag: none;
+    user-select: none;
+    -moz-user-select: none;
+    -webkit-user-drag: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+  }
+
+  /* -- States --------------------------------------------------------------- */
+  @media (hover: hover) and (pointer: fine) {
+    a[data-type='success']:not(:disabled):hover {
+      background-color: ${({ tokens: e }) => e.theme.foregroundPrimary};
+      box-shadow: 0px 0px 0px 1px ${({ tokens: e }) => e.core.borderSuccess};
+    }
+
+    a[data-type='error']:not(:disabled):hover {
+      background-color: ${({ tokens: e }) => e.theme.foregroundPrimary};
+      box-shadow: 0px 0px 0px 1px ${({ tokens: e }) => e.core.borderError};
+    }
+
+    a[data-type='warning']:not(:disabled):hover {
+      background-color: ${({ tokens: e }) => e.theme.foregroundPrimary};
+      box-shadow: 0px 0px 0px 1px ${({ tokens: e }) => e.core.borderWarning};
+    }
+  }
+
+  a[data-type='success']:not(:disabled):focus-visible {
+    box-shadow:
+      0px 0px 0px 1px ${({ tokens: e }) => e.core.backgroundAccentPrimary},
+      0px 0px 0px 4px ${({ tokens: e }) => e.core.foregroundAccent020};
+  }
+
+  a[data-type='error']:not(:disabled):focus-visible {
+    box-shadow:
+      0px 0px 0px 1px ${({ tokens: e }) => e.core.backgroundAccentPrimary},
+      0px 0px 0px 4px ${({ tokens: e }) => e.core.foregroundAccent020};
+  }
+
+  a[data-type='warning']:not(:disabled):focus-visible {
+    box-shadow:
+      0px 0px 0px 1px ${({ tokens: e }) => e.core.backgroundAccentPrimary},
+      0px 0px 0px 4px ${({ tokens: e }) => e.core.foregroundAccent020};
+  }
+
+  a:disabled {
+    opacity: 0.5;
+  }
+`;
+var y = function(e, t, i, r) {
+  var n = arguments.length, o = n < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, i) : r, s;
+  if (typeof Reflect == "object" && typeof Reflect.decorate == "function") o = Reflect.decorate(e, t, i, r);
+  else for (var a = e.length - 1; a >= 0; a--) (s = e[a]) && (o = (n < 3 ? s(o) : n > 3 ? s(t, i, o) : s(t, i)) || o);
+  return n > 3 && o && Object.defineProperty(t, i, o), o;
+};
+const ne = {
+  sm: "md-regular",
+  md: "lg-regular",
+  lg: "lg-regular"
+}, se = {
+  success: "sealCheck",
+  error: "warning",
+  warning: "exclamationCircle"
+};
+let u = class extends g {
+  constructor() {
+    super(...arguments), this.type = "success", this.size = "md", this.imageSrc = void 0, this.disabled = !1, this.href = "", this.text = void 0;
+  }
+  render() {
+    return c`
+      <a
+        rel="noreferrer"
+        target="_blank"
+        href=${this.href}
+        class=${this.disabled ? "disabled" : ""}
+        data-type=${this.type}
+        data-size=${this.size}
+      >
+        ${this.imageTemplate()}
+        <wui-text variant=${ne[this.size]} color="inherit">${this.text}</wui-text>
+      </a>
+    `;
+  }
+  imageTemplate() {
+    return this.imageSrc ? c`<wui-image src=${this.imageSrc} size="inherit"></wui-image>` : c`<wui-icon
+      name=${se[this.type]}
+      weight="fill"
+      color="inherit"
+      size="inherit"
+      class="image-icon"
+    ></wui-icon>`;
+  }
+};
+u.styles = [z, B, re];
+y([
+  d()
+], u.prototype, "type", void 0);
+y([
+  d()
+], u.prototype, "size", void 0);
+y([
+  d()
+], u.prototype, "imageSrc", void 0);
+y([
+  d({ type: Boolean })
+], u.prototype, "disabled", void 0);
+y([
+  d()
+], u.prototype, "href", void 0);
+y([
+  d()
+], u.prototype, "text", void 0);
+u = y([
+  w("wui-semantic-chip")
+], u);
+var ae = function(e, t, i, r) {
+  var n = arguments.length, o = n < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, i) : r, s;
+  if (typeof Reflect == "object" && typeof Reflect.decorate == "function") o = Reflect.decorate(e, t, i, r);
+  else for (var a = e.length - 1; a >= 0; a--) (s = e[a]) && (o = (n < 3 ? s(o) : n > 3 ? s(t, i, o) : s(t, i)) || o);
+  return n > 3 && o && Object.defineProperty(t, i, o), o;
+};
+let H = class extends g {
+  render() {
+    return c`
+      <wui-flex flexDirection="column" alignItems="center" gap="5" padding="5">
+        <wui-text variant="md-regular" color="primary">Follow the instructions on</wui-text>
+        <wui-semantic-chip
+          icon="externalLink"
+          variant="fill"
+          text=${N.SECURE_SITE_DASHBOARD}
+          href=${N.SECURE_SITE_DASHBOARD}
+          imageSrc=${N.SECURE_SITE_FAVICON}
+          data-testid="w3m-secure-website-button"
+        >
+        </wui-semantic-chip>
+        <wui-text variant="sm-regular" color="secondary">
+          You will have to reconnect for security reasons
+        </wui-text>
+      </wui-flex>
+    `;
+  }
+};
+H = ae([
+  w("w3m-upgrade-wallet-view")
+], H);
+var A = function(e, t, i, r) {
+  var n = arguments.length, o = n < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, i) : r, s;
+  if (typeof Reflect == "object" && typeof Reflect.decorate == "function") o = Reflect.decorate(e, t, i, r);
+  else for (var a = e.length - 1; a >= 0; a--) (s = e[a]) && (o = (n < 3 ? s(o) : n > 3 ? s(t, i, o) : s(t, i)) || o);
+  return n > 3 && o && Object.defineProperty(t, i, o), o;
+};
+let $ = class extends g {
+  constructor() {
+    super(...arguments), this.loading = !1, this.switched = !1, this.text = "", this.network = m.state.activeCaipNetwork;
+  }
+  render() {
+    return c`
+      <wui-flex flexDirection="column" gap="2" .padding=${["6", "4", "3", "4"]}>
+        ${this.togglePreferredAccountTypeTemplate()} ${this.toggleSmartAccountVersionTemplate()}
+      </wui-flex>
+    `;
+  }
+  toggleSmartAccountVersionTemplate() {
+    return c`
+      <w3m-tooltip-trigger text="Changing the smart account version will reload the page">
+        <wui-list-item
+          icon=${this.isV6() ? "arrowTop" : "arrowBottom"}
+          ?rounded=${!0}
+          ?chevron=${!0}
+          data-testid="account-toggle-smart-account-version"
+          @click=${this.toggleSmartAccountVersion.bind(this)}
+        >
+          <wui-text variant="lg-regular" color="primary"
+            >Force Smart Account Version ${this.isV6() ? "7" : "6"}</wui-text
+          >
+        </wui-list-item>
+      </w3m-tooltip-trigger>
+    `;
+  }
+  isV6() {
+    return (j.get("dapp_smart_account_version") || "v6") === "v6";
+  }
+  toggleSmartAccountVersion() {
+    var t;
+    j.set("dapp_smart_account_version", this.isV6() ? "v7" : "v6"), typeof window < "u" && ((t = window == null ? void 0 : window.location) == null || t.reload());
+  }
+  togglePreferredAccountTypeTemplate() {
+    var o;
+    const t = (o = this.network) == null ? void 0 : o.chainNamespace, i = m.checkIfSmartAccountEnabled(), r = _.getConnectorId(t);
+    return !_.getAuthConnector() || r !== k.CONNECTOR_ID.AUTH || !i ? null : (this.switched || (this.text = C(t) === h.ACCOUNT_TYPES.SMART_ACCOUNT ? "Switch to your EOA" : "Switch to your Smart Account"), c`
+      <wui-list-item
+        icon="swapHorizontal"
+        ?rounded=${!0}
+        ?chevron=${!0}
+        ?loading=${this.loading}
+        @click=${this.changePreferredAccountType.bind(this)}
+        data-testid="account-toggle-preferred-account-type"
+      >
+        <wui-text variant="lg-regular" color="primary">${this.text}</wui-text>
+      </wui-list-item>
+    `);
+  }
+  async changePreferredAccountType() {
+    var o;
+    const t = (o = this.network) == null ? void 0 : o.chainNamespace, i = m.checkIfSmartAccountEnabled(), r = C(t) === h.ACCOUNT_TYPES.SMART_ACCOUNT || !i ? h.ACCOUNT_TYPES.EOA : h.ACCOUNT_TYPES.SMART_ACCOUNT;
+    _.getAuthConnector() && (this.loading = !0, await L.setPreferredAccountType(r, t), this.text = r === h.ACCOUNT_TYPES.SMART_ACCOUNT ? "Switch to your EOA" : "Switch to your Smart Account", this.switched = !0, X.resetSend(), this.loading = !1, this.requestUpdate());
+  }
+};
+A([
+  l()
+], $.prototype, "loading", void 0);
+A([
+  l()
+], $.prototype, "switched", void 0);
+A([
+  l()
+], $.prototype, "text", void 0);
+A([
+  l()
+], $.prototype, "network", void 0);
+$ = A([
+  w("w3m-smart-account-settings-view")
+], $);
+const ce = R`
+  :host {
+    width: 100%;
+  }
+
+  button {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    background-color: ${({ tokens: e }) => e.theme.foregroundPrimary};
+    border-radius: ${({ borderRadius: e }) => e[4]};
+    padding: ${({ spacing: e }) => e[4]};
+  }
+
+  .name {
+    max-width: 75%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  @media (hover: hover) and (pointer: fine) {
+    button:hover:enabled {
+      cursor: pointer;
+      background-color: ${({ tokens: e }) => e.theme.foregroundSecondary};
+      border-radius: ${({ borderRadius: e }) => e[6]};
+    }
+  }
+
+  button:disabled {
+    opacity: 0.5;
+    cursor: default;
+  }
+
+  button:focus-visible:enabled {
+    box-shadow: 0 0 0 4px ${({ tokens: e }) => e.core.foregroundAccent040};
+    background-color: ${({ tokens: e }) => e.theme.foregroundSecondary};
+  }
+`;
+var T = function(e, t, i, r) {
+  var n = arguments.length, o = n < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, i) : r, s;
+  if (typeof Reflect == "object" && typeof Reflect.decorate == "function") o = Reflect.decorate(e, t, i, r);
+  else for (var a = e.length - 1; a >= 0; a--) (s = e[a]) && (o = (n < 3 ? s(o) : n > 3 ? s(t, i, o) : s(t, i)) || o);
+  return n > 3 && o && Object.defineProperty(t, i, o), o;
+};
+let b = class extends g {
+  constructor() {
+    super(...arguments), this.name = "", this.registered = !1, this.loading = !1, this.disabled = !1;
+  }
+  render() {
+    return c`
+      <button ?disabled=${this.disabled}>
+        <wui-text class="name" color="primary" variant="md-regular">${this.name}</wui-text>
+        ${this.templateRightContent()}
+      </button>
+    `;
+  }
+  templateRightContent() {
+    return this.loading ? c`<wui-loading-spinner size="lg" color="primary"></wui-loading-spinner>` : this.registered ? c`<wui-tag variant="info" size="sm">Registered</wui-tag>` : c`<wui-tag variant="success" size="sm">Available</wui-tag>`;
+  }
+};
+b.styles = [z, B, ce];
+T([
+  d()
+], b.prototype, "name", void 0);
+T([
+  d({ type: Boolean })
+], b.prototype, "registered", void 0);
+T([
+  d({ type: Boolean })
+], b.prototype, "loading", void 0);
+T([
+  d({ type: Boolean })
+], b.prototype, "disabled", void 0);
+b = T([
+  w("wui-account-name-suggestion-item")
+], b);
+const de = R`
+  :host {
+    position: relative;
+    width: 100%;
+    display: inline-block;
+  }
+
+  :host([disabled]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .base-name {
+    position: absolute;
+    right: ${({ spacing: e }) => e[4]};
+    top: 50%;
+    transform: translateY(-50%);
+    text-align: right;
+    padding: ${({ spacing: e }) => e[1]};
+    background-color: ${({ tokens: e }) => e.theme.foregroundSecondary};
+    border-radius: ${({ borderRadius: e }) => e[1]};
+  }
+`;
+var S = function(e, t, i, r) {
+  var n = arguments.length, o = n < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, i) : r, s;
+  if (typeof Reflect == "object" && typeof Reflect.decorate == "function") o = Reflect.decorate(e, t, i, r);
+  else for (var a = e.length - 1; a >= 0; a--) (s = e[a]) && (o = (n < 3 ? s(o) : n > 3 ? s(t, i, o) : s(t, i)) || o);
+  return n > 3 && o && Object.defineProperty(t, i, o), o;
+};
+let f = class extends g {
+  constructor() {
+    super(...arguments), this.disabled = !1, this.loading = !1;
+  }
+  render() {
+    return c`
+      <wui-input-text
+        value=${ee(this.value)}
+        ?disabled=${this.disabled}
+        .value=${this.value || ""}
+        data-testid="wui-ens-input"
+        icon="search"
+        inputRightPadding="5xl"
+        .onKeyDown=${this.onKeyDown}
+      ></wui-input-text>
+    `;
+  }
+};
+f.styles = [z, de];
+S([
+  d()
+], f.prototype, "errorMessage", void 0);
+S([
+  d({ type: Boolean })
+], f.prototype, "disabled", void 0);
+S([
+  d()
+], f.prototype, "value", void 0);
+S([
+  d({ type: Boolean })
+], f.prototype, "loading", void 0);
+S([
+  d({ attribute: !1 })
+], f.prototype, "onKeyDown", void 0);
+f = S([
+  w("wui-ens-input")
+], f);
+const le = R`
+  wui-flex {
+    width: 100%;
+  }
+
+  .suggestion {
+    background-color: ${({ tokens: e }) => e.theme.foregroundPrimary};
+    border-radius: ${({ borderRadius: e }) => e[4]};
+  }
+
+  .suggestion:hover:not(:disabled) {
+    cursor: pointer;
+    border: none;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    background-color: ${({ tokens: e }) => e.theme.foregroundSecondary};
+    border-radius: ${({ borderRadius: e }) => e[6]};
+    padding: ${({ spacing: e }) => e[4]};
+  }
+
+  .suggestion:disabled {
+    opacity: 0.5;
+    cursor: default;
+  }
+
+  .suggestion:focus-visible:not(:disabled) {
+    box-shadow: 0 0 0 4px ${({ tokens: e }) => e.core.foregroundAccent040};
+    background-color: ${({ tokens: e }) => e.theme.foregroundSecondary};
+  }
+
+  .suggested-name {
+    max-width: 75%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  form {
+    width: 100%;
+    position: relative;
+  }
+
+  .input-submit-button,
+  .input-loading-spinner {
+    position: absolute;
+    top: 22px;
+    transform: translateY(-50%);
+    right: 10px;
+  }
+`;
+var x = function(e, t, i, r) {
+  var n = arguments.length, o = n < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, i) : r, s;
+  if (typeof Reflect == "object" && typeof Reflect.decorate == "function") o = Reflect.decorate(e, t, i, r);
+  else for (var a = e.length - 1; a >= 0; a--) (s = e[a]) && (o = (n < 3 ? s(o) : n > 3 ? s(t, i, o) : s(t, i)) || o);
+  return n > 3 && o && Object.defineProperty(t, i, o), o;
+};
+let p = class extends g {
+  constructor() {
+    var t;
+    super(), this.formRef = Z(), this.usubscribe = [], this.name = "", this.error = "", this.loading = v.state.loading, this.suggestions = v.state.suggestions, this.profileName = (t = m.getAccountData()) == null ? void 0 : t.profileName, this.onDebouncedNameInputChange = D.debounce((i) => {
+      i.length < 4 ? this.error = "Name must be at least 4 characters long" : I.isValidReownName(i) ? (this.error = "", v.getSuggestions(i)) : this.error = "The value is not a valid username";
+    }), this.usubscribe.push(v.subscribe((i) => {
+      this.suggestions = i.suggestions, this.loading = i.loading;
+    }), m.subscribeChainProp("accountState", (i) => {
+      this.profileName = i == null ? void 0 : i.profileName, i != null && i.profileName && (this.error = "You already own a name");
+    }));
+  }
+  firstUpdated() {
+    var t;
+    (t = this.formRef.value) == null || t.addEventListener("keydown", this.onEnterKey.bind(this));
+  }
+  disconnectedCallback() {
+    var t;
+    super.disconnectedCallback(), this.usubscribe.forEach((i) => i()), (t = this.formRef.value) == null || t.removeEventListener("keydown", this.onEnterKey.bind(this));
+  }
+  render() {
+    return c`
+      <wui-flex
+        flexDirection="column"
+        alignItems="center"
+        gap="4"
+        .padding=${["1", "3", "4", "3"]}
+      >
+        <form ${J(this.formRef)} @submit=${this.onSubmitName.bind(this)}>
+          <wui-ens-input
+            @inputChange=${this.onNameInputChange.bind(this)}
+            .errorMessage=${this.error}
+            .value=${this.name}
+            .onKeyDown=${this.onKeyDown.bind(this)}
+          >
+          </wui-ens-input>
+          ${this.submitButtonTemplate()}
+          <input type="submit" hidden />
+        </form>
+        ${this.templateSuggestions()}
+      </wui-flex>
+    `;
+  }
+  submitButtonTemplate() {
+    const t = this.suggestions.find((r) => {
+      var n, o;
+      return ((o = (n = r.name) == null ? void 0 : n.split(".")) == null ? void 0 : o[0]) === this.name && r.registered;
+    });
+    if (this.loading)
+      return c`<wui-loading-spinner
+        class="input-loading-spinner"
+        color="secondary"
+      ></wui-loading-spinner>`;
+    const i = `${this.name}${k.WC_NAME_SUFFIX}`;
+    return c`
+      <wui-icon-link
+        ?disabled=${!!t}
+        class="input-submit-button"
+        size="sm"
+        icon="chevronRight"
+        iconColor=${t ? "default" : "accent-primary"}
+        @click=${() => this.onSubmitName(i)}
+      >
+      </wui-icon-link>
+    `;
+  }
+  onNameInputChange(t) {
+    const i = I.validateReownName(t.detail || "");
+    this.name = i, this.onDebouncedNameInputChange(i);
+  }
+  onKeyDown(t) {
+    t.key.length === 1 && !I.isValidReownName(t.key) && t.preventDefault();
+  }
+  templateSuggestions() {
+    return !this.name || this.name.length < 4 || this.error ? null : c`<wui-flex flexDirection="column" gap="1" alignItems="center">
+      ${this.suggestions.map((t) => c`<wui-account-name-suggestion-item
+            name=${t.name}
+            ?registered=${t.registered}
+            ?loading=${this.loading}
+            ?disabled=${t.registered || this.loading}
+            data-testid="account-name-suggestion"
+            @click=${() => this.onSubmitName(t.name)}
+          ></wui-account-name-suggestion-item>`)}
+    </wui-flex>`;
+  }
+  isAllowedToSubmit(t) {
+    var n;
+    const i = (n = t.split(".")) == null ? void 0 : n[0], r = this.suggestions.find((o) => {
+      var s, a;
+      return ((a = (s = o.name) == null ? void 0 : s.split(".")) == null ? void 0 : a[0]) === i && o.registered;
+    });
+    return !this.loading && !this.error && !this.profileName && i && v.validateName(i) && !r;
+  }
+  async onSubmitName(t) {
+    try {
+      if (!this.isAllowedToSubmit(t))
+        return;
+      O.sendEvent({
+        type: "track",
+        event: "REGISTER_NAME_INITIATED",
+        properties: {
+          isSmartAccount: C(m.state.activeChain) === h.ACCOUNT_TYPES.SMART_ACCOUNT,
+          ensName: t
+        }
+      }), await v.registerName(t), O.sendEvent({
+        type: "track",
+        event: "REGISTER_NAME_SUCCESS",
+        properties: {
+          isSmartAccount: C(m.state.activeChain) === h.ACCOUNT_TYPES.SMART_ACCOUNT,
+          ensName: t
+        }
+      });
+    } catch (i) {
+      q.showError(i.message), O.sendEvent({
+        type: "track",
+        event: "REGISTER_NAME_ERROR",
+        properties: {
+          isSmartAccount: C(m.state.activeChain) === h.ACCOUNT_TYPES.SMART_ACCOUNT,
+          ensName: t,
+          error: D.parseError(i)
+        }
+      });
+    }
+  }
+  onEnterKey(t) {
+    if (t.key === "Enter" && this.name && this.isAllowedToSubmit(this.name)) {
+      const i = `${this.name}${k.WC_NAME_SUFFIX}`;
+      this.onSubmitName(i);
+    }
+  }
+};
+p.styles = le;
+x([
+  d()
+], p.prototype, "errorMessage", void 0);
+x([
+  l()
+], p.prototype, "name", void 0);
+x([
+  l()
+], p.prototype, "error", void 0);
+x([
+  l()
+], p.prototype, "loading", void 0);
+x([
+  l()
+], p.prototype, "suggestions", void 0);
+x([
+  l()
+], p.prototype, "profileName", void 0);
+p = x([
+  w("w3m-register-account-name-view")
+], p);
+const ue = Y`
+  .continue-button-container {
+    width: 100%;
+  }
+`;
+var pe = function(e, t, i, r) {
+  var n = arguments.length, o = n < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, i) : r, s;
+  if (typeof Reflect == "object" && typeof Reflect.decorate == "function") o = Reflect.decorate(e, t, i, r);
+  else for (var a = e.length - 1; a >= 0; a--) (s = e[a]) && (o = (n < 3 ? s(o) : n > 3 ? s(t, i, o) : s(t, i)) || o);
+  return n > 3 && o && Object.defineProperty(t, i, o), o;
+};
+let U = class extends g {
+  render() {
+    return c`
+      <wui-flex
+        flexDirection="column"
+        alignItems="center"
+        gap="6"
+        .padding=${["0", "0", "4", "0"]}
+      >
+        ${this.onboardingTemplate()} ${this.buttonsTemplate()}
+        <wui-link
+          @click=${() => {
+      D.openHref(te.URLS.FAQ, "_blank");
+    }}
+        >
+          Learn more
+          <wui-icon color="inherit" slot="iconRight" name="externalLink"></wui-icon>
+        </wui-link>
+      </wui-flex>
+    `;
+  }
+  onboardingTemplate() {
+    return c` <wui-flex
+      flexDirection="column"
+      gap="6"
+      alignItems="center"
+      .padding=${["0", "6", "0", "6"]}
+    >
+      <wui-flex gap="3" alignItems="center" justifyContent="center">
+        <wui-icon-box size="xl" color="success" icon="checkmark"></wui-icon-box>
+      </wui-flex>
+      <wui-flex flexDirection="column" alignItems="center" gap="3">
+        <wui-text align="center" variant="md-medium" color="primary">
+          Account name chosen successfully
+        </wui-text>
+        <wui-text align="center" variant="md-regular" color="primary">
+          You can now fund your account and trade crypto
+        </wui-text>
+      </wui-flex>
+    </wui-flex>`;
+  }
+  buttonsTemplate() {
+    return c`<wui-flex
+      .padding=${["0", "4", "0", "4"]}
+      gap="3"
+      class="continue-button-container"
+    >
+      <wui-button fullWidth size="lg" borderRadius="xs" @click=${this.redirectToAccount.bind(this)}
+        >Let's Go!
+      </wui-button>
+    </wui-flex>`;
+  }
+  redirectToAccount() {
+    Q.replace("Account");
+  }
+};
+U.styles = ue;
+U = pe([
+  w("w3m-register-account-name-success-view")
+], U);
+export {
+  E as W3mApproveTransactionView,
+  U as W3mRegisterAccountNameSuccess,
+  p as W3mRegisterAccountNameView,
+  $ as W3mSmartAccountSettingsView,
+  H as W3mUpgradeWalletView
+};