1"use strict";(self.webpackChunkliquidity_dex=self.webpackChunkliquidity_dex||[]).push([[4807],{14807:(e,t,i)=>{i.r(t),i.d(t,{W3mBuyInProgressView:()=>J,W3mOnRampActivityView:()=>b,W3mOnRampProvidersView:()=>G,W3mOnrampFiatSelectView:()=>T,W3mOnrampTokensView:()=>L,W3mOnrampWidget:()=>ae,W3mWhatIsABuyView:()=>Q});var r=i(20443),o=i(86971),s=i(34618),a=i(2649),n=i(46844),c=i(97384),l=i(62025),u=i(6314),d=i(14889),p=i(55516),h=(i(90342),i(3634),i(78964),i(15049));i(23776),i(33135),i(29261);const w=r.AH` 2 :host { 3 width: 100%; 4 } 5 6 :host > wui-flex { 7 width: 100%; 8 padding: var(--wui-spacing-s); 9 border-radius: var(--wui-border-radius-xs); 10 width: 100%; 11 display: flex; 12 align-items: center; 13 justify-content: flex-start; 14 gap: var(--wui-spacing-s); 15 } 16 17 :host > wui-flex:hover { 18 background-color: var(--wui-color-gray-glass-002); 19 } 20 21 .purchase-image-container { 22 display: flex; 23 justify-content: center; 24 align-items: center; 25 position: relative; 26 width: var(--wui-icon-box-size-lg); 27 height: var(--wui-icon-box-size-lg); 28 } 29 30 .purchase-image-container wui-image { 31 width: 100%; 32 height: 100%; 33 position: relative; 34 border-radius: calc(var(--wui-icon-box-size-lg) / 2); 35 } 36 37 .purchase-image-container wui-image::after { 38 content: ''; 39 display: block; 40 width: 100%; 41 height: 100%; 42 position: absolute; 43 inset: 0; 44 border-radius: calc(var(--wui-icon-box-size-lg) / 2); 45 box-shadow: inset 0 0 0 1px var(--wui-color-gray-glass-005); 46 } 47 48 .purchase-image-container wui-icon-box { 49 position: absolute; 50 right: 0; 51 bottom: 0; 52 transform: translate(20%, 20%); 53 } 54`;var m=function(e,t,i,r){var o,s=arguments.length,a=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"===typeof Reflect&&"function"===typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var n=e.length-1;n>=0;n--)(o=e[n])&&(a=(s<3?o(a):s>3?o(t,i,a):o(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};let y=class extends r.WF{constructor(){super(...arguments),this.disabled=!1,this.color="inherit",this.label="Bought",this.purchaseValue="",this.purchaseCurrency="",this.date="",this.completed=!1,this.inProgress=!1,this.failed=!1,this.onClick=null,this.symbol=""}firstUpdated(){this.icon||this.fetchTokenImage()}render(){return r.qy` 55 <wui-flex> 56 ${this.imageTemplate()} 57 <wui-flex flexDirection="column" gap="4xs" flexGrow="1"> 58 <wui-flex gap="xxs" alignItems="center" justifyContent="flex-start"> 59 ${this.statusIconTemplate()} 60 <wui-text variant="paragraph-500" color="fg-100"> ${this.label}</wui-text> 61 </wui-flex> 62 <wui-text variant="small-400" color="fg-200"> 63 + ${this.purchaseValue} ${this.purchaseCurrency} 64 </wui-text> 65 </wui-flex> 66 ${this.inProgress?r.qy`<wui-loading-spinner color="fg-200" size="md"></wui-loading-spinner>`:r.qy`<wui-text variant="micro-700" color="fg-300"><span>${this.date}</span></wui-text>`} 67 </wui-flex> 68 `}async fetchTokenImage(){await h.N._fetchTokenImage(this.purchaseCurrency)}statusIconTemplate(){return this.inProgress?null:this.completed?this.boughtIconTemplate():this.errorIconTemplate()}errorIconTemplate(){return r.qy`<wui-icon-box 69 size="xxs" 70 iconColor="error-100" 71 backgroundColor="error-100" 72 background="opaque" 73 icon="close" 74 borderColor="wui-color-bg-125" 75 ></wui-icon-box>`}imageTemplate(){const e=this.icon||`https://avatar.vercel.sh/andrew.svg?size=50&text=${this.symbol}`;return r.qy`<wui-flex class="purchase-image-container"> 76 <wui-image src=${e}></wui-image> 77 </wui-flex>`}boughtIconTemplate(){return r.qy`<wui-icon-box 78 size="xxs" 79 iconColor="success-100" 80 backgroundColor="success-100" 81 background="opaque" 82 icon="arrowBottom" 83 borderColor="wui-color-bg-125" 84 ></wui-icon-box>`}};y.styles=[w],m([(0,o.MZ)({type:Boolean})],y.prototype,"disabled",void 0),m([(0,o.MZ)()],y.prototype,"color",void 0),m([(0,o.MZ)()],y.prototype,"label",void 0),m([(0,o.MZ)()],y.prototype,"purchaseValue",void 0),m([(0,o.MZ)()],y.prototype,"purchaseCurrency",void 0),m([(0,o.MZ)()],y.prototype,"date",void 0),m([(0,o.MZ)({type:Boolean})],y.prototype,"completed",void 0),m([(0,o.MZ)({type:Boolean})],y.prototype,"inProgress",void 0),m([(0,o.MZ)({type:Boolean})],y.prototype,"failed",void 0),m([(0,o.MZ)()],y.prototype,"onClick",void 0),m([(0,o.MZ)()],y.prototype,"symbol",void 0),m([(0,o.MZ)()],y.prototype,"icon",void 0),y=m([(0,p.EM)("w3m-onramp-activity-item")],y);const g=r.AH` 85 :host > wui-flex { 86 height: 500px; 87 overflow-y: auto; 88 overflow-x: hidden; 89 scrollbar-width: none; 90 padding: var(--wui-spacing-m); 91 box-sizing: border-box; 92 display: flex; 93 align-items: center; 94 justify-content: flex-start; 95 } 96 97 :host > wui-flex::-webkit-scrollbar {
98 display: none; 99 } 100 101 :host > wui-flex > wui-flex { 102 width: 100%; 103 } 104 105 wui-transaction-list-item-loader { 106 width: 100%; 107 } 108`;var f=function(e,t,i,r){var o,s=arguments.length,a=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"===typeof Reflect&&"function"===typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var n=e.length-1;n>=0;n--)(o=e[n])&&(a=(s<3?o(a):s>3?o(t,i,a):o(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};let b=class extends r.WF{constructor(){super(),this.unsubscribe=[],this.selectedOnRampProvider=n.aG.state.selectedProvider,this.loading=!1,this.coinbaseTransactions=c.W.state.coinbaseTransactions,this.tokenImages=l.j.state.tokenImages,this.unsubscribe.push(n.aG.subscribeKey("selectedProvider",(e=>{this.selectedOnRampProvider=e})),l.j.subscribeKey("tokenImages",(e=>this.tokenImages=e)),(()=>{clearTimeout(this.refetchTimeout)}),c.W.subscribe((e=>{this.coinbaseTransactions={...e.coinbaseTransactions}}))),c.W.clearCursor(),this.fetchTransactions()}render(){return r.qy` 109 <wui-flex flexDirection="column" .padding=${["0","s","s","s"]} gap="xs"> 110 ${this.loading?this.templateLoading():this.templateTransactionsByYear()} 111 </wui-flex> 112 `}templateTransactions(e){return e?.map((e=>{const t=a.r.formatDate(e?.metadata?.minedAt),i=e.transfers[0],o=i?.fungible_info;if(!o)return null;const n=o?.icon?.url||this.tokenImages?.[o.symbol||""];return r.qy` 113 <w3m-onramp-activity-item 114 label="Bought" 115 .completed=${"ONRAMP_TRANSACTION_STATUS_SUCCESS"===e.metadata.status} 116 .inProgress=${"ONRAMP_TRANSACTION_STATUS_IN_PROGRESS"===e.metadata.status} 117 .failed=${"ONRAMP_TRANSACTION_STATUS_FAILED"===e.metadata.status} 118 purchaseCurrency=${(0,s.J)(o.symbol)} 119 purchaseValue=${i.quantity.numeric} 120 date=${t} 121 icon=${(0,s.J)(n)} 122 symbol=${(0,s.J)(o.symbol)} 123 ></w3m-onramp-activity-item> 124 `}))}templateTransactionsByYear(){return Object.keys(this.coinbaseTransactions).sort().reverse().map((e=>{const t=parseInt(e,10);return new Array(12).fill(null).map(((e,t)=>t)).reverse().map((e=>{const i=p.tt.getTransactionGroupTitle(t,e),o=this.coinbaseTransactions[t]?.[e];return o?r.qy` 125 <wui-flex flexDirection="column"> 126 <wui-flex 127 alignItems="center" 128 flexDirection="row" 129 .padding=${["xs","s","s","s"]} 130 > 131 <wui-text variant="paragraph-500" color="fg-200">${i}</wui-text> 132 </wui-flex> 133 <wui-flex flexDirection="column" gap="xs"> 134 ${this.templateTransactions(o)} 135 </wui-flex> 136 </wui-flex> 137 `:null}))}))}async fetchTransactions(){await this.fetchCoinbaseTransactions()}async fetchCoinbaseTransactions(){const e=u.U.state.address,t=d.H.state.projectId;if(!e)throw new Error("No address found");if(!t)throw new Error("No projectId found");this.loading=!0,await c.W.fetchTransactions(e,"coinbase"),this.loading=!1,this.refetchLoadingTransactions()}refetchLoadingTransactions(){const e=new Date;0!==(this.coinbaseTransactions[e.getFullYear()]?.[e.getMonth()]||[]).filter((e=>"ONRAMP_TRANSACTION_STATUS_IN_PROGRESS"===e.metadata.status)).length?this.refetchTimeout=setTimeout((async()=>{const e=u.U.state.address;await c.W.fetchTransactions(e,"coinbase"),this.refetchLoadingTransactions()}),3e3):clearTimeout(this.refetchTimeout)}templateLoading(){return Array(7).fill(r.qy` <wui-transaction-list-item-loader></wui-transaction-list-item-loader> `).map((e=>e))}};b.styles=g,f([(0,o.wk)()],b.prototype,"selectedOnRampProvider",void 0),f([(0,o.wk)()],b.prototype,"loading",void 0),f([(0,o.wk)()],b.prototype,"coinbaseTransactions",void 0),f([(0,o.wk)()],b.prototype,"tokenImages",void 0),b=f([(0,p.EM)("w3m-onramp-activity-view")],b);var v=i(63022),x=i(39228);i(48366),i(49728),i(18693);const k=r.AH` 138 :host > wui-grid { 139 max-height: 360px; 140 overflow: auto; 141 } 142 143 wui-flex { 144 transition: opacity var(--wui-ease-out-power-1) var(--wui-duration-md); 145 will-change: opacity; 146 } 147 148 wui-grid::-webkit-scrollbar {
149 display: none; 150 } 151 152 wui-flex.disabled { 153 opacity: 0.3; 154 pointer-events: none; 155 user-select: none; 156 } 157`;var C=function(e,t,i,r){var o,s=arguments.length,a=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"===typeof Reflect&&"function"===typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var n=e.length-1;n>=0;n--)(o=e[n])&&(a=(s<3?o(a):s>3?o(t,i,a):o(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};let T=class extends r.WF{constructor(){super(),this.unsubscribe=[],this.selectedCurrency=n.aG.state.paymentCurrency,this.currencies=n.aG.state.paymentCurrencies,this.currencyImages=l.j.state.currencyImages,this.checked=v.o.state.isLegalCheckboxChecked,this.unsubscribe.push(n.aG.subscribe((e=>{this.selectedCurrency=e.paymentCurrency,this.currencies=e.paymentCurrencies})),l.j.subscribeKey("currencyImages",(e=>this.currencyImages=e)),v.o.subscribeKey("isLegalCheckboxChecked",(e=>{this.checked=e})))}disconnectedCallback(){this.unsubscribe.forEach((e=>e()))}render(){const{termsConditionsUrl:e,privacyPolicyUrl:t}=d.H.state,i=d.H.state.features?.legalCheckbox,o=Boolean(e||t)&&Boolean(i)&&!this.checked;return r.qy` 158 <w3m-legal-checkbox></w3m-legal-checkbox> 159 <wui-flex 160 flexDirection="column" 161 .padding=${["0","s","s","s"]} 162 gap="xs" 163 class=${(0,s.J)(o?"disabled":void 0)} 164 > 165 ${this.currenciesTemplate(o)} 166 </wui-flex> 167 <w3m-legal-footer></w3m-legal-footer> 168 `}currenciesTemplate(){let e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return this.currencies.map((t=>r.qy` 169 <wui-list-item 170 imageSrc=${(0,s.J)(this.currencyImages?.[t.id])} 171 @click=${()=>this.selectCurrency(t)} 172 variant="image" 173 tabIdx=${(0,s.J)(e?-1:void 0)} 174 > 175 <wui-text variant="paragraph-500" color="fg-100">${t.id}</wui-text> 176 </wui-list-item> 177 `))}selectCurrency(e){e&&(n.aG.setPaymentCurrency(e),x.W.close())}};T.styles=k,C([(0,o.wk)()],T.prototype,"selectedCurrency",void 0),C([(0,o.wk)()],T.prototype,"currencies",void 0),C([(0,o.wk)()],T.prototype,"currencyImages",void 0),C([(0,o.wk)()],T.prototype,"checked",void 0),T=C([(0,p.EM)("w3m-onramp-fiat-select-view")],T);var I=i(49176),$=i(13660),R=i(12390),P=i(15224),A=i(48656),O=i(74096),j=i(5211),W=i(82296),M=i(10145);i(89572),i(12612);const E=r.AH` 178 button { 179 padding: var(--wui-spacing-s); 180 border-radius: var(--wui-border-radius-xs); 181 border: none; 182 outline: none; 183 background-color: var(--wui-color-gray-glass-002); 184 width: 100%; 185 display: flex; 186 align-items: center; 187 justify-content: flex-start; 188 gap: var(--wui-spacing-s); 189 transition: background-color var(--wui-ease-out-power-1) var(--wui-duration-md); 190 will-change: background-color; 191 } 192 193 button:hover { 194 background-color: var(--wui-color-gray-glass-005); 195 } 196 197 .provider-image { 198 width: var(--wui-spacing-3xl); 199 min-width: var(--wui-spacing-3xl); 200 height: var(--wui-spacing-3xl); 201 border-radius: calc(var(--wui-border-radius-xs) - calc(var(--wui-spacing-s) / 2)); 202 position: relative; 203 overflow: hidden; 204 } 205 206 .provider-image::after { 207 content: ''; 208 display: block; 209 width: 100%; 210 height: 100%; 211 position: absolute; 212 inset: 0; 213 border-radius: calc(var(--wui-border-radius-xs) - calc(var(--wui-spacing-s) / 2)); 214 box-shadow: inset 0 0 0 1px var(--wui-color-gray-glass-005); 215 } 216 217 .network-icon { 218 width: var(--wui-spacing-m); 219 height: var(--wui-spacing-m); 220 border-radius: calc(var(--wui-spacing-m) / 2); 221 overflow: hidden; 222 box-shadow: 223 0 0 0 3px var(--wui-color-gray-glass-002), 224 0 0 0 3px var(--wui-color-modal-bg); 225 transition: box-shadow var(--wui-ease-out-power-1) var(--wui-duration-md); 226 will-change: box-shadow; 227 } 228 229 button:hover .network-icon { 230 box-shadow: 231 0 0 0 3px var(--wui-color-gray-glass-005), 232 0 0 0 3px var(--wui-color-modal-bg); 233 } 234`;var S=function(e,t,i,r){var o,s=arguments.length,a=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"===typeof Reflect&&"function"===typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var n=e.length-1;n>=0;n--)(o=e[n])&&(a=(s<3?o(a):s>3?o(t,i,a):o(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};let q=class extends r.WF{constructor(){super(...arguments),this.disabled=!1,this.color="inherit",this.label="",this.feeRange="",this.loading=!1,this.onClick=null}render(){return r.qy` 235 <button ?disabled=${this.disabled} @click=${this.onClick} ontouchstart>
236 <wui-visual name=${(0,s.J)(this.name)} class="provider-image"></wui-visual> 237 <wui-flex flexDirection="column" gap="4xs"> 238 <wui-text variant="paragraph-500" color="fg-100">${this.label}</wui-text> 239 <wui-flex alignItems="center" justifyContent="flex-start" gap="l"> 240 <wui-text variant="tiny-500" color="fg-100"> 241 <wui-text variant="tiny-400" color="fg-200">Fees</wui-text> 242 ${this.feeRange} 243 </wui-text> 244 <wui-flex gap="xxs"> 245 <wui-icon name="bank" size="xs" color="fg-150"></wui-icon> 246 <wui-icon name="card" size="xs" color="fg-150"></wui-icon> 247 </wui-flex> 248 ${this.networksTemplate()} 249 </wui-flex> 250 </wui-flex> 251 ${this.loading?r.qy`<wui-loading-spinner color="fg-200" size="md"></wui-loading-spinner>`:r.qy`<wui-icon name="chevronRight" color="fg-200" size="sm"></wui-icon>`} 252 </button> 253 `}networksTemplate(){const e=I.W.getAllRequestedCaipNetworks(),t=e?.filter((e=>e?.assets?.imageId))?.slice(0,5);return r.qy` 254 <wui-flex class="networks"> 255 ${t?.map((e=>r.qy` 256 <wui-flex class="network-icon"> 257 <wui-image src=${(0,s.J)(M.$.getNetworkImage(e))}></wui-image> 258 </wui-flex> 259 `))} 260 </wui-flex> 261 `}};q.styles=[E],S([(0,o.MZ)({type:Boolean})],q.prototype,"disabled",void 0),S([(0,o.MZ)()],q.prototype,"color",void 0),S([(0,o.MZ)()],q.prototype,"name",void 0),S([(0,o.MZ)()],q.prototype,"label",void 0),S([(0,o.MZ)()],q.prototype,"feeRange",void 0),S([(0,o.MZ)({type:Boolean})],q.prototype,"loading",void 0),S([(0,o.MZ)()],q.prototype,"onClick",void 0),q=S([(0,p.EM)("w3m-onramp-provider-item")],q);i(20938);const _=r.AH` 262 wui-flex { 263 border-top: 1px solid var(--wui-color-gray-glass-005); 264 } 265 266 a { 267 text-decoration: none; 268 color: var(--wui-color-fg-175); 269 font-weight: 500; 270 display: flex; 271 align-items: center; 272 justify-content: center; 273 gap: var(--wui-spacing-3xs); 274 } 275`;var D=function(e,t,i,r){var o,s=arguments.length,a=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"===typeof Reflect&&"function"===typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var n=e.length-1;n>=0;n--)(o=e[n])&&(a=(s<3?o(a):s>3?o(t,i,a):o(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};let N=class extends r.WF{render(){const{termsConditionsUrl:e,privacyPolicyUrl:t}=d.H.state;return e||t?r.qy` 276 <wui-flex 277 .padding=${["m","s","s","s"]} 278 flexDirection="column" 279 alignItems="center" 280 justifyContent="center" 281 gap="s" 282 > 283 <wui-text color="fg-250" variant="small-400" align="center"> 284 We work with the best providers to give you the lowest fees and best support. More options 285 coming soon! 286 </wui-text> 287 288 ${this.howDoesItWorkTemplate()} 289 </wui-flex> 290 `:null}howDoesItWorkTemplate(){return r.qy` <wui-link @click=${this.onWhatIsBuy.bind(this)}> 291 <wui-icon size="xs" color="accent-100" slot="iconLeft" name="helpCircle"></wui-icon> 292 How does it work? 293 </wui-link>`}onWhatIsBuy(){const e=I.W.state.activeChain;P.E.sendEvent({type:"track",event:"SELECT_WHAT_IS_A_BUY",properties:{isSmartAccount:(0,A.lj)(e)===W.Vl.ACCOUNT_TYPES.SMART_ACCOUNT}}),$.I.push("WhatIsABuy")}};N.styles=[_],N=D([(0,p.EM)("w3m-onramp-providers-footer")],N);var B=function(e,t,i,r){var o,s=arguments.length,a=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"===typeof Reflect&&"function"===typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var n=e.length-1;n>=0;n--)(o=e[n])&&(a=(s<3?o(a):s>3?o(t,i,a):o(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};let G=class extends r.WF{constructor(){super(),this.unsubscribe=[],this.providers=n.aG.state.providers,this.unsubscribe.push(n.aG.subscribeKey("providers",(e=>{this.providers=e})))}firstUpdated(){const e=this.providers.map((async e=>"coinbase"===e.name?await this.getCoinbaseOnRampURL():Promise.resolve(e?.url)));Promise.all(e).then((e=>{this.providers=this.providers.map(((t,i)=>({...t,url:e[i]||""})))}))}render(){return r.qy` 294 <wui-flex flexDirection="column" .padding=${["0","s","s","s"]} gap="xs"> 295 ${this.onRampProvidersTemplate()} 296 </wui-flex> 297 <w3m-onramp-providers-footer></w3m-onramp-providers-footer> 298 `}onRampProvidersTemplate(){return this.providers.filter((e=>e.supportedChains.includes(I.W.state.activeChain??"eip155"))).map((e=>r.qy` 299 <w3m-onramp-provider-item 300 label=${e.label} 301 name=${e.name} 302 feeRange=${e.feeRange} 303 @click=${()=>{this.onClickProvider(e)}} 304 ?disabled=${!e.url} 305 data-testid=${`onramp-provider-${e.name}`} 306 ></w3m-onramp-provider-item> 307 `))}onClickProvider(e){const t=I.W.state.activeChain;n.aG.setSelectedProvider(e),$.I.push("BuyInProgress"),R.w.openHref(n.aG.state.selectedProvider?.url||e.url,"popupWindow","width=600,height=800,scrollbars=yes"),P.E.sendEvent({type:"track",event:"SELECT_BUY_PROVIDER",properties:{provider:e.name,isSmartAccount:(0,A.lj)(t)===W.Vl.ACCOUNT_TYPES.SMART_ACCOUNT}})}async getCoinbaseOnRampURL(){const e=u.U.state.address,t=I.W.state.activeCaipNetwork;if(!e)throw new Error("No address found");if(!t?.name)throw new Error("No network found");const i=O.oU.WC_COINBASE_PAY_SDK_CHAIN_NAME_MAP[t.name]??O.oU.WC_COINBASE_PAY_SDK_FALLBACK_CHAIN,r=n.aG.state.purchaseCurrency,o=r?[r.symbol]:n.aG.state.purchaseCurrencies.map((e=>e.symbol));return await j.T.generateOnRampURL({defaultNetwork:i,destinationWallets:[{address:e,blockchains:O.oU.WC_COINBASE_PAY_SDK_CHAINS,assets:o}],partnerUserId:e,purchaseAmount:n.aG.state.purchaseAmount})}};B([(0,o.wk)()],G.prototype,"providers",void 0),G=B([(0,p.EM)("w3m-onramp-providers-view")],G);const U=r.AH` 308 :host > wui-grid { 309 max-height: 360px; 310 overflow: auto; 311 } 312 313 wui-flex { 314 transition: opacity var(--wui-ease-out-power-1) var(--wui-duration-md); 315 will-change: opacity; 316 } 317 318 wui-grid::-webkit-scrollbar {
319 display: none; 320 } 321 322 wui-flex.disabled { 323 opacity: 0.3; 324 pointer-events: none; 325 user-select: none; 326 } 327`;var z=function(e,t,i,r){var o,s=arguments.length,a=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"===typeof Reflect&&"function"===typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var n=e.length-1;n>=0;n--)(o=e[n])&&(a=(s<3?o(a):s>3?o(t,i,a):o(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};let L=class extends r.WF{constructor(){super(),this.unsubscribe=[],this.selectedCurrency=n.aG.state.purchaseCurrencies,this.tokens=n.aG.state.purchaseCurrencies,this.tokenImages=l.j.state.tokenImages,this.checked=v.o.state.isLegalCheckboxChecked,this.unsubscribe.push(n.aG.subscribe((e=>{this.selectedCurrency=e.purchaseCurrencies,this.tokens=e.purchaseCurrencies})),l.j.subscribeKey("tokenImages",(e=>this.tokenImages=e)),v.o.subscribeKey("isLegalCheckboxChecked",(e=>{this.checked=e})))}disconnectedCallback(){this.unsubscribe.forEach((e=>e()))}render(){const{termsConditionsUrl:e,privacyPolicyUrl:t}=d.H.state,i=d.H.state.features?.legalCheckbox,o=Boolean(e||t)&&Boolean(i)&&!this.checked;return r.qy` 328 <w3m-legal-checkbox></w3m-legal-checkbox> 329 <wui-flex 330 flexDirection="column" 331 .padding=${["0","s","s","s"]} 332 gap="xs" 333 class=${(0,s.J)(o?"disabled":void 0)} 334 > 335 ${this.currenciesTemplate(o)} 336 </wui-flex> 337 <w3m-legal-footer></w3m-legal-footer> 338 `}currenciesTemplate(){let e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return this.tokens.map((t=>r.qy` 339 <wui-list-item 340 imageSrc=${(0,s.J)(this.tokenImages?.[t.symbol])} 341 @click=${()=>this.selectToken(t)} 342 variant="image" 343 tabIdx=${(0,s.J)(e?-1:void 0)} 344 > 345 <wui-flex gap="3xs" alignItems="center"> 346 <wui-text variant="paragraph-500" color="fg-100">${t.name}</wui-text> 347 <wui-text variant="small-400" color="fg-200">${t.symbol}</wui-text> 348 </wui-flex> 349 </wui-list-item> 350 `))}selectToken(e){e&&(n.aG.setPurchaseCurrency(e),x.W.close())}};L.styles=U,z([(0,o.wk)()],L.prototype,"selectedCurrency",void 0),z([(0,o.wk)()],L.prototype,"tokens",void 0),z([(0,o.wk)()],L.prototype,"tokenImages",void 0),z([(0,o.wk)()],L.prototype,"checked",void 0),L=z([(0,p.EM)("w3m-onramp-token-select-view")],L);var Z=i(8550),F=i(34367),H=i(8340);i(93709),i(16777);const K=r.AH` 351 @keyframes shake { 352 0% { 353 transform: translateX(0); 354 } 355 25% { 356 transform: translateX(3px); 357 } 358 50% { 359 transform: translateX(-3px); 360 } 361 75% { 362 transform: translateX(3px); 363 } 364 100% { 365 transform: translateX(0); 366 } 367 } 368 369 wui-flex:first-child:not(:only-child) { 370 position: relative; 371 } 372 373 wui-loading-thumbnail { 374 position: absolute; 375 } 376 377 wui-visual { 378 width: var(--wui-wallet-image-size-lg); 379 height: var(--wui-wallet-image-size-lg); 380 border-radius: calc(var(--wui-border-radius-5xs) * 9 - var(--wui-border-radius-xxs)); 381 position: relative; 382 overflow: hidden; 383 } 384 385 wui-visual::after { 386 content: ''; 387 display: block; 388 width: 100%; 389 height: 100%; 390 position: absolute; 391 inset: 0; 392 border-radius: calc(var(--wui-border-radius-5xs) * 9 - var(--wui-border-radius-xxs)); 393 box-shadow: inset 0 0 0 1px var(--wui-color-gray-glass-005); 394 } 395 396 wui-icon-box { 397 position: absolute; 398 right: calc(var(--wui-spacing-3xs) * -1); 399 bottom: calc(var(--wui-spacing-3xs) * -1); 400 opacity: 0; 401 transform: scale(0.5); 402 transition: 403 opacity var(--wui-ease-out-power-2) var(--wui-duration-lg), 404 transform var(--wui-ease-out-power-2) var(--wui-duration-lg); 405 will-change: opacity, transform; 406 } 407 408 wui-text[align='center'] { 409 width: 100%; 410 padding: 0px var(--wui-spacing-l); 411 } 412 413 [data-error='true'] wui-icon-box { 414 opacity: 1; 415 transform: scale(1); 416 } 417 418 [data-error='true'] > wui-flex:first-child { 419 animation: shake 250ms cubic-bezier(0.36, 0.07, 0.19, 0.97) both; 420 } 421 422 [data-retry='false'] wui-link { 423 display: none; 424 } 425 426 [data-retry='true'] wui-link { 427 display: block; 428 opacity: 1; 429 } 430 431 wui-link { 432 padding: var(--wui-spacing-4xs) var(--wui-spacing-xxs); 433 } 434`;var V=function(e,t,i,r){var o,s=arguments.length,a=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"===typeof Reflect&&"function"===typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var n=e.length-1;n>=0;n--)(o=e[n])&&(a=(s<3?o(a):s>3?o(t,i,a):o(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};let J=class extends r.WF{constructor(){super(),this.unsubscribe=[],this.selectedOnRampProvider=n.aG.state.selectedProvider,this.uri=Z.x.state.wcUri,this.ready=!1,this.showRetry=!1,this.buffering=!1,this.error=!1,this.startTime=null,this.isMobile=!1,this.onRetry=void 0,this.unsubscribe.push(n.aG.subscribeKey("selectedProvider",(e=>{this.selectedOnRampProvider=e}))),this.watchTransactions()}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}`);const t=this.error?"Buy can be declined from your side or due to and error on the provider app":"We\u2019ll notify you once your Buy is processed";return r.qy` 435 <wui-flex 436 data-error=${(0,s.J)(this.error)} 437 data-retry=${this.showRetry} 438 flexDirection="column" 439 alignItems="center" 440 .padding=${["3xl","xl","xl","xl"]} 441 gap="xl" 442 > 443 <wui-flex justifyContent="center" alignItems="center"> 444 <wui-visual
445 name=${(0,s.J)(this.selectedOnRampProvider?.name)} 446 size="lg" 447 class="provider-image" 448 > 449 </wui-visual> 450 451 ${this.error?null:this.loaderTemplate()} 452 453 <wui-icon-box 454 backgroundColor="error-100" 455 background="opaque" 456 iconColor="error-100" 457 icon="close" 458 size="sm" 459 border 460 borderColor="wui-color-bg-125" 461 ></wui-icon-box> 462 </wui-flex> 463 464 <wui-flex flexDirection="column" alignItems="center" gap="xs"> 465 <wui-text variant="paragraph-500" color=${this.error?"error-100":"fg-100"}> 466 ${e} 467 </wui-text> 468 <wui-text align="center" variant="small-500" color="fg-200">${t}</wui-text> 469 </wui-flex> 470 471 ${this.error?this.tryAgainTemplate():null} 472 </wui-flex> 473 474 <wui-flex .padding=${["0","xl","xl","xl"]} justifyContent="center"> 475 <wui-link @click=${this.onCopyUri} color="fg-200"> 476 <wui-icon size="xs" color="fg-200" slot="iconLeft" name="copy"></wui-icon> 477 Copy link 478 </wui-link> 479 </wui-flex> 480 `}watchTransactions(){if(this.selectedOnRampProvider&&"coinbase"===this.selectedOnRampProvider.name)this.startTime=Date.now(),this.initializeCoinbaseTransactions()}async initializeCoinbaseTransactions(){await this.watchCoinbaseTransactions(),this.intervalId=setInterval((()=>this.watchCoinbaseTransactions()),4e3)}async watchCoinbaseTransactions(){try{const e=u.U.state.address;if(!e)throw new Error("No address found");const t=await j.T.fetchTransactions({account:e,onramp:"coinbase"});t.data.filter((e=>new Date(e.metadata.minedAt)>new Date(this.startTime)||"ONRAMP_TRANSACTION_STATUS_IN_PROGRESS"===e.metadata.status)).length?(clearInterval(this.intervalId),$.I.replace("OnRampActivity")):this.startTime&&Date.now()-this.startTime>=18e4&&(clearInterval(this.intervalId),this.error=!0)}catch(e){F.P.showError(e)}}onTryAgain(){this.selectedOnRampProvider&&(this.error=!1,R.w.openHref(this.selectedOnRampProvider.url,"popupWindow","width=600,height=800,scrollbars=yes"))}tryAgainTemplate(){return this.selectedOnRampProvider?.url?r.qy`<wui-button size="md" variant="accent" @click=${this.onTryAgain.bind(this)}> 481 <wui-icon color="inherit" slot="iconLeft" name="refresh"></wui-icon> 482 Try again 483 </wui-button>`:null}loaderTemplate(){const e=H.W.state.themeVariables["--w3m-border-radius-master"],t=e?parseInt(e.replace("px",""),10):4;return r.qy`<wui-loading-thumbnail radius=${9*t}></wui-loading-thumbnail>`}onCopyUri(){if(!this.selectedOnRampProvider?.url)return F.P.showError("No link found"),void $.I.goBack();try{R.w.copyToClopboard(this.selectedOnRampProvider.url),F.P.showSuccess("Link copied")}catch{F.P.showError("Failed to copy")}}};J.styles=K,V([(0,o.wk)()],J.prototype,"intervalId",void 0),V([(0,o.wk)()],J.prototype,"selectedOnRampProvider",void 0),V([(0,o.wk)()],J.prototype,"uri",void 0),V([(0,o.wk)()],J.prototype,"ready",void 0),V([(0,o.wk)()],J.prototype,"showRetry",void 0),V([(0,o.wk)()],J.prototype,"buffering",void 0),V([(0,o.wk)()],J.prototype,"error",void 0),V([(0,o.wk)()],J.prototype,"startTime",void 0),V([(0,o.MZ)({type:Boolean})],J.prototype,"isMobile",void 0),V([(0,o.MZ)()],J.prototype,"onRetry",void 0),J=V([(0,p.EM)("w3m-buy-in-progress-view")],J);var Y=function(e,t,i,r){var o,s=arguments.length,a=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"===typeof Reflect&&"function"===typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var n=e.length-1;n>=0;n--)(o=e[n])&&(a=(s<3?o(a):s>3?o(t,i,a):o(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};let Q=class extends r.WF{render(){return r.qy` 484 <wui-flex 485 flexDirection="column" 486 .padding=${["xxl","3xl","xl","3xl"]} 487 alignItems="center" 488 gap="xl" 489 > 490 <wui-visual name="onrampCard"></wui-visual> 491 <wui-flex flexDirection="column" gap="xs" alignItems="center"> 492 <wui-text align="center" variant="paragraph-500" color="fg-100"> 493 Quickly and easily buy digital assets! 494 </wui-text> 495 <wui-text align="center" variant="small-400" color="fg-200"> 496 Simply select your preferred onramp provider and add digital assets to your account 497 using your credit card or bank transfer 498 </wui-text> 499 </wui-flex> 500 <wui-button @click=${$.I.goBack}> 501 <wui-icon size="sm" color="inherit" name="add" slot="iconLeft"></wui-icon> 502 Buy 503 </wui-button>
503 504 </wui-flex> 505 `}};Q=Y([(0,p.EM)("w3m-what-is-a-buy-view")],Q);i(88629);const X=r.AH` 506 :host { 507 width: 100%; 508 } 509 510 wui-loading-spinner { 511 position: absolute; 512 top: 50%; 513 right: 20px; 514 transform: translateY(-50%); 515 } 516 517 .currency-container { 518 position: absolute; 519 top: 50%; 520 transform: translateY(-50%); 521 right: var(--wui-spacing-1xs); 522 height: 40px; 523 padding: var(--wui-spacing-xs) var(--wui-spacing-1xs) var(--wui-spacing-xs) 524 var(--wui-spacing-xs); 525 min-width: 95px; 526 border-radius: var(--FULL, 1000px); 527 border: 1px solid var(--wui-color-gray-glass-002); 528 background: var(--wui-color-gray-glass-002); 529 cursor: pointer; 530 } 531 532 .currency-container > wui-image { 533 height: 24px; 534 width: 24px; 535 border-radius: 50%; 536 } 537`;var ee=function(e,t,i,r){var o,s=arguments.length,a=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"===typeof Reflect&&"function"===typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var n=e.length-1;n>=0;n--)(o=e[n])&&(a=(s<3?o(a):s>3?o(t,i,a):o(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};let te=class extends r.WF{constructor(){super(),this.unsubscribe=[],this.type="Token",this.value=0,this.currencies=[],this.selectedCurrency=this.currencies?.[0],this.currencyImages=l.j.state.currencyImages,this.tokenImages=l.j.state.tokenImages,this.unsubscribe.push(n.aG.subscribeKey("purchaseCurrency",(e=>{e&&"Fiat"!==this.type&&(this.selectedCurrency=this.formatPurchaseCurrency(e))})),n.aG.subscribeKey("paymentCurrency",(e=>{e&&"Token"!==this.type&&(this.selectedCurrency=this.formatPaymentCurrency(e))})),n.aG.subscribe((e=>{"Fiat"===this.type?this.currencies=e.purchaseCurrencies.map(this.formatPurchaseCurrency):this.currencies=e.paymentCurrencies.map(this.formatPaymentCurrency)})),l.j.subscribe((e=>{this.currencyImages={...e.currencyImages},this.tokenImages={...e.tokenImages}})))}firstUpdated(){n.aG.getAvailableCurrencies()}disconnectedCallback(){this.unsubscribe.forEach((e=>e()))}render(){const e=this.selectedCurrency?.symbol||"",t=this.currencyImages[e]||this.tokenImages[e];return r.qy`<wui-input-text type="number" size="lg" value=${this.value}> 538 ${this.selectedCurrency?r.qy` <wui-flex 539 class="currency-container" 540 justifyContent="space-between" 541 alignItems="center" 542 gap="xxs" 543 @click=${()=>x.W.open({view:`OnRamp${this.type}Select`})} 544 > 545 <wui-image src=${(0,s.J)(t)}></wui-image> 546 <wui-text color="fg-100">${this.selectedCurrency.symbol}</wui-text> 547 </wui-flex>`:r.qy`<wui-loading-spinner></wui-loading-spinner>`} 548 </wui-input-text>`}formatPaymentCurrency(e){return{name:e.id,symbol:e.id}}formatPurchaseCurrency(e){return{name:e.name,symbol:e.symbol}}};te.styles=X,ee([(0,o.MZ)({type:String})],te.prototype,"type",void 0),ee([(0,o.MZ)({type:Number})],te.prototype,"value",void 0),ee([(0,o.wk)()],te.prototype,"currencies",void 0),ee([(0,o.wk)()],te.prototype,"selectedCurrency",void 0),ee([(0,o.wk)()],te.prototype,"currencyImages",void 0),ee([(0,o.wk)()],te.prototype,"tokenImages",void 0),te=ee([(0,p.EM)("w3m-onramp-input")],te);const ie=r.AH` 549 :host > wui-flex { 550 width: 100%; 551 max-width: 360px; 552 } 553 554 :host > wui-flex > wui-flex { 555 border-radius: var(--wui-border-radius-l); 556 width: 100%; 557 } 558 559 .amounts-container { 560 width: 100%; 561 } 562`;var re=function(e,t,i,r){var o,s=arguments.length,a=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"===typeof Reflect&&"function"===typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var n=e.length-1;n>=0;n--)(o=e[n])&&(a=(s<3?o(a):s>3?o(t,i,a):o(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};const oe={USD:"$",EUR:"\u20ac",GBP:"\xa3"},se=[100,250,500,1e3];let ae=class extends r.WF{constructor(){super(),this.unsubscribe=[],this.disabled=!1,this.caipAddress=I.W.state.activeCaipAddress,this.loading=x.W.state.loading,this.paymentCurrency=n.aG.state.paymentCurrency,this.paymentAmount=n.aG.state.paymentAmount,this.purchaseAmount=n.aG.state.purchaseAmount,this.quoteLoading=n.aG.state.quotesLoading,this.unsubscribe.push(I.W.subscribeKey("activeCaipAddress",(e=>this.caipAddress=e)),x.W.subscribeKey("loading",(e=>{this.loading=e})),n.aG.subscribe((e=>{this.paymentCurrency=e.paymentCurrency,this.paymentAmount=e.paymentAmount,this.purchaseAmount=e.purchaseAmount,this.quoteLoading=e.quotesLoading}
562)))}disconnectedCallback(){this.unsubscribe.forEach((e=>e()))}render(){return r.qy` 563 <wui-flex flexDirection="column" justifyContent="center" alignItems="center"> 564 <wui-flex flexDirection="column" alignItems="center" gap="xs"> 565 <w3m-onramp-input 566 type="Fiat" 567 @inputChange=${this.onPaymentAmountChange.bind(this)} 568 .value=${this.paymentAmount||0} 569 ></w3m-onramp-input> 570 <w3m-onramp-input 571 type="Token" 572 .value=${this.purchaseAmount||0} 573 .loading=${this.quoteLoading} 574 ></w3m-onramp-input> 575 <wui-flex justifyContent="space-evenly" class="amounts-container" gap="xs"> 576 ${se.map((e=>r.qy`<wui-button 577 variant=${this.paymentAmount===e?"accent":"neutral"} 578 size="md" 579 textVariant="paragraph-600" 580 fullWidth 581 @click=${()=>this.selectPresetAmount(e)} 582 >${`${oe[this.paymentCurrency?.id||"USD"]} ${e}`}</wui-button 583 >`))} 584 </wui-flex> 585 ${this.templateButton()} 586 </wui-flex> 587 </wui-flex> 588 `}templateButton(){return this.caipAddress?r.qy`<wui-button 589 @click=${this.getQuotes.bind(this)} 590 variant="main" 591 fullWidth 592 size="lg" 593 borderRadius="xs" 594 > 595 Get quotes 596 </wui-button>`:r.qy`<wui-button 597 @click=${this.openModal.bind(this)} 598 variant="accent" 599 fullWidth 600 size="lg" 601 borderRadius="xs" 602 > 603 Connect wallet 604 </wui-button>`}getQuotes(){this.loading||x.W.open({view:"OnRampProviders"})}openModal(){x.W.open({view:"Connect"})}async onPaymentAmountChange(e){n.aG.setPaymentAmount(Number(e.detail)),await n.aG.getQuote()}async selectPresetAmount(e){n.aG.setPaymentAmount(e),await n.aG.getQuote()}};ae.styles=ie,re([(0,o.MZ)({type:Boolean})],ae.prototype,"disabled",void 0),re([(0,o.wk)()],ae.prototype,"caipAddress",void 0),re([(0,o.wk)()],ae.prototype,"loading",void 0),re([(0,o.wk)()],ae.prototype,"paymentCurrency",void 0),re([(0,o.wk)()],ae.prototype,"paymentAmount",void 0),re([(0,o.wk)()],ae.prototype,"purchaseAmount",void 0),re([(0,o.wk)()],ae.prototype,"quoteLoading",void 0),ae=re([(0,p.EM)("w3m-onramp-widget")],ae)},33135:(e,t,i)=>{i(1910)},1910:(e,t,i)=>{var r=i(20443),o=i(86971),s=i(90509),a=i(1046);const n=r.AH` 605 :host { 606 display: block; 607 width: var(--local-width); 608 height: var(--local-height); 609 } 610 611 :host([data-object-fit='cover']) img { 612 object-fit: cover; 613 object-position: center center; 614 } 615 616 :host([data-object-fit='contain']) img { 617 object-fit: contain; 618 object-position: center center; 619 } 620 621 img { 622 display: block; 623 width: 100%; 624 height: 100%; 625 border-radius: inherit; 626 } 627`;var c=function(e,t,i,r){var o,s=arguments.length,a=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"===typeof Reflect&&"function"===typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var n=e.length-1;n>=0;n--)(o=e[n])&&(a=(s<3?o(a):s>3?o(t,i,a):o(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};let l=class extends r.WF{constructor(){super(...arguments),this.src="./path/to/image.jpg",this.alt="Image",this.size=void 0,this.objectFit="cover"}render(){return this.objectFit&&(this.dataset.objectFit=this.objectFit),this.style.cssText=`\n --local-width: ${this.size?`var(--wui-icon-size-${this.size});`:"100%"};\n --local-height: ${this.size?`var(--wui-icon-size-${this.size});`:"100%"};\n `,r.qy`<img src=${this.src} alt=${this.alt} @error=${this.handleImageError} />`}handleImageError(){this.dispatchEvent(new CustomEvent("onLoadError",{bubbles:!0,composed:!0}))}};l.styles=[s.W5,s.ck,n],c([(0,o.MZ)()],l.prototype,"src",void 0),c([(0,o.MZ)()],l.prototype,"alt",void 0),c([(0,o.MZ)()],l.prototype,"size",void 0),c([(0,o.MZ)()],l.prototype,"objectFit",void 0),l=c([(0,a.E)("wui-image")],l)}}]);
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.