1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[7897],{3477:(e,t,r)=>{r(39909)},77897:(e,t,r)=>{r.r(t),r.d(t,{W3mBuyInProgressView:()=>M,W3mOnRampProvidersView:()=>R,W3mOnrampFiatSelectView:()=>h,W3mOnrampTokensView:()=>A,W3mOnrampWidget:()=>Z,W3mWhatIsABuyView:()=>E});var i=r(56059),o=r(81767),n=r(55284),s=r(20134),a=r(12573),c=r(12488),u=r(18627),l=r(53984),d=r(2076);r(6647),r(42978),r(66803),r(69542);let p=(0,d.AH)` 2 :host > wui-grid { 3 max-height: 360px; 4 overflow: auto; 5 } 6 7 wui-flex { 8 transition: opacity ${({easings:e})=>e["ease-out-power-1"]} 9 ${({durations:e})=>e.md}; 10 will-change: opacity; 11 } 12 13 wui-grid::-webkit-scrollbar { 14 display: none; 15 } 16 17 wui-flex.disabled { 18 opacity: 0.3; 19 pointer-events: none; 20 user-select: none; 21 } 22`;var m=function(e,t,r,i){var o,n=arguments.length,s=n<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,r):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,r,i);else for(var a=e.length-1;a>=0;a--)(o=e[a])&&(s=(n<3?o(s):n>3?o(t,r,s):o(t,r))||s);return n>3&&s&&Object.defineProperty(t,r,s),s};let h=class extends i.WF{constructor(){super(),this.unsubscribe=[],this.selectedCurrency=s.aG.state.paymentCurrency,this.currencies=s.aG.state.paymentCurrencies,this.currencyImages=a.j.state.currencyImages,this.checked=c.o.state.isLegalCheckboxChecked,this.unsubscribe.push(s.aG.subscribe(e=>{this.selectedCurrency=e.paymentCurrency,this.currencies=e.paymentCurrencies}),a.j.subscribeKey("currencyImages",e=>this.currencyImages=e),c.o.subscribeKey("isLegalCheckboxChecked",e=>{this.checked=e}))}disconnectedCallback(){this.unsubscribe.forEach(e=>e())}render(){let{termsConditionsUrl:e,privacyPolicyUrl:t}=u.H.state,r=u.H.state.features?.legalCheckbox,o=!!(e||t)&&!!r&&!this.checked;return(0,i.qy)` 23 <w3m-legal-checkbox></w3m-legal-checkbox> 24 <wui-flex 25 flexDirection="column" 26 .padding=${["0","3","3","3"]} 27 gap="2" 28 class=${(0,n.J)(o?"disabled":void 0)} 29 > 30 ${this.currenciesTemplate(o)} 31 </wui-flex> 32 `}currenciesTemplate(e=!1){return this.currencies.map(t=>(0,i.qy)` 33 <wui-list-item 34 imageSrc=${(0,n.J)(this.currencyImages?.[t.id])} 35 @click=${()=>this.selectCurrency(t)} 36 variant="image" 37 tabIdx=${(0,n.J)(e?-1:void 0)} 38 > 39 <wui-text variant="md-medium" color="primary">${t.id}</wui-text> 40 </wui-list-item> 41 `)}selectCurrency(e){e&&(s.aG.setPaymentCurrency(e),l.W.close())}};h.styles=p,m([(0,o.wk)()],h.prototype,"selectedCurrency",void 0),m([(0,o.wk)()],h.prototype,"currencies",void 0),m([(0,o.wk)()],h.prototype,"currencyImages",void 0),m([(0,o.wk)()],h.prototype,"checked",void 0),h=m([(0,d.EM)("w3m-onramp-fiat-select-view")],h);var y=r(82376),w=r(26274),f=r(33432),g=r(42242),b=r(89188),v=r(47482),x=r(28877);r(48029),r(3477),r(73732),r(28770);let k=(0,d.AH)` 42 button { 43 padding: ${({spacing:e})=>e["3"]}; 44 border-radius: ${({borderRadius:e})=>e["4"]}; 45 border: none; 46 outline: none; 47 background-color: ${({tokens:e})=>e.core.glass010}; 48 width: 100%; 49 display: flex; 50 align-items: center; 51 justify-content: flex-start; 52 gap: ${({spacing:e})=>e["3"]}; 53 transition: background-color ${({easings:e})=>e["ease-out-power-1"]} 54 ${({durations:e})=>e.md}; 55 will-change: background-color; 56 cursor: pointer; 57 } 58 59 button:hover { 60 background-color: ${({tokens:e})=>e.theme.foregroundPrimary}; 61 } 62 63 .provider-image { 64 width: ${({spacing:e})=>e["10"]}; 65 min-width: ${({spacing:e})=>e["10"]}; 66 height: ${({spacing:e})=>e["10"]}; 67 border-radius: calc( 68 ${({borderRadius:e})=>e["4"]} - calc(${({spacing:e})=>e["3"]} / 2) 69 ); 70 position: relative; 71 overflow: hidden; 72 } 73 74 .network-icon { 75 width: ${({spacing:e})=>e["3"]}; 76 height: ${({spacing:e})=>e["3"]}; 77 border-radius: calc(${({spacing:e})=>e["3"]} / 2); 78 overflow: hidden; 79 box-shadow: 80 0 0 0 3px ${({tokens:e})=>e.theme.foregroundPrimary}, 81 0 0 0 3px ${({tokens:e})=>e.theme.backgroundPrimary}; 82 transition: box-shadow ${({easings:e})=>e["ease-out-power-1"]} 83 ${({durations:e})=>e.md}; 84 will-change: box-shadow; 85 } 86 87 button:hover .network-icon { 88 box-shadow: 89 0 0 0 3px ${({tokens:e})=>e.core.glass010}, 90 0 0 0 3px ${({tokens:e})=>e.theme.backgroundPrimary}; 91 } 92`;var $=function(e,t,r,i){var o,n=arguments.length,s=n<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,r):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,r,i
92);else for(var a=e.length-1;a>=0;a--)(o=e[a])&&(s=(n<3?o(s):n>3?o(t,r,s):o(t,r))||s);return n>3&&s&&Object.defineProperty(t,r,s),s};let C=class extends i.WF{constructor(){super(...arguments),this.disabled=!1,this.color="inherit",this.label="",this.feeRange="",this.loading=!1,this.onClick=null}render(){return(0,i.qy)` 93 <button ?disabled=${this.disabled} @click=${this.onClick} ontouchstart> 94 <wui-visual name=${(0,n.J)(this.name)} class="provider-image"></wui-visual> 95 <wui-flex flexDirection="column" gap="01"> 96 <wui-text variant="md-regular" color="primary">${this.label}</wui-text> 97 <wui-flex alignItems="center" justifyContent="flex-start" gap="4"> 98 <wui-text variant="sm-medium" color="primary"> 99 <wui-text variant="sm-regular" color="secondary">Fees</wui-text> 100 ${this.feeRange} 101 </wui-text> 102 <wui-flex gap="2"> 103 <wui-icon name="bank" size="sm" color="default"></wui-icon> 104 <wui-icon name="card" size="sm" color="default"></wui-icon> 105 </wui-flex> 106 ${this.networksTemplate()} 107 </wui-flex> 108 </wui-flex> 109 ${this.loading?(0,i.qy)`<wui-loading-spinner color="secondary" size="md"></wui-loading-spinner>`:(0,i.qy)`<wui-icon name="chevronRight" color="default" size="sm"></wui-icon>`} 110 </button> 111 `}networksTemplate(){let e=y.W.getAllRequestedCaipNetworks(),t=e?.filter(e=>e?.assets?.imageId)?.slice(0,5);return(0,i.qy)` 112 <wui-flex class="networks"> 113 ${t?.map(e=>(0,i.qy)` 114 <wui-flex class="network-icon"> 115 <wui-image src=${(0,n.J)(x.$.getNetworkImage(e))}></wui-image> 116 </wui-flex> 117 `)} 118 </wui-flex> 119 `}};C.styles=[k],$([(0,o.MZ)({type:Boolean})],C.prototype,"disabled",void 0),$([(0,o.MZ)()],C.prototype,"color",void 0),$([(0,o.MZ)()],C.prototype,"name",void 0),$([(0,o.MZ)()],C.prototype,"label",void 0),$([(0,o.MZ)()],C.prototype,"feeRange",void 0),$([(0,o.MZ)({type:Boolean})],C.prototype,"loading",void 0),$([(0,o.MZ)()],C.prototype,"onClick",void 0),C=$([(0,d.EM)("w3m-onramp-provider-item")],C),r(62736);var P=function(e,t,r,i){var o,n=arguments.length,s=n<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,r):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,r,i);else for(var a=e.length-1;a>=0;a--)(o=e[a])&&(s=(n<3?o(s):n>3?o(t,r,s):o(t,r))||s);return n>3&&s&&Object.defineProperty(t,r,s),s};let R=class extends i.WF{constructor(){super(),this.unsubscribe=[],this.providers=s.aG.state.providers,this.unsubscribe.push(s.aG.subscribeKey("providers",e=>{this.providers=e}))}render(){return(0,i.qy)` 120 <wui-flex flexDirection="column" .padding=${["0","3","3","3"]} gap="2"> 121 ${this.onRampProvidersTemplate()} 122 </wui-flex> 123 `}onRampProvidersTemplate(){return this.providers.filter(e=>e.supportedChains.includes(y.W.state.activeChain??"eip155")).map(e=>(0,i.qy)` 124 <w3m-onramp-provider-item 125 label=${e.label} 126 name=${e.name} 127 feeRange=${e.feeRange} 128 @click=${()=>{this.onClickProvider(e)}} 129 ?disabled=${!e.url} 130 data-testid=${`onramp-provider-${e.name}`} 131 ></w3m-onramp-provider-item> 132 `)}onClickProvider(e){s.aG.setSelectedProvider(e),w.I.push("BuyInProgress"),f.w.openHref(s.aG.state.selectedProvider?.url||e.url,"popupWindow","width=600,height=800,scrollbars=yes"),g.E.sendEvent({type:"track",event:"SELECT_BUY_PROVIDER",properties:{provider:e.name,isSmartAccount:(0,b.lj)(y.W.state.activeChain)===v.Vl.ACCOUNT_TYPES.SMART_ACCOUNT}})}};P([(0,o.wk)()],R.prototype,"providers",void 0),R=P([(0,d.EM)("w3m-onramp-providers-view")],R),r(80847);let I=(0,d.AH)` 133 :host > wui-grid { 134 max-height: 360px; 135 overflow: auto; 136 } 137 138 wui-flex { 139 transition: opacity ${({easings:e})=>e["ease-out-power-1"]} 140 ${({durations:e})=>e.md}; 141 will-change: opacity; 142 } 143 144 wui-grid::-webkit-scrollbar {
145 display: none; 146 } 147 148 wui-flex.disabled { 149 opacity: 0.3; 150 pointer-events: none; 151 user-select: none; 152 } 153`;var O=function(e,t,r,i){var o,n=arguments.length,s=n<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,r):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,r,i);else for(var a=e.length-1;a>=0;a--)(o=e[a])&&(s=(n<3?o(s):n>3?o(t,r,s):o(t,r))||s);return n>3&&s&&Object.defineProperty(t,r,s),s};let A=class extends i.WF{constructor(){super(),this.unsubscribe=[],this.selectedCurrency=s.aG.state.purchaseCurrencies,this.tokens=s.aG.state.purchaseCurrencies,this.tokenImages=a.j.state.tokenImages,this.checked=c.o.state.isLegalCheckboxChecked,this.unsubscribe.push(s.aG.subscribe(e=>{this.selectedCurrency=e.purchaseCurrencies,this.tokens=e.purchaseCurrencies}),a.j.subscribeKey("tokenImages",e=>this.tokenImages=e),c.o.subscribeKey("isLegalCheckboxChecked",e=>{this.checked=e}))}disconnectedCallback(){this.unsubscribe.forEach(e=>e())}render(){let{termsConditionsUrl:e,privacyPolicyUrl:t}=u.H.state,r=u.H.state.features?.legalCheckbox,o=!!(e||t)&&!!r&&!this.checked;return(0,i.qy)` 154 <w3m-legal-checkbox></w3m-legal-checkbox> 155 <wui-flex 156 flexDirection="column" 157 .padding=${["0","3","3","3"]} 158 gap="2" 159 class=${(0,n.J)(o?"disabled":void 0)} 160 > 161 ${this.currenciesTemplate(o)} 162 </wui-flex> 163 `}currenciesTemplate(e=!1){return this.tokens.map(t=>(0,i.qy)` 164 <wui-list-item 165 imageSrc=${(0,n.J)(this.tokenImages?.[t.symbol])} 166 @click=${()=>this.selectToken(t)} 167 variant="image" 168 tabIdx=${(0,n.J)(e?-1:void 0)} 169 > 170 <wui-flex gap="1" alignItems="center"> 171 <wui-text variant="md-medium" color="primary">${t.name}</wui-text> 172 <wui-text variant="sm-regular" color="secondary">${t.symbol}</wui-text> 173 </wui-flex> 174 </wui-list-item> 175 `)}selectToken(e){e&&(s.aG.setPurchaseCurrency(e),l.W.close())}};A.styles=I,O([(0,o.wk)()],A.prototype,"selectedCurrency",void 0),O([(0,o.wk)()],A.prototype,"tokens",void 0),O([(0,o.wk)()],A.prototype,"tokenImages",void 0),O([(0,o.wk)()],A.prototype,"checked",void 0),A=O([(0,d.EM)("w3m-onramp-token-select-view")],A);var j=r(36071),W=r(51636),q=r(82875);r(56060),r(23833),r(9266),r(35159);let G=(0,d.AH)` 176 @keyframes shake { 177 0% { 178 transform: translateX(0); 179 } 180 25% { 181 transform: translateX(3px); 182 } 183 50% { 184 transform: translateX(-3px); 185 } 186 75% { 187 transform: translateX(3px); 188 } 189 100% { 190 transform: translateX(0); 191 } 192 } 193 194 wui-flex:first-child:not(:only-child) { 195 position: relative; 196 } 197 198 wui-loading-thumbnail { 199 position: absolute; 200 } 201 202 wui-visual { 203 border-radius: calc( 204 ${({borderRadius:e})=>e["1"]} * 9 - ${({borderRadius:e})=>e["3"]} 205 ); 206 position: relative; 207 overflow: hidden; 208 } 209 210 wui-icon-box { 211 position: absolute; 212 right: calc(${({spacing:e})=>e["1"]} * -1); 213 bottom: calc(${({spacing:e})=>e["1"]} * -1); 214 opacity: 0; 215 transform: scale(0.5); 216 transition: 217 opacity ${({durations:e})=>e.lg} ${({easings:e})=>e["ease-out-power-2"]}, 218 transform ${({durations:e})=>e.lg} 219 ${({easings:e})=>e["ease-out-power-2"]}; 220 will-change: opacity, transform; 221 } 222 223 wui-text[align='center'] { 224 width: 100%; 225 padding: 0px ${({spacing:e})=>e["4"]}; 226 } 227 228 [data-error='true'] wui-icon-box { 229 opacity: 1; 230 transform: scale(1); 231 } 232 233 [data-error='true'] > wui-flex:first-child { 234 animation: shake 250ms ${({easings:e})=>e["ease-out-power-2"]} both; 235 } 236 237 [data-retry='false'] wui-link { 238 display: none; 239 } 240 241 [data-retry='true'] wui-link { 242 display: block; 243 opacity: 1; 244 } 245 246 wui-link { 247 padding: ${({spacing:e})=>e["01"]} ${({spacing:e})=>e["2"]}; 248 } 249`;var T=function(e,t,r,i){var o,n=arguments.length,s=n<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,r):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,r,i);else for(var a=e.length-1;a>=0;a--)(o=e[a])&&(s=(n<3?o(s):n>3?o(t,r,s):o(t,r))||s);return n>3&&s&&Object.defineProperty(t,r,s),s};let M=class extends i.WF{constructor(){super(),this.unsubscribe=[],this.selectedOnRampProvider=s.aG.state.selectedProvider,this.uri=j.x.state.wcUri,this.ready=!1,this.showRetry=!1,this.buffering=!1,this.error=!1,this.isMobile=!1,this.onRetry=void 0,this.unsubscribe.push(s.aG.subscribeKey("selectedProvider",e=>{this.selectedOnRampProvider=e}))}disconnectedCallback(){this.intervalId&&clearInterval(this.intervalId)}render(){let e="Continue in external window";this.error?e="Buy failed":this.selectedOnRampProvider&&(e=`Buy in ${this.selectedOnRampProvider?.label}`);let t=this.error?"Buy can be declined from your side or due to and error on the provider app":`Weâll notify you once your Buy is processed`;return(0,i.qy)` 250 <wui-flex 251 data-error=${(0,n.J)(this.error)} 252 data-retry=${this.showRetry} 253 flexDirection="column" 254 alignItems="center" 255 .padding=${["10","5","5","5"]} 256 gap="5" 257 > 258 <wui-flex justifyContent="center" alignItems="center"> 259 <wui-visual
260 name=${(0,n.J)(this.selectedOnRampProvider?.name)} 261 size="lg" 262 class="provider-image" 263 > 264 </wui-visual> 265 266 ${this.error?null:this.loaderTemplate()} 267 268 <wui-icon-box 269 color="error" 270 icon="close" 271 size="sm" 272 border 273 borderColor="wui-color-bg-125" 274 ></wui-icon-box> 275 </wui-flex> 276 277 <wui-flex 278 flexDirection="column" 279 alignItems="center" 280 gap="2" 281 .padding=${["4","0","0","0"]} 282 > 283 <wui-text variant="md-medium" color=${this.error?"error":"primary"}> 284 ${e} 285 </wui-text> 286 <wui-text align="center" variant="sm-medium" color="secondary">${t}</wui-text> 287 </wui-flex> 288 289 ${this.error?this.tryAgainTemplate():null} 290 </wui-flex> 291 292 <wui-flex .padding=${["0","5","5","5"]} justifyContent="center"> 293 <wui-link @click=${this.onCopyUri} color="secondary"> 294 <wui-icon size="sm" color="default" slot="iconLeft" name="copy"></wui-icon> 295 Copy link 296 </wui-link> 297 </wui-flex> 298 `}onTryAgain(){this.selectedOnRampProvider&&(this.error=!1,f.w.openHref(this.selectedOnRampProvider.url,"popupWindow","width=600,height=800,scrollbars=yes"))}tryAgainTemplate(){return this.selectedOnRampProvider?.url?(0,i.qy)`<wui-button size="md" variant="accent" @click=${this.onTryAgain.bind(this)}> 299 <wui-icon color="inherit" slot="iconLeft" name="refresh"></wui-icon> 300 Try again 301 </wui-button>`:null}loaderTemplate(){let e=W.W.state.themeVariables["--w3m-border-radius-master"],t=e?parseInt(e.replace("px",""),10):4;return(0,i.qy)`<wui-loading-thumbnail radius=${9*t}></wui-loading-thumbnail>`}onCopyUri(){if(!this.selectedOnRampProvider?.url){q.P.showError("No link found"),w.I.goBack();return}try{f.w.copyToClopboard(this.selectedOnRampProvider.url),q.P.showSuccess("Link copied")}catch{q.P.showError("Failed to copy")}}};M.styles=G,T([(0,o.wk)()],M.prototype,"intervalId",void 0),T([(0,o.wk)()],M.prototype,"selectedOnRampProvider",void 0),T([(0,o.wk)()],M.prototype,"uri",void 0),T([(0,o.wk)()],M.prototype,"ready",void 0),T([(0,o.wk)()],M.prototype,"showRetry",void 0),T([(0,o.wk)()],M.prototype,"buffering",void 0),T([(0,o.wk)()],M.prototype,"error",void 0),T([(0,o.MZ)({type:Boolean})],M.prototype,"isMobile",void 0),T([(0,o.MZ)()],M.prototype,"onRetry",void 0),M=T([(0,d.EM)("w3m-buy-in-progress-view")],M);let E=class extends i.WF{render(){return(0,i.qy)` 302 <wui-flex 303 flexDirection="column" 304 .padding=${["6","10","5","10"]} 305 alignItems="center" 306 gap="5" 307 > 308 <wui-visual name="onrampCard"></wui-visual> 309 <wui-flex flexDirection="column" gap="2" alignItems="center"> 310 <wui-text align="center" variant="md-medium" color="primary"> 311 Quickly and easily buy digital assets! 312 </wui-text> 313 <wui-text align="center" variant="sm-regular" color="secondary"> 314 Simply select your preferred onramp provider and add digital assets to your account 315 using your credit card or bank transfer 316 </wui-text> 317 </wui-flex> 318 <wui-button @click=${w.I.goBack}> 319 <wui-icon size="sm" color="inherit" name="add" slot="iconLeft"></wui-icon> 320 Buy 321 </wui-button> 322 </wui-flex> 323 `}};E=function(e,t,r,i){var o,n=arguments.length,s=n<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,r):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,r,i);else for(var a=e.length-1;a>=0;a--)(o=e[a])&&(s=(n<3?o(s):n>3?o(t,r,s):o(t,r))||s);return n>3&&s&&Object.defineProperty(t,r,s),s}([(0,d.EM)("w3m-what-is-a-buy-view")],E),r(77652);let D=(0,d.AH)` 324 :host { 325 width: 100%; 326 } 327 328 wui-loading-spinner { 329 position: absolute; 330 top: 50%; 331 right: 20px; 332 transform: translateY(-50%); 333 } 334 335 .currency-container { 336 position: absolute; 337 top: 50%; 338 transform: translateY(-50%); 339 right: ${({spacing:e})=>e["2"]}; 340 height: 40px; 341 padding: ${({spacing:e})=>e["2"]} ${({spacing:e})=>e["2"]} 342 ${({spacing:e})=>e["2"]} ${({spacing:e})=>e["2"]}; 343 min-width: 95px; 344 border-radius: ${({borderRadius:e})=>e.round}; 345 border: 1px solid ${({tokens:e})=>e.theme.foregroundPrimary}; 346 background: ${({tokens:e})=>e.theme.foregroundPrimary}; 347 cursor: pointer; 348 } 349 350 .currency-container > wui-image { 351 height: 24px; 352 width: 24px; 353 border-radius: 50%; 354 } 355`;var B=function(e,t,r,i){var o,n=arguments.length,s=n<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,r):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,r,i
355);else for(var a=e.length-1;a>=0;a--)(o=e[a])&&(s=(n<3?o(s):n>3?o(t,r,s):o(t,r))||s);return n>3&&s&&Object.defineProperty(t,r,s),s};let L=class extends i.WF{constructor(){super(),this.unsubscribe=[],this.type="Token",this.value=0,this.currencies=[],this.selectedCurrency=this.currencies?.[0],this.currencyImages=a.j.state.currencyImages,this.tokenImages=a.j.state.tokenImages,this.unsubscribe.push(s.aG.subscribeKey("purchaseCurrency",e=>{e&&"Fiat"!==this.type&&(this.selectedCurrency=this.formatPurchaseCurrency(e))}),s.aG.subscribeKey("paymentCurrency",e=>{e&&"Token"!==this.type&&(this.selectedCurrency=this.formatPaymentCurrency(e))}),s.aG.subscribe(e=>{"Fiat"===this.type?this.currencies=e.purchaseCurrencies.map(this.formatPurchaseCurrency):this.currencies=e.paymentCurrencies.map(this.formatPaymentCurrency)}),a.j.subscribe(e=>{this.currencyImages={...e.currencyImages},this.tokenImages={...e.tokenImages}}))}firstUpdated(){s.aG.getAvailableCurrencies()}disconnectedCallback(){this.unsubscribe.forEach(e=>e())}render(){let e=this.selectedCurrency?.symbol||"",t=this.currencyImages[e]||this.tokenImages[e];return(0,i.qy)`<wui-input-text type="number" size="lg" value=${this.value}> 356 ${this.selectedCurrency?(0,i.qy)` <wui-flex 357 class="currency-container" 358 justifyContent="space-between" 359 alignItems="center" 360 gap="1" 361 @click=${()=>l.W.open({view:`OnRamp${this.type}Select`})} 362 > 363 <wui-image src=${(0,n.J)(t)}></wui-image> 364 <wui-text color="primary">${this.selectedCurrency.symbol}</wui-text> 365 </wui-flex>`:(0,i.qy)`<wui-loading-spinner></wui-loading-spinner>`} 366 </wui-input-text>`}formatPaymentCurrency(e){return{name:e.id,symbol:e.id}}formatPurchaseCurrency(e){return{name:e.name,symbol:e.symbol}}};L.styles=D,B([(0,o.MZ)({type:String})],L.prototype,"type",void 0),B([(0,o.MZ)({type:Number})],L.prototype,"value",void 0),B([(0,o.wk)()],L.prototype,"currencies",void 0),B([(0,o.wk)()],L.prototype,"selectedCurrency",void 0),B([(0,o.wk)()],L.prototype,"currencyImages",void 0),B([(0,o.wk)()],L.prototype,"tokenImages",void 0),L=B([(0,d.EM)("w3m-onramp-input")],L);let F=(0,d.AH)` 367 :host > wui-flex { 368 width: 100%; 369 max-width: 360px; 370 } 371 372 :host > wui-flex > wui-flex { 373 border-radius: ${({borderRadius:e})=>e["8"]}; 374 width: 100%; 375 } 376 377 .amounts-container { 378 width: 100%; 379 } 380`;var S=function(e,t,r,i){var o,n=arguments.length,s=n<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,r):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,r,i);else for(var a=e.length-1;a>=0;a--)(o=e[a])&&(s=(n<3?o(s):n>3?o(t,r,s):o(t,r))||s);return n>3&&s&&Object.defineProperty(t,r,s),s};let z={USD:"$",EUR:"â¬",GBP:"\xa3"},H=[100,250,500,1e3],Z=class extends i.WF{constructor(){super(),this.unsubscribe=[],this.disabled=!1,this.caipAddress=y.W.state.activeCaipAddress,this.loading=l.W.state.loading,this.paymentCurrency=s.aG.state.paymentCurrency,this.paymentAmount=s.aG.state.paymentAmount,this.purchaseAmount=s.aG.state.purchaseAmount,this.quoteLoading=s.aG.state.quotesLoading,this.unsubscribe.push(y.W.subscribeKey("activeCaipAddress",e=>this.caipAddress=e),l.W.subscribeKey("loading",e=>{this.loading=e}),s.aG.subscribe(e=>{this.paymentCurrency=e.paymentCurrency,this.paymentAmount=e.paymentAmount,this.purchaseAmount=e.purchaseAmount,this.quoteLoading=e.quotesLoading}))}disconnectedCallback(){this.unsubscribe.forEach(e=>e())}render(){return(0,i.qy)` 381 <wui-flex flexDirection="column" justifyContent="center" alignItems="center"> 382 <wui-flex flexDirection="column" alignItems="center" gap="2"> 383 <w3m-onramp-input 384 type="Fiat" 385 @inputChange=${this.onPaymentAmountChange.bind(this)} 386 .value=${this.paymentAmount||0} 387 ></w3m-onramp-input> 388 <w3m-onramp-input 389 type="Token" 390 .value=${this.purchaseAmount||0} 391 .loading=${this.quoteLoading} 392 ></w3m-onramp-input> 393 <wui-flex justifyContent="space-evenly" class="amounts-container" gap="2"> 394 ${H.map(e=>(0,i.qy)`<wui-button 395 variant=${this.paymentAmount===e?"accent-secondary":"neutral-secondary"} 396 size="md" 397 textVariant="md-medium" 398 fullWidth 399 @click=${()=>this.selectPresetAmount(e)} 400 >${`${z[this.paymentCurrency?.id||"USD"]} ${e}`}</wui-button 401 >`)} 402 </wui-flex> 403 ${this.templateButton()} 404 </wui-flex> 405 </wui-flex> 406 `}templateButton(){return this.caipAddress?(0,i.qy)`<wui-button 407 @click=${this.getQuotes.bind(this)} 408 variant="accent-primary" 409 fullWidth 410 size="lg" 411 borderRadius="xs" 412 > 413 Get quotes 414 </wui-button>
414`:(0,i.qy)`<wui-button 415 @click=${this.openModal.bind(this)} 416 variant="accent" 417 fullWidth 418 size="lg" 419 borderRadius="xs" 420 > 421 Connect wallet 422 </wui-button>`}getQuotes(){this.loading||l.W.open({view:"OnRampProviders"})}openModal(){l.W.open({view:"Connect"})}async onPaymentAmountChange(e){s.aG.setPaymentAmount(Number(e.detail)),await s.aG.getQuote()}async selectPresetAmount(e){s.aG.setPaymentAmount(e),await s.aG.getQuote()}};Z.styles=F,S([(0,o.MZ)({type:Boolean})],Z.prototype,"disabled",void 0),S([(0,o.wk)()],Z.prototype,"caipAddress",void 0),S([(0,o.wk)()],Z.prototype,"loading",void 0),S([(0,o.wk)()],Z.prototype,"paymentCurrency",void 0),S([(0,o.wk)()],Z.prototype,"paymentAmount",void 0),S([(0,o.wk)()],Z.prototype,"purchaseAmount",void 0),S([(0,o.wk)()],Z.prototype,"quoteLoading",void 0),Z=S([(0,d.EM)("w3m-onramp-widget")],Z)}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.