@reown/appkit-cdn 0.0.3 → 0.0.5

package/dist/{w3m-modal-Cb8iN1Y9.js → w3m-modal-5wuX5WJr.js}

@@ -1,5 +1,5 @@
-import { q as g, u as v, M as n, m as d, y as m, O as p, b5 as y, x as C, v as k, R as h, U as S, K as E, z as A, a as f, f as x, c as N, w as c, t as O, b6 as L } from "./W3MFrameProviderSingleton-CuVI_88U.js";
-const K = g`
+import { u as v, w as y, M as n, g as h, O as f, b6 as C, o as m, z as k, x as S, R as c, U as x, L as A, D as E, a as b, c as O, y as w, v as N, b7 as L } from "./W3MFrameProviderSingleton-zbQ4ONFs.js";
+const K = v`
   :host {
     z-index: var(--w3m-z-index);
     display: block;
@@ -124,25 +124,25 @@ const K = g`
     }
   }
 `;
-var l = function(w, e, t, i) {
-  var o = arguments.length, s = o < 3 ? e : i === null ? i = Object.getOwnPropertyDescriptor(e, t) : i, r;
+var d = function(u, e, t, i) {
+  var o = arguments.length, s = o < 3 ? e : i === null ? i = Object.getOwnPropertyDescriptor(e, t) : i, a;
   if (typeof Reflect == "object" && typeof Reflect.decorate == "function")
-    s = Reflect.decorate(w, e, t, i);
+    s = Reflect.decorate(u, e, t, i);
   else
-    for (var u = w.length - 1; u >= 0; u--)
-      (r = w[u]) && (s = (o < 3 ? r(s) : o > 3 ? r(e, t, s) : r(e, t)) || s);
+    for (var l = u.length - 1; l >= 0; l--)
+      (a = u[l]) && (s = (o < 3 ? a(s) : o > 3 ? a(e, t, s) : a(e, t)) || s);
   return o > 3 && s && Object.defineProperty(e, t, s), s;
 };
-const b = "scroll-lock";
-let a = class extends v {
+const g = "scroll-lock";
+let r = class extends y {
   constructor() {
-    super(), this.unsubscribe = [], this.abortController = void 0, this.open = n.state.open, this.caipAddress = d.state.caipAddress, this.caipNetwork = m.state.caipNetwork, this.isSiweEnabled = p.state.isSiweEnabled, this.connected = d.state.isConnected, this.loading = n.state.loading, this.shake = n.state.shake, this.initializeTheming(), y.prefetch(), this.unsubscribe.push(n.subscribeKey("open", (e) => e ? this.onOpen() : this.onClose()), n.subscribeKey("shake", (e) => this.shake = e), n.subscribeKey("loading", (e) => this.onLoadingChange(e)), d.subscribeKey("isConnected", (e) => this.onIsConnectedChange(e)), m.subscribeKey("caipNetwork", (e) => this.onNewNetwork(e)), d.subscribeKey("caipAddress", (e) => this.onNewAddress(e)), d.subscribeKey("siweStatus", (e) => this.onSiweStatusChange(e)), p.subscribeKey("isSiweEnabled", (e) => this.isSiweEnabled = e)), C.sendEvent({ type: "track", event: "MODAL_LOADED" });
+    super(), this.unsubscribe = [], this.abortController = void 0, this.open = n.state.open, this.caipAddress = h.state.activeCaipAddress, this.caipNetwork = h.state.activeCaipNetwork, this.isSiweEnabled = f.state.isSiweEnabled, this.shake = n.state.shake, this.initializeTheming(), C.prefetch(), this.unsubscribe.push(n.subscribeKey("open", (e) => e ? this.onOpen() : this.onClose()), n.subscribeKey("shake", (e) => this.shake = e), m.subscribeKey("siweStatus", (e) => this.onSiweStatusChange(e), "eip155"), h.subscribeKey("activeCaipNetwork", (e) => this.onNewNetwork(e)), h.subscribeKey("activeCaipAddress", (e) => this.onNewAddress(e)), f.subscribeKey("isSiweEnabled", (e) => this.isSiweEnabled = e)), k.sendEvent({ type: "track", event: "MODAL_LOADED" });
   }
   disconnectedCallback() {
     this.unsubscribe.forEach((e) => e()), this.onRemoveKeyboardListener();
   }
   render() {
-    return this.open ? k`
+    return this.open ? S`
           <wui-flex @click=${this.onOverlayClick.bind(this)} data-testid="w3m-modal-overlay">
             <wui-card
               shake="${this.shake}"
@@ -163,26 +163,26 @@ let a = class extends v {
     e.target === e.currentTarget && await this.handleClose();
   }
   async handleClose() {
-    const e = h.state.view === "ConnectingSiwe", t = h.state.view === "ApproveTransaction";
+    const e = c.state.view === "ConnectingSiwe", t = c.state.view === "ApproveTransaction";
     if (this.isSiweEnabled) {
-      const { SIWEController: i } = await import("./index-DIBheNE_.js");
+      const { SIWEController: i } = await import("./index-CEUqb47P.js");
       i.state.status !== "success" && (e || t) ? n.shake() : n.close();
     } else
       n.close();
   }
   initializeTheming() {
-    const { themeVariables: e, themeMode: t } = L.state, i = S.getColorTheme(t);
-    E(e, i);
+    const { themeVariables: e, themeMode: t } = L.state, i = x.getColorTheme(t);
+    A(e, i);
   }
   onClose() {
-    this.open = !1, this.classList.remove("open"), this.onScrollUnlock(), A.hide(), this.onRemoveKeyboardListener();
+    this.open = !1, this.classList.remove("open"), this.onScrollUnlock(), E.hide(), this.onRemoveKeyboardListener();
   }
   onOpen() {
     this.open = !0, this.classList.add("open"), this.onScrollLock(), this.onAddKeyboardListener();
   }
   onScrollLock() {
     const e = document.createElement("style");
-    e.dataset.w3m = b, e.textContent = `
+    e.dataset.w3m = g, e.textContent = `
       body {
         touch-action: none;
         overflow: hidden;
@@ -194,7 +194,7 @@ let a = class extends v {
     `, document.head.appendChild(e);
   }
   onScrollUnlock() {
-    const e = document.head.querySelector(`style[data-w3m="${b}"]`);
+    const e = document.head.querySelector(`style[data-w3m="${g}"]`);
     e && e.remove();
   }
   onAddKeyboardListener() {
@@ -214,77 +214,59 @@ let a = class extends v {
     var e;
     (e = this.abortController) == null || e.abort(), this.abortController = void 0;
   }
-  async onNewAddress(e) {
-    var o;
-    if (!this.connected || this.loading)
-      return;
-    const t = f.getPlainAddress(this.caipAddress), i = f.getPlainAddress(e);
-    if (this.caipAddress = e, this.isSiweEnabled) {
-      const { SIWEController: s } = await import("./index-DIBheNE_.js");
-      await s.getSession() && t && i && t !== i && (o = s.state._client) != null && o.options.signOutOnAccountChange && (await s.signOut(), this.onSiweNavigation());
-    }
-  }
-  async onIsConnectedChange(e) {
-    const t = this.connected;
-    if (e && this.isSiweEnabled) {
-      const { SIWEController: i } = await import("./index-DIBheNE_.js");
-      await i.getSession() || this.onSiweNavigation();
-    } else
-      !t && e && (n.close(), h.reset("Connect"));
-    this.connected = e;
-  }
   onSiweStatusChange(e) {
     e === "success" && n.close();
   }
-  onLoadingChange(e) {
-    this.loading = e;
+  async onNewAddress(e) {
+    var o;
+    const t = this.caipAddress ? b.getPlainAddress(this.caipAddress) : void 0, i = e ? b.getPlainAddress(e) : void 0;
+    if (this.isSiweEnabled) {
+      const { SIWEController: s } = await import("./index-CEUqb47P.js"), a = m.state.siweStatus === "success";
+      !t && i ? this.onSiweNavigation() : a && t && i && t !== i && (o = s.state._client) != null && o.options.signOutOnAccountChange && (await s.signOut(), this.onSiweNavigation());
+    }
+    this.caipAddress = e;
   }
   async onNewNetwork(e) {
-    var o, s;
-    if (!this.connected) {
+    var o, s, a, l;
+    if (!this.caipAddress) {
       this.caipNetwork = e;
       return;
     }
-    const t = (o = this.caipNetwork) == null ? void 0 : o.id, i = e == null ? void 0 : e.id;
+    const t = (s = (o = this.caipNetwork) == null ? void 0 : o.id) == null ? void 0 : s.toString(), i = (a = e == null ? void 0 : e.id) == null ? void 0 : a.toString();
     if (t && i && t !== i)
       if (this.isSiweEnabled) {
-        const { SIWEController: r } = await import("./index-DIBheNE_.js");
-        await r.getSession() && (s = r.state._client) != null && s.options.signOutOnNetworkChange && (await r.signOut(), this.onSiweNavigation());
+        const { SIWEController: p } = await import("./index-CEUqb47P.js");
+        (l = p.state._client) != null && l.options.signOutOnNetworkChange ? (await p.signOut(), this.onSiweNavigation()) : c.goBack();
       } else
-        h.goBack();
+        c.goBack();
     this.caipNetwork = e;
   }
   onSiweNavigation() {
-    x.state.activeChain === N.CHAIN.EVM && (this.open ? h.replace("ConnectingSiwe") : n.open({
+    const e = h.state.activeChain === O.CHAIN.EVM;
+    !(m.state.siweStatus === "success") && e ? this.open ? c.replace("ConnectingSiwe") : n.open({
       view: "ConnectingSiwe"
-    }));
+    }) : c.goBack();
   }
 };
-a.styles = K;
-l([
-  c()
-], a.prototype, "open", void 0);
-l([
-  c()
-], a.prototype, "caipAddress", void 0);
-l([
-  c()
-], a.prototype, "caipNetwork", void 0);
-l([
-  c()
-], a.prototype, "isSiweEnabled", void 0);
-l([
-  c()
-], a.prototype, "connected", void 0);
-l([
-  c()
-], a.prototype, "loading", void 0);
-l([
-  c()
-], a.prototype, "shake", void 0);
-a = l([
-  O("w3m-modal")
-], a);
+r.styles = K;
+d([
+  w()
+], r.prototype, "open", void 0);
+d([
+  w()
+], r.prototype, "caipAddress", void 0);
+d([
+  w()
+], r.prototype, "caipNetwork", void 0);
+d([
+  w()
+], r.prototype, "isSiweEnabled", void 0);
+d([
+  w()
+], r.prototype, "shake", void 0);
+r = d([
+  N("w3m-modal")
+], r);
 export {
-  a as W3mModal
+  r as W3mModal
 };

package/dist/w3m-modal-CFTtpDDX.cjs

@@ -0,0 +1,149 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./W3MFrameProviderSingleton-DqZPnx6B.cjs"),u=t.i`
+  :host {
+    z-index: var(--w3m-z-index);
+    display: block;
+    backface-visibility: hidden;
+    will-change: opacity;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    pointer-events: none;
+    opacity: 0;
+    background-color: var(--wui-cover);
+    transition: opacity 0.2s var(--wui-ease-out-power-2);
+    will-change: opacity;
+  }
+
+  :host(.open) {
+    opacity: 1;
+  }
+
+  wui-card {
+    max-width: var(--w3m-modal-width);
+    width: 100%;
+    position: relative;
+    animation: zoom-in 0.2s var(--wui-ease-out-power-2);
+    animation-fill-mode: backwards;
+    outline: none;
+  }
+
+  wui-card[shake='true'] {
+    animation:
+      zoom-in 0.2s var(--wui-ease-out-power-2),
+      w3m-shake 0.5s var(--wui-ease-out-power-2);
+  }
+
+  wui-flex {
+    overflow-x: hidden;
+    overflow-y: auto;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: 100%;
+  }
+
+  @media (max-height: 700px) and (min-width: 431px) {
+    wui-flex {
+      align-items: flex-start;
+    }
+
+    wui-card {
+      margin: var(--wui-spacing-xxl) 0px;
+    }
+  }
+
+  @media (max-width: 430px) {
+    wui-flex {
+      align-items: flex-end;
+    }
+
+    wui-card {
+      max-width: 100%;
+      border-bottom-left-radius: 0;
+      border-bottom-right-radius: 0;
+      border-bottom: none;
+      animation: slide-in 0.2s var(--wui-ease-out-power-2);
+    }
+
+    wui-card[shake='true'] {
+      animation:
+        slide-in 0.2s var(--wui-ease-out-power-2),
+        w3m-shake 0.5s var(--wui-ease-out-power-2);
+    }
+  }
+
+  @keyframes zoom-in {
+    0% {
+      transform: scale(0.95) translateY(0);
+    }
+    100% {
+      transform: scale(1) translateY(0);
+    }
+  }
+
+  @keyframes slide-in {
+    0% {
+      transform: scale(1) translateY(50px);
+    }
+    100% {
+      transform: scale(1) translateY(0);
+    }
+  }
+
+  @keyframes w3m-shake {
+    0% {
+      transform: scale(1) rotate(0deg);
+    }
+    20% {
+      transform: scale(1) rotate(-1deg);
+    }
+    40% {
+      transform: scale(1) rotate(1.5deg);
+    }
+    60% {
+      transform: scale(1) rotate(-1.5deg);
+    }
+    80% {
+      transform: scale(1) rotate(1deg);
+    }
+    100% {
+      transform: scale(1) rotate(0deg);
+    }
+  }
+
+  @keyframes w3m-view-height {
+    from {
+      height: var(--prev-height);
+    }
+    to {
+      height: var(--new-height);
+    }
+  }
+`;var l=function(d,e,o,i){var s=arguments.length,n=s<3?e:i===null?i=Object.getOwnPropertyDescriptor(e,o):i,r;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")n=Reflect.decorate(d,e,o,i);else for(var a=d.length-1;a>=0;a--)(r=d[a])&&(n=(s<3?r(n):s>3?r(e,o,n):r(e,o))||n);return s>3&&n&&Object.defineProperty(e,o,n),n};const h="scroll-lock";exports.W3mModal=class extends t.h{constructor(){super(),this.unsubscribe=[],this.abortController=void 0,this.open=t.ModalController.state.open,this.caipAddress=t.ChainController.state.activeCaipAddress,this.caipNetwork=t.ChainController.state.activeCaipNetwork,this.isSiweEnabled=t.OptionsController.state.isSiweEnabled,this.shake=t.ModalController.state.shake,this.initializeTheming(),t.ApiController.prefetch(),this.unsubscribe.push(t.ModalController.subscribeKey("open",e=>e?this.onOpen():this.onClose()),t.ModalController.subscribeKey("shake",e=>this.shake=e),t.AccountController.subscribeKey("siweStatus",e=>this.onSiweStatusChange(e),"eip155"),t.ChainController.subscribeKey("activeCaipNetwork",e=>this.onNewNetwork(e)),t.ChainController.subscribeKey("activeCaipAddress",e=>this.onNewAddress(e)),t.OptionsController.subscribeKey("isSiweEnabled",e=>this.isSiweEnabled=e)),t.EventsController.sendEvent({type:"track",event:"MODAL_LOADED"})}disconnectedCallback(){this.unsubscribe.forEach(e=>e()),this.onRemoveKeyboardListener()}render(){return this.open?t.ke`
+          <wui-flex @click=${this.onOverlayClick.bind(this)} data-testid="w3m-modal-overlay">
+            <wui-card
+              shake="${this.shake}"
+              role="alertdialog"
+              aria-modal="true"
+              tabindex="0"
+              data-testid="w3m-modal-card"
+            >
+              <w3m-header></w3m-header>
+              <w3m-router></w3m-router>
+              <w3m-snackbar></w3m-snackbar>
+            </wui-card>
+          </wui-flex>
+          <w3m-tooltip></w3m-tooltip>
+        `:null}async onOverlayClick(e){e.target===e.currentTarget&&await this.handleClose()}async handleClose(){const e=t.RouterController.state.view==="ConnectingSiwe",o=t.RouterController.state.view==="ApproveTransaction";if(this.isSiweEnabled){const{SIWEController:i}=await Promise.resolve().then(()=>require("./index-DoLWLaij.cjs"));i.state.status!=="success"&&(e||o)?t.ModalController.shake():t.ModalController.close()}else t.ModalController.close()}initializeTheming(){const{themeVariables:e,themeMode:o}=t.ThemeController.state,i=t.UiHelperUtil.getColorTheme(o);t.initializeTheming(e,i)}onClose(){this.open=!1,this.classList.remove("open"),this.onScrollUnlock(),t.SnackController.hide(),this.onRemoveKeyboardListener()}onOpen(){this.open=!0,this.classList.add("open"),this.onScrollLock(),this.onAddKeyboardListener()}onScrollLock(){const e=document.createElement("style");e.dataset.w3m=h,e.textContent=`
+      body {
+        touch-action: none;
+        overflow: hidden;
+        overscroll-behavior: contain;
+      }
+      w3m-modal {
+        pointer-events: auto;
+      }
+    `,document.head.appendChild(e)}onScrollUnlock(){const e=document.head.querySelector(`style[data-w3m="${h}"]`);e&&e.remove()}onAddKeyboardListener(){var o;this.abortController=new AbortController;const e=(o=this.shadowRoot)==null?void 0:o.querySelector("wui-card");e==null||e.focus(),window.addEventListener("keydown",i=>{if(i.key==="Escape")this.handleClose();else if(i.key==="Tab"){const{tagName:s}=i.target;s&&!s.includes("W3M-")&&!s.includes("WUI-")&&(e==null||e.focus())}},this.abortController)}onRemoveKeyboardListener(){var e;(e=this.abortController)==null||e.abort(),this.abortController=void 0}onSiweStatusChange(e){e==="success"&&t.ModalController.close()}async onNewAddress(e){var s;const o=this.caipAddress?t.CoreHelperUtil.getPlainAddress(this.caipAddress):void 0,i=e?t.CoreHelperUtil.getPlainAddress(e):void 0;if(this.isSiweEnabled){const{SIWEController:n}=await Promise.resolve().then(()=>require("./index-DoLWLaij.cjs")),r=t.AccountController.state.siweStatus==="success";!o&&i?this.onSiweNavigation():r&&o&&i&&o!==i&&(s=n.state._client)!=null&&s.options.signOutOnAccountChange&&(await n.signOut(),this.onSiweNavigation())}this.caipAddress=e}async onNewNetwork(e){var s,n,r,a;if(!this.caipAddress){this.caipNetwork=e;return}const o=(n=(s=this.caipNetwork)==null?void 0:s.id)==null?void 0:n.toString(),i=(r=e==null?void 0:e.id)==null?void 0:r.toString();if(o&&i&&o!==i)if(this.isSiweEnabled){const{SIWEController:c}=await Promise.resolve().then(()=>require("./index-DoLWLaij.cjs"));(a=c.state._client)!=null&&a.options.signOutOnNetworkChange?(await c.signOut(),this.onSiweNavigation()):t.RouterController.goBack()}else t.RouterController.goBack();this.caipNetwork=e}onSiweNavigation(){const e=t.ChainController.state.activeChain===t.ConstantsUtil$1.CHAIN.EVM;!(t.AccountController.state.siweStatus==="success")&&e?this.open?t.RouterController.replace("ConnectingSiwe"):t.ModalController.open({view:"ConnectingSiwe"}):t.RouterController.goBack()}};exports.W3mModal.styles=u;l([t.r()],exports.W3mModal.prototype,"open",void 0);l([t.r()],exports.W3mModal.prototype,"caipAddress",void 0);l([t.r()],exports.W3mModal.prototype,"caipNetwork",void 0);l([t.r()],exports.W3mModal.prototype,"isSiweEnabled",void 0);l([t.r()],exports.W3mModal.prototype,"shake",void 0);exports.W3mModal=l([t.customElement("w3m-modal")],exports.W3mModal);