1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[4329],{26208:(t,e,i)=>{var n=i(83138),a=i(98410),o=i(99865),s=i(20296),r=i(71084),u=i(8821),c=i(47327);let l=(0,s.AH)` 2 :host { 3 position: relative; 4 display: inline-block; 5 } 6 7 :host([data-error='true']) > input { 8 color: ${({tokens:t})=>t.core.textError}; 9 } 10 11 :host([data-error='false']) > input { 12 color: ${({tokens:t})=>t.theme.textSecondary}; 13 } 14 15 input { 16 background: transparent; 17 height: auto; 18 box-sizing: border-box; 19 color: ${({tokens:t})=>t.theme.textPrimary}; 20 font-feature-settings: 'case' on; 21 font-size: ${({textSize:t})=>t.h4}; 22 caret-color: ${({tokens:t})=>t.core.backgroundAccentPrimary}; 23 line-height: ${({typography:t})=>t["h4-regular-mono"].lineHeight}; 24 letter-spacing: ${({typography:t})=>t["h4-regular-mono"].letterSpacing}; 25 -webkit-appearance: none; 26 -moz-appearance: textfield; 27 padding: 0px; 28 font-family: ${({fontFamily:t})=>t.mono}; 29 } 30 31 :host([data-width-variant='auto']) input { 32 width: 100%; 33 } 34 35 :host([data-width-variant='fit']) input { 36 width: 1ch; 37 } 38 39 .wui-input-amount-fit-mirror { 40 position: absolute; 41 visibility: hidden; 42 white-space: pre; 43 font-size: var(--local-font-size); 44 line-height: 130%; 45 letter-spacing: -1.28px; 46 font-family: ${({fontFamily:t})=>t.mono}; 47 } 48 49 .wui-input-amount-fit-width { 50 display: inline-block; 51 position: relative; 52 } 53 54 input::-webkit-outer-spin-button, 55 input::-webkit-inner-spin-button { 56 -webkit-appearance: none; 57 margin: 0; 58 } 59 60 input::placeholder { 61 color: ${({tokens:t})=>t.theme.textSecondary}; 62 } 63`;var d=function(t,e,i,n){var a,o=arguments.length,s=o<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,i,n);else for(var r=t.length-1;r>=0;r--)(a=t[r])&&(s=(o<3?a(s):o>3?a(e,i,s):a(e,i))||s);return o>3&&s&&Object.defineProperty(e,i,s),s};let h=class extends n.WF{constructor(){super(...arguments),this.inputElementRef=(0,o._)(),this.disabled=!1,this.value="",this.placeholder="0",this.widthVariant="auto",this.maxDecimals=void 0,this.maxIntegers=void 0,this.fontSize="h4",this.error=!1}firstUpdated(){this.resizeInput()}updated(){this.style.setProperty("--local-font-size",s.f.textSize[this.fontSize]),this.resizeInput()}render(){return(this.dataset.widthVariant=this.widthVariant,this.dataset.error=String(this.error),this.inputElementRef?.value&&this.value&&(this.inputElementRef.value.value=this.value),"auto"===this.widthVariant)?this.inputTemplate():(0,n.qy)` 64 <div class="wui-input-amount-fit-width"> 65 <span class="wui-input-amount-fit-mirror"></span> 66 ${this.inputTemplate()} 67 </div> 68 `}inputTemplate(){return(0,n.qy)`<input 69 ${(0,o.K)(this.inputElementRef)} 70 type="text" 71 inputmode="decimal" 72 pattern="[0-9,.]*" 73 placeholder=${this.placeholder} 74 ?disabled=${this.disabled} 75 autofocus 76 value=${this.value??""} 77 @input=${this.dispatchInputChangeEvent.bind(this)} 78 />`}dispatchInputChangeEvent(){this.inputElementRef.value&&(this.inputElementRef.value.value=u.Z.maskInput({value:this.inputElementRef.value.value,decimals:this.maxDecimals,integers:this.maxIntegers}),this.dispatchEvent(new CustomEvent("inputChange",{detail:this.inputElementRef.value.value,bubbles:!0,composed:!0})),this.resizeInput())}resizeInput(){if("fit"===this.widthVariant){let t=this.inputElementRef.value;if(t){let e=t.previousElementSibling;e&&(e.textContent=t.value||"0",t.style.width=`${e.offsetWidth}px`)}}}};h.styles=[r.W5,r.fD,l],d([(0,a.MZ)({type:Boolean})],h.prototype,"disabled",void 0),d([(0,a.MZ)({type:String})],h.prototype,"value",void 0),d([(0,a.MZ)({type:String})],h.prototype,"placeholder",void 0),d([(0,a.MZ)({type:String})],h.prototype,"widthVariant",void 0),d([(0,a.MZ)({type:Number})],h.prototype,"maxDecimals",void 0),d([(0,a.MZ)({type:Number})],h.prototype,"maxIntegers",void 0),d([(0,a.MZ)({type:String})],h.prototype,"fontSize",void 0),d([(0,a.MZ)({type:Boolean})],h.prototype,"error",void 0),h=d([(0,c.E)("wui-input-amount")],h)},74329:(t,e,i)=>{i.r(e),i.d(e,{W3mDepositFromExchangeSelectAssetView:()=>S,W3mDepositFromExchangeView:()=>P});var n=i(83138),a=i(98410),o=i(78964),s=i(93481),r=i(55549),u=i(67869),c=i(14744),l=i(65374),d=i(97418),h=i(36211);i(99691),i(45166),i(24772);var p=i(71084),m=i(47327),g=i(20296);let y=(0,g.AH)` 79 button { 80 border: none; 81 border-radius: ${({borderRadius:t})=>t["20"]}; 82 display: flex; 83 flex-direction: row; 84 align-items: center; 85 padding: ${({spacing:t})=>t[1]}; 86 transition: 87 background-color ${({durations:t})=>t.lg} 88 ${({easings:t})=>t["ease-out-power-2"]}, 89 box-shadow ${({durations:t})=>t.lg} 90 ${({easings:t})=>t["ease-out-power-2"]}; 91 will-change: background-color, box-shadow; 92 } 93 94 /* -- Variants --------------------------------------------------------------- */ 95 button[data-type='accent'] { 96 background-color: ${({tokens:t})=>t.core.backgroundAccentPrimary}; 97 color: ${({tokens:t})=>t.theme.textPrimary}; 98 } 99 100 button[data-type='neutral'] { 101 background-color: ${({tokens:t})=>t.theme.foregroundSecondary}; 102 color: ${({tokens:t})=>t.theme.textPrimary}; 103 } 104 105 /* -- Sizes --------------------------------------------------------------- */ 106 button[data-size='sm'] { 107 height: 24px; 108 } 109 110 button[data-size='md'] { 111 height: 28px; 112 } 113 114 button[data-size='lg'] { 115 height: 32px; 116 } 117 118 button[data-size='sm'] > wui-image, 119 button[data-size='sm'] > wui-icon { 120 width: 16px; 121 height: 16px; 122 } 123 124 button[data-size='md'] > wui-image, 125 button[data-size='md'] > wui-icon {
126 width: 20px; 127 height: 20px; 128 } 129 130 button[data-size='lg'] > wui-image, 131 button[data-size='lg'] > wui-icon { 132 width: 24px; 133 height: 24px; 134 } 135 136 wui-text { 137 padding-left: ${({spacing:t})=>t[1]}; 138 padding-right: ${({spacing:t})=>t[1]}; 139 } 140 141 wui-image { 142 border-radius: ${({borderRadius:t})=>t[3]}; 143 overflow: hidden; 144 user-drag: none; 145 user-select: none; 146 -moz-user-select: none; 147 -webkit-user-drag: none; 148 -webkit-user-select: none; 149 -ms-user-select: none; 150 } 151 152 /* -- States --------------------------------------------------------------- */ 153 @media (hover: hover) and (pointer: fine) { 154 button[data-type='accent']:not(:disabled):hover { 155 background-color: ${({tokens:t})=>t.core.foregroundAccent060}; 156 } 157 158 button[data-type='neutral']:not(:disabled):hover { 159 background-color: ${({tokens:t})=>t.theme.foregroundTertiary}; 160 } 161 } 162 163 button[data-type='accent']:not(:disabled):focus-visible, 164 button[data-type='accent']:not(:disabled):active { 165 box-shadow: 0 0 0 4px ${({tokens:t})=>t.core.foregroundAccent020}; 166 } 167 168 button[data-type='neutral']:not(:disabled):focus-visible, 169 button[data-type='neutral']:not(:disabled):active { 170 box-shadow: 0 0 0 4px ${({tokens:t})=>t.core.foregroundAccent020}; 171 } 172 173 button:disabled { 174 opacity: 0.5; 175 } 176`;var w=function(t,e,i,n){var a,o=arguments.length,s=o<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,i,n);else for(var r=t.length-1;r>=0;r--)(a=t[r])&&(s=(o<3?a(s):o>3?a(e,i,s):a(e,i))||s);return o>3&&s&&Object.defineProperty(e,i,s),s};let f={sm:"sm-regular",md:"md-regular",lg:"lg-regular"},x=class extends n.WF{constructor(){super(...arguments),this.type="accent",this.size="md",this.imageSrc="",this.disabled=!1,this.leftIcon=void 0,this.rightIcon=void 0,this.text=""}render(){return(0,n.qy)` 177 <button ?disabled=${this.disabled} data-type=${this.type} data-size=${this.size}> 178 ${this.imageSrc?(0,n.qy)`<wui-image src=${this.imageSrc}></wui-image>`:null} 179 ${this.leftIcon?(0,n.qy)`<wui-icon name=${this.leftIcon} color="inherit" size="inherit"></wui-icon>`:null} 180 <wui-text variant=${f[this.size]} color="inherit">${this.text}</wui-text> 181 ${this.rightIcon?(0,n.qy)`<wui-icon name=${this.rightIcon} color="inherit" size="inherit"></wui-icon>`:null} 182 </button> 183 `}};x.styles=[p.W5,p.fD,y],w([(0,a.MZ)()],x.prototype,"type",void 0),w([(0,a.MZ)()],x.prototype,"size",void 0),w([(0,a.MZ)()],x.prototype,"imageSrc",void 0),w([(0,a.MZ)({type:Boolean})],x.prototype,"disabled",void 0),w([(0,a.MZ)()],x.prototype,"leftIcon",void 0),w([(0,a.MZ)()],x.prototype,"rightIcon",void 0),w([(0,a.MZ)()],x.prototype,"text",void 0),x=w([(0,m.E)("wui-chip-button")],x),i(40575),i(51568),i(80205),i(26670),i(41699),i(41163),i(41028),i(26208),i(48352);var b=function(t,e,i,n){var a,o=arguments.length,s=o<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,i,n);else for(var r=t.length-1;r>=0;r--)(a=t[r])&&(s=(o<3?a(s):o>3?a(e,i,s):a(e,i))||s);return o>3&&s&&Object.defineProperty(e,i,s),s};let v=class extends n.WF{constructor(){super(...arguments),this.maxDecimals=void 0,this.maxIntegers=void 0}render(){return(0,n.qy)` 184 <wui-flex alignItems="center" gap="1"> 185 <wui-input-amount 186 widthVariant="fit" 187 fontSize="h2" 188 .maxDecimals=${(0,o.J)(this.maxDecimals)} 189 .maxIntegers=${(0,o.J)(this.maxIntegers)} 190 .value=${this.amount?String(this.amount):""} 191 ></wui-input-amount> 192 <wui-text variant="md-regular" color="secondary">USD</wui-text> 193 </wui-flex> 194 `}};b([(0,a.MZ)({type:Number})],v.prototype,"amount",void 0),b([(0,a.MZ)({type:Number})],v.prototype,"maxDecimals",void 0),b([(0,a.MZ)({type:Number})],v.prototype,"maxIntegers",void 0),v=b([(0,h.EM)("w3m-fund-input")],v);let $=(0,h.AH)` 195 .amount-input-container { 196 border-radius: ${({borderRadius:t})=>t["6"]}; 197 border-top-right-radius: 0; 198 border-top-left-radius: 0; 199 background-color: ${({tokens:t})=>t.theme.foregroundPrimary}; 200 padding: ${({spacing:t})=>t[1]}; 201 } 202 203 .container { 204 border-radius: 30px; 205 } 206`;
206var k=function(t,e,i,n){var a,o=arguments.length,s=o<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,i,n);else for(var r=t.length-1;r>=0;r--)(a=t[r])&&(s=(o<3?a(s):o>3?a(e,i,s):a(e,i))||s);return o>3&&s&&Object.defineProperty(e,i,s),s};let I=[10,50,100],P=class extends n.WF{constructor(){super(),this.unsubscribe=[],this.network=s.W.state.activeCaipNetwork,this.exchanges=r.g.state.exchanges,this.isLoading=r.g.state.isLoading,this.amount=r.g.state.amount,this.tokenAmount=r.g.state.tokenAmount,this.priceLoading=r.g.state.priceLoading,this.isPaymentInProgress=r.g.state.isPaymentInProgress,this.currentPayment=r.g.state.currentPayment,this.paymentId=r.g.state.paymentId,this.paymentAsset=r.g.state.paymentAsset,this.unsubscribe.push(s.W.subscribeKey("activeCaipNetwork",t=>{this.network=t,this.setDefaultPaymentAsset()}),r.g.subscribe(t=>{this.exchanges=t.exchanges,this.isLoading=t.isLoading,this.amount=t.amount,this.tokenAmount=t.tokenAmount,this.priceLoading=t.priceLoading,this.paymentId=t.paymentId,this.isPaymentInProgress=t.isPaymentInProgress,this.currentPayment=t.currentPayment,this.paymentAsset=t.paymentAsset,t.isPaymentInProgress&&t.currentPayment?.exchangeId&&t.currentPayment?.sessionId&&t.paymentId&&this.handlePaymentInProgress()}))}disconnectedCallback(){this.unsubscribe.forEach(t=>t()),r.g.state.isPaymentInProgress||r.g.reset()}async firstUpdated(){await this.getPaymentAssets(),this.paymentAsset||await this.setDefaultPaymentAsset(),r.g.setAmount(I[0]),await r.g.fetchExchanges()}render(){return(0,n.qy)` 207 <wui-flex flexDirection="column" class="container"> 208 ${this.amountInputTemplate()} ${this.exchangesTemplate()} 209 </wui-flex> 210 `}exchangesLoadingTemplate(){return Array.from({length:2}).map(()=>(0,n.qy)`<wui-shimmer width="100%" height="65px" borderRadius="xxs"></wui-shimmer>`)}_exchangesTemplate(){return this.exchanges.length>0?this.exchanges.map(t=>(0,n.qy)`<wui-list-item 211 @click=${()=>this.onExchangeClick(t)} 212 chevron 213 variant="image" 214 imageSrc=${t.imageUrl} 215 ?loading=${this.isLoading} 216 > 217 <wui-text variant="md-regular" color="primary"> 218 Deposit from ${t.name} 219 </wui-text> 220 </wui-list-item>`):(0,n.qy)`<wui-flex flexDirection="column" alignItems="center" gap="4" padding="4"> 221 <wui-text variant="lg-medium" align="center" color="primary"> 222 No exchanges support this asset on this network 223 </wui-text> 224 </wui-flex>`}exchangesTemplate(){return(0,n.qy)`<wui-flex 225 flexDirection="column" 226 gap="2" 227 .padding=${["3","3","3","3"]} 228 class="exchanges-container" 229 > 230 ${this.isLoading?this.exchangesLoadingTemplate():this._exchangesTemplate()} 231 </wui-flex>`}amountInputTemplate(){return(0,n.qy)` 232 <wui-flex 233 flexDirection="column" 234 .padding=${["0","3","3","3"]} 235 class="amount-input-container" 236 > 237 <wui-flex 238 justifyContent="space-between" 239 alignItems="center" 240 .margin=${["0","0","6","0"]} 241 > 242 <wui-text variant="md-medium" color="secondary">Asset</wui-text> 243 <wui-token-button 244 data-testid="deposit-from-exchange-asset-button" 245 flexDirection="row-reverse" 246 text=${this.paymentAsset?.metadata.symbol||""} 247 imageSrc=${this.paymentAsset?.metadata.iconUrl||""} 248 @click=${()=>u.I.push("PayWithExchangeSelectAsset")} 249 size="lg" 250 .chainImageSrc=${(0,o.J)(c.$.getNetworkImage(this.network))} 251 > 252 </wui-token-button> 253 </wui-flex> 254 <wui-flex 255 flexDirection="column" 256 alignItems="center" 257 justifyContent="center" 258 .margin=${["0","0","4","0"]} 259 > 260 <w3m-fund-input 261 @inputChange=${this.onAmountChange.bind(this)} 262 .amount=${this.amount} 263 .maxDecimals=${6} 264 .maxIntegers=${10} 265 > 266 </w3m-fund-input> 267 ${this.tokenAmountTemplate()} 268 </wui-flex> 269 <wui-flex justifyContent="center" gap="2"> 270 ${I.map(t=>(0,n.qy)`<wui-chip-button 271 @click=${()=>r.g.setAmount(t)} 272 type="neutral" 273 size="lg" 274 text=${`$${t}`} 275 ></wui-chip-button>
275`)} 276 </wui-flex> 277 </wui-flex> 278 `}tokenAmountTemplate(){return this.priceLoading?(0,n.qy)`<wui-shimmer 279 width="65px" 280 height="20px" 281 borderRadius="xxs" 282 variant="light" 283 ></wui-shimmer>`:(0,n.qy)` 284 <wui-text variant="md-regular" color="secondary"> 285 ${this.tokenAmount.toFixed(4)} ${this.paymentAsset?.metadata.symbol} 286 </wui-text> 287 `}async onExchangeClick(t){if(!this.amount)return void l.P.showError("Please enter an amount");await r.g.handlePayWithExchange(t.id)}handlePaymentInProgress(){let t=s.W.state.activeChain,{redirectView:e="Account"}=u.I.state.data??{};this.isPaymentInProgress&&this.currentPayment?.exchangeId&&this.currentPayment?.sessionId&&this.paymentId&&(r.g.waitUntilComplete({exchangeId:this.currentPayment.exchangeId,sessionId:this.currentPayment.sessionId,paymentId:this.paymentId}).then(e=>{"SUCCESS"===e.status?(l.P.showSuccess("Deposit completed"),r.g.reset(),t&&(s.W.fetchTokenBalance(),d.x.updateBalance(t)),u.I.replace("Transactions")):"FAILED"===e.status&&l.P.showError("Deposit failed")}),l.P.showLoading("Deposit in progress..."),u.I.replace(e))}onAmountChange({detail:t}){r.g.setAmount(t?Number(t):null)}async getPaymentAssets(){this.network&&await r.g.getAssetsForNetwork(this.network.caipNetworkId)}async setDefaultPaymentAsset(){if(this.network){let t=await r.g.getAssetsForNetwork(this.network.caipNetworkId);t[0]&&r.g.setPaymentAsset(t[0])}}};P.styles=$,k([(0,a.wk)()],P.prototype,"network",void 0),k([(0,a.wk)()],P.prototype,"exchanges",void 0),k([(0,a.wk)()],P.prototype,"isLoading",void 0),k([(0,a.wk)()],P.prototype,"amount",void 0),k([(0,a.wk)()],P.prototype,"tokenAmount",void 0),k([(0,a.wk)()],P.prototype,"priceLoading",void 0),k([(0,a.wk)()],P.prototype,"isPaymentInProgress",void 0),k([(0,a.wk)()],P.prototype,"currentPayment",void 0),k([(0,a.wk)()],P.prototype,"paymentId",void 0),k([(0,a.wk)()],P.prototype,"paymentAsset",void 0),P=k([(0,h.EM)("w3m-deposit-from-exchange-view")],P);var A=i(12319);i(77237),i(90721),i(40284),i(64501),i(39752);let D=(0,h.AH)` 288 .contentContainer { 289 height: 440px; 290 overflow: scroll; 291 scrollbar-width: none; 292 } 293 294 .contentContainer::-webkit-scrollbar {
295 display: none; 296 } 297 298 wui-icon-box { 299 width: 40px; 300 height: 40px; 301 border-radius: ${({borderRadius:t})=>t["3"]}; 302 } 303`;var C=function(t,e,i,n){var a,o=arguments.length,s=o<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,i,n);else for(var r=t.length-1;r>=0;r--)(a=t[r])&&(s=(o<3?a(s):o>3?a(e,i,s):a(e,i))||s);return o>3&&s&&Object.defineProperty(e,i,s),s};let S=class extends n.WF{constructor(){super(),this.unsubscribe=[],this.assets=r.g.state.assets,this.search="",this.onDebouncedSearch=A.w.debounce(t=>{this.search=t}),this.unsubscribe.push(r.g.subscribe(t=>{this.assets=t.assets}))}disconnectedCallback(){this.unsubscribe.forEach(t=>t())}render(){return(0,n.qy)` 304 <wui-flex flexDirection="column"> 305 ${this.templateSearchInput()} <wui-separator></wui-separator> ${this.templateTokens()} 306 </wui-flex> 307 `}templateSearchInput(){return(0,n.qy)` 308 <wui-flex gap="2" padding="3"> 309 <wui-input-text 310 @inputChange=${this.onInputChange.bind(this)} 311 class="network-search-input" 312 size="sm" 313 placeholder="Search token" 314 icon="search" 315 ></wui-input-text> 316 </wui-flex> 317 `}templateTokens(){let t=this.assets.filter(t=>t.metadata.name.toLowerCase().includes(this.search.toLowerCase())),e=t.length>0;return(0,n.qy)` 318 <wui-flex 319 class="contentContainer" 320 flexDirection="column" 321 .padding=${["0","3","0","3"]} 322 > 323 <wui-flex justifyContent="flex-start" .padding=${["4","3","3","3"]}> 324 <wui-text variant="md-medium" color="secondary">Available tokens</wui-text> 325 </wui-flex> 326 <wui-flex flexDirection="column" gap="2"> 327 ${e?t.map(t=>(0,n.qy)`<wui-list-item 328 .imageSrc=${t.metadata.iconUrl} 329 ?clickable=${!0} 330 @click=${this.handleTokenClick.bind(this,t)} 331 > 332 <wui-text variant="md-medium" color="primary">${t.metadata.name}</wui-text> 333 <wui-text variant="md-regular" color="secondary" 334 >${t.metadata.symbol}</wui-text 335 > 336 </wui-list-item>`):(0,n.qy)`<wui-flex 337 .padding=${["20","0","0","0"]} 338 alignItems="center" 339 flexDirection="column" 340 gap="4" 341 > 342 <wui-icon-box icon="coinPlaceholder" color="default" size="lg"></wui-icon-box> 343 <wui-flex 344 class="textContent" 345 gap="2" 346 flexDirection="column" 347 justifyContent="center" 348 > 349 <wui-text variant="lg-medium" align="center" color="primary"> 350 No tokens found 351 </wui-text> 352 </wui-flex> 353 <wui-link @click=${this.onBuyClick.bind(this)}>Buy</wui-link> 354 </wui-flex>`} 355 </wui-flex> 356 </wui-flex> 357 `}onBuyClick(){u.I.push("OnRampProviders")}onInputChange(t){this.onDebouncedSearch(t.detail)}handleTokenClick(t){r.g.setPaymentAsset(t),u.I.goBack()}};S.styles=D,C([(0,a.wk)()],S.prototype,"assets",void 0),C([(0,a.wk)()],S.prototype,"search",void 0),S=C([(0,h.EM)("w3m-deposit-from-exchange-select-asset-view")],S)},80205:(t,e,i)=>{i(45166)}}]);
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.