1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[3690],{73690:function(e,t,i){i.r(t),i.d(t,{W3mSendSelectTokenView:function(){return j},W3mWalletSendPreviewView:function(){return K},W3mWalletSendView:function(){return A}});var o=i(42972),r=i(74023),n=i(64992),a=i(55594),s=i(61889),l=i(40897),c=i(74824),u=i(21915);i(21954),i(53744),i(50038);var d=i(81397),h=i(16557);i(10442),i(7467);var p=(0,o.iv)` 2 :host { 3 width: 100%; 4 height: 100px; 5 border-radius: var(--wui-border-radius-s); 6 border: 1px solid var(--wui-color-gray-glass-002); 7 background-color: var(--wui-color-gray-glass-002); 8 transition: background-color var(--wui-ease-out-power-1) var(--wui-duration-lg); 9 will-change: background-color; 10 position: relative; 11 } 12 13 :host(:hover) { 14 background-color: var(--wui-color-gray-glass-005); 15 } 16 17 wui-flex { 18 width: 100%; 19 height: fit-content; 20 } 21 22 wui-button { 23 display: ruby; 24 color: var(--wui-color-fg-100); 25 margin: 0 var(--wui-spacing-xs); 26 } 27 28 .instruction { 29 position: absolute; 30 top: 50%; 31 transform: translateY(-50%); 32 z-index: 2; 33 } 34 35 .paste { 36 display: inline-flex; 37 } 38 39 textarea { 40 background: transparent; 41 width: 100%; 42 font-family: var(--w3m-font-family); 43 font-size: var(--wui-font-size-medium); 44 font-style: normal; 45 font-weight: var(--wui-font-weight-light); 46 line-height: 130%; 47 letter-spacing: var(--wui-letter-spacing-medium); 48 color: var(--wui-color-fg-100); 49 caret-color: var(--wui-color-accent-100); 50 box-sizing: border-box; 51 -webkit-appearance: none; 52 -moz-appearance: textfield; 53 padding: 0px; 54 border: none; 55 outline: none; 56 appearance: none; 57 resize: none; 58 overflow: hidden; 59 } 60`,w=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>3?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let g=class extends o.oi{constructor(){super(...arguments),this.inputElementRef=(0,d.V)(),this.instructionElementRef=(0,d.V)(),this.instructionHidden=!!this.value,this.pasting=!1,this.onDebouncedSearch=l.j.debounce(async e=>{if(!e.length){this.setReceiverAddress("");return}let t=c.R.state.activeChain;if(l.j.isAddress(e,t)){this.setReceiverAddress(e);return}try{let t=await h.ConnectionController.getEnsAddress(e);if(t){n.S.setReceiverProfileName(e),n.S.setReceiverAddress(t);let i=await h.ConnectionController.getEnsAvatar(e);n.S.setReceiverProfileImageUrl(i||void 0)}}catch(t){this.setReceiverAddress(e)}finally{n.S.setLoading(!1)}})}firstUpdated(){this.value&&(this.instructionHidden=!0),this.checkHidden()}render(){return(0,o.dy)` <wui-flex 61 @click=${this.onBoxClick.bind(this)} 62 flexDirection="column" 63 justifyContent="center" 64 gap="4xs" 65 .padding=${["2xl","l","xl","l"]} 66 > 67 <wui-text 68 ${(0,d.i)(this.instructionElementRef)} 69 class="instruction" 70 color="fg-300" 71 variant="medium-400" 72 > 73 Type or 74 <wui-button 75 class="paste" 76 size="md" 77 variant="neutral" 78 iconLeft="copy" 79 @click=${this.onPasteClick.bind(this)} 80 > 81 <wui-icon size="sm" color="inherit" slot="iconLeft" name="copy"></wui-icon> 82 Paste 83 </wui-button> 84 address 85 </wui-text> 86 <textarea 87 spellcheck="false" 88 ?disabled=${!this.instructionHidden} 89 ${(0,d.i)(this.inputElementRef)} 90 @input=${this.onInputChange.bind(this)} 91 @blur=${this.onBlur.bind(this)} 92 .value=${this.value??""} 93 autocomplete="off" 94 > 95${this.value??""}</textarea 96 > 97 </wui-flex>`}async focusInput(){this.instructionElementRef.value&&(this.instructionHidden=!0,await this.toggleInstructionFocus(!1),this.instructionElementRef.value.style.pointerEvents="none",this.inputElementRef.value?.focus(),this.inputElementRef.value&&(this.inputElementRef.value.selectionStart=this.inputElementRef.value.selectionEnd=this.inputElementRef.value.value.length))}async focusInstruction(){this.instructionElementRef.value&&(this.instructionHidden=!1,await this.toggleInstructionFocus(!0),this.instructionElementRef.value.style.pointerEvents="auto",this.inputElementRef.value?.blur())}async toggleInstructionFocus(e){this.instructionElementRef.value&&await this.instructionElementRef.value.animate([{opacity:e?0:1},{opacity:e?1:0}],{duration:100,easing:"ease",fill:"forwards"}).finished}onBoxClick(){this.value||this.instructionHidden||this.focusInput()}onBlur(){this.value||!this.instructionHidden||this.pasting||this.focusInstruction()}checkHidden(){this.instructionHidden&&this.focusInput()}async onPasteClick(){this.pasting=!0;let e=await navigator.clipboard.readText();n.S.setReceiverAddress(e),this.focusInput()}onInputChange(e){let t=e.target;this.pasting=!1,this.value=e.target?.value,t.value&&!this.instructionHidden&&this.focusInput(),n.S.setLoa
97ding(!0),this.onDebouncedSearch(t.value)}setReceiverAddress(e){n.S.setReceiverAddress(e),n.S.setReceiverProfileName(void 0),n.S.setReceiverProfileImageUrl(void 0),n.S.setLoading(!1)}};g.styles=p,w([(0,r.Cb)()],g.prototype,"value",void 0),w([(0,r.SB)()],g.prototype,"instructionHidden",void 0),w([(0,r.SB)()],g.prototype,"pasting",void 0),g=w([(0,u.Mo)("w3m-input-address")],g);var v=i(62848),f=i(41413),m=i(61911),x=i(5437),b=(0,o.iv)` 98 :host { 99 position: relative; 100 display: inline-block; 101 } 102 103 input { 104 background: transparent; 105 width: 100%; 106 height: auto; 107 font-family: var(--wui-font-family); 108 color: var(--wui-color-fg-100); 109 110 font-feature-settings: 'case' on; 111 font-size: 32px; 112 font-weight: var(--wui-font-weight-light); 113 caret-color: var(--wui-color-accent-100); 114 line-height: 130%; 115 letter-spacing: -1.28px; 116 box-sizing: border-box; 117 -webkit-appearance: none; 118 -moz-appearance: textfield; 119 padding: 0px; 120 } 121 122 input::-webkit-outer-spin-button, 123 input::-webkit-inner-spin-button { 124 -webkit-appearance: none; 125 margin: 0; 126 } 127 128 input::placeholder { 129 color: var(--wui-color-fg-275); 130 } 131`,k=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>3?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let y=class extends o.oi{constructor(){super(...arguments),this.inputElementRef=(0,d.V)(),this.disabled=!1,this.value="",this.placeholder="0"}render(){return this.inputElementRef?.value&&this.value&&(this.inputElementRef.value.value=this.value),(0,o.dy)`<input 132 ${(0,d.i)(this.inputElementRef)} 133 type="text" 134 inputmode="decimal" 135 pattern="[0-9,.]*" 136 placeholder=${this.placeholder} 137 ?disabled=${this.disabled} 138 autofocus 139 value=${this.value??""} 140 @input=${this.dispatchInputChangeEvent.bind(this)} 141 /> `}dispatchInputChangeEvent(e){let t=e.data;if(t&&this.inputElementRef?.value){if(","===t){let e=this.inputElementRef.value.value.replace(",",".");this.inputElementRef.value.value=e,this.value=`${this.value}${e}`}else f.ee.test(t)||(this.inputElementRef.value.value=this.value.replace(RegExp(t.replace(f.Cv,"\\$&"),"gu"),""))}this.dispatchEvent(new CustomEvent("inputChange",{detail:this.inputElementRef.value?.value,bubbles:!0,composed:!0}))}};y.styles=[m.ET,m.ZM,b],k([(0,r.Cb)({type:Boolean})],y.prototype,"disabled",void 0),k([(0,r.Cb)({type:String})],y.prototype,"value",void 0),k([(0,r.Cb)({type:String})],y.prototype,"placeholder",void 0),y=k([(0,x.M)("wui-input-amount")],y),i(27352),i(59087);var C=(0,o.iv)` 142 :host { 143 width: 100%; 144 height: 100px; 145 border-radius: var(--wui-border-radius-s); 146 border: 1px solid var(--wui-color-gray-glass-002); 147 background-color: var(--wui-color-gray-glass-002); 148 transition: background-color var(--wui-ease-out-power-1) var(--wui-duration-lg); 149 will-change: background-color; 150 } 151 152 :host(:hover) { 153 background-color: var(--wui-color-gray-glass-005); 154 } 155 156 wui-flex { 157 width: 100%; 158 height: fit-content; 159 } 160 161 wui-button { 162 width: 100%; 163 display: flex; 164 justify-content: flex-end; 165 } 166 167 wui-input-amount { 168 mask-image: linear-gradient( 169 270deg, 170 transparent 0px, 171 transparent 8px, 172 black 24px, 173 black 25px, 174 black 32px, 175 black 100% 176 ); 177 } 178 179 .totalValue { 180 width: 100%; 181 } 182`,S=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>3?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let $=class extends o.oi{render(){return(0,o.dy)` <wui-flex 183 flexDirection="column" 184 gap="4xs" 185 .padding=${["xl","s","l","l"]} 186 > 187 <wui-flex alignItems="center"> 188 <wui-input-amount 189 @inputChange=${this.onInputChange.bind(this)} 190 ?disabled=${!this.token} 191 .value=${this.sendTokenAmount?String(this.sendTokenAmount):""} 192 ></wui-input-amount> 193 ${this.buttonTemplate()} 194 </wui-flex> 195 <wui-flex alignItems="center" justifyContent="space-between"> 196 ${this.sendValueTemplate()} 197 <wui-flex alignItems="center" gap="4xs" justifyContent="flex-end"> 198 ${this.maxAmountTemplate()} ${this.actionTemplate()} 199 </wui-flex> 200 </wui-flex> 201 </wui-flex>`}buttonTemplate(){return this.token?(0,o.dy)`<wui-token-button 202 text=${this.token.symbol} 203 imageSrc=${this.token.iconUrl} 204 @click=${this.handleSelectButtonClick.bind(this)} 205 > 206 </wui-token-button>
206`:(0,o.dy)`<wui-button 207 size="md" 208 variant="accent" 209 @click=${this.handleSelectButtonClick.bind(this)} 210 >Select token</wui-button 211 >`}handleSelectButtonClick(){s.RouterController.push("WalletSendSelectToken")}sendValueTemplate(){if(this.token&&this.sendTokenAmount){let e=this.token.price*this.sendTokenAmount;return(0,o.dy)`<wui-text class="totalValue" variant="small-400" color="fg-200" 212 >${e?`$${u.Hg.formatNumberToLocalString(e,2)}`:"Incorrect value"}</wui-text 213 >`}return null}maxAmountTemplate(){return this.token?this.sendTokenAmount&&this.sendTokenAmount>Number(this.token.quantity.numeric)?(0,o.dy)` <wui-text variant="small-400" color="error-100"> 214 ${u.Hg.roundNumber(Number(this.token.quantity.numeric),6,5)} 215 </wui-text>`:(0,o.dy)` <wui-text variant="small-400" color="fg-200"> 216 ${u.Hg.roundNumber(Number(this.token.quantity.numeric),6,5)} 217 </wui-text>`:null}actionTemplate(){return this.token?this.sendTokenAmount&&this.sendTokenAmount>Number(this.token.quantity.numeric)?(0,o.dy)`<wui-link @click=${this.onBuyClick.bind(this)}>Buy</wui-link>`:(0,o.dy)`<wui-link @click=${this.onMaxClick.bind(this)}>Max</wui-link>`:null}onInputChange(e){n.S.setTokenAmount(e.detail)}onMaxClick(){if(this.token){let e=v.C.bigNumber(this.token.quantity.numeric);n.S.setTokenAmount(Number(e.toFixed(20)))}}onBuyClick(){s.RouterController.push("OnRampProviders")}};$.styles=C,S([(0,r.Cb)({type:Object})],$.prototype,"token",void 0),S([(0,r.Cb)({type:Number})],$.prototype,"sendTokenAmount",void 0),$=S([(0,u.Mo)("w3m-input-token")],$);var T=(0,o.iv)` 218 :host { 219 display: block; 220 } 221 222 wui-flex { 223 position: relative; 224 } 225 226 wui-icon-box { 227 width: 40px; 228 height: 40px; 229 border-radius: var(--wui-border-radius-xs) !important; 230 border: 5px solid var(--wui-color-bg-125); 231 background: var(--wui-color-bg-175); 232 position: absolute; 233 top: 50%; 234 left: 50%; 235 transform: translate(-50%, -50%); 236 z-index: 3; 237 } 238 239 wui-button { 240 --local-border-radius: var(--wui-border-radius-xs) !important; 241 } 242 243 .inputContainer { 244 height: fit-content; 245 } 246`,R=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>3?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let A=class extends o.oi{constructor(){super(),this.unsubscribe=[],this.token=n.S.state.token,this.sendTokenAmount=n.S.state.sendTokenAmount,this.receiverAddress=n.S.state.receiverAddress,this.receiverProfileName=n.S.state.receiverProfileName,this.loading=n.S.state.loading,this.message="Preview Send",this.fetchNetworkPrice(),this.fetchBalances(),this.unsubscribe.push(n.S.subscribe(e=>{this.token=e.token,this.sendTokenAmount=e.sendTokenAmount,this.receiverAddress=e.receiverAddress,this.receiverProfileName=e.receiverProfileName,this.loading=e.loading}))}disconnectedCallback(){this.unsubscribe.forEach(e=>e())}render(){return this.getMessage(),(0,o.dy)` <wui-flex flexDirection="column" .padding=${["0","l","l","l"]}> 247 <wui-flex class="inputContainer" gap="xs" flexDirection="column"> 248 <w3m-input-token 249 .token=${this.token} 250 .sendTokenAmount=${this.sendTokenAmount} 251 ></w3m-input-token> 252 <wui-icon-box 253 size="inherit" 254 backgroundColor="fg-300" 255 iconSize="lg" 256 iconColor="fg-250" 257 background="opaque" 258 icon="arrowBottom" 259 ></wui-icon-box> 260 <w3m-input-address 261 .value=${this.receiverProfileName?this.receiverProfileName:this.receiverAddress} 262 ></w3m-input-address> 263 </wui-flex> 264 <wui-flex .margin=${["l","0","0","0"]}> 265 <wui-button 266 @click=${this.onButtonClick.bind(this)} 267 ?disabled=${!this.message.startsWith("Preview Send")} 268 size="lg" 269 variant="main" 270 ?loading=${this.loading} 271 fullWidth 272 > 273 ${this.message} 274 </wui-button>
274 275 </wui-flex> 276 </wui-flex>`}async fetchBalances(){await n.S.fetchTokenBalance(),n.S.fetchNetworkBalance()}async fetchNetworkPrice(){await a.nY.getNetworkTokenPrice()}onButtonClick(){s.RouterController.push("WalletSendPreview")}getMessage(){this.message="Preview Send",this.receiverAddress&&!l.j.isAddress(this.receiverAddress,c.R.state.activeChain)&&(this.message="Invalid Address"),this.receiverAddress||(this.message="Add Address"),this.sendTokenAmount&&this.token&&this.sendTokenAmount>Number(this.token.quantity.numeric)&&(this.message="Insufficient Funds"),this.sendTokenAmount||(this.message="Add Amount"),this.sendTokenAmount&&this.token?.price&&!(this.sendTokenAmount*this.token.price)&&(this.message="Incorrect Value"),this.token||(this.message="Select Token")}};A.styles=T,R([(0,r.SB)()],A.prototype,"token",void 0),R([(0,r.SB)()],A.prototype,"sendTokenAmount",void 0),R([(0,r.SB)()],A.prototype,"receiverAddress",void 0),R([(0,r.SB)()],A.prototype,"receiverProfileName",void 0),R([(0,r.SB)()],A.prototype,"loading",void 0),R([(0,r.SB)()],A.prototype,"message",void 0),A=R([(0,u.Mo)("w3m-wallet-send-view")],A),i(86236),i(97417),i(26905);var P=(0,o.iv)` 277 .contentContainer { 278 height: 440px; 279 overflow: scroll; 280 scrollbar-width: none; 281 } 282 283 .contentContainer::-webkit-scrollbar {
284 display: none; 285 } 286 287 wui-icon-box { 288 width: 40px; 289 height: 40px; 290 border-radius: var(--wui-border-radius-xxs); 291 } 292`,N=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>3?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let j=class extends o.oi{constructor(){super(),this.unsubscribe=[],this.tokenBalances=n.S.state.tokenBalances,this.search="",this.onDebouncedSearch=l.j.debounce(e=>{this.search=e}),this.unsubscribe.push(n.S.subscribe(e=>{this.tokenBalances=e.tokenBalances}))}disconnectedCallback(){this.unsubscribe.forEach(e=>e())}render(){return(0,o.dy)` 293 <wui-flex flexDirection="column"> 294 ${this.templateSearchInput()} <wui-separator></wui-separator> ${this.templateTokens()} 295 </wui-flex> 296 `}templateSearchInput(){return(0,o.dy)` 297 <wui-flex gap="xs" padding="s"> 298 <wui-input-text 299 @inputChange=${this.onInputChange.bind(this)} 300 class="network-search-input" 301 size="sm" 302 placeholder="Search token" 303 icon="search" 304 ></wui-input-text> 305 </wui-flex> 306 `}templateTokens(){return this.tokens=this.tokenBalances?.filter(e=>e.chainId===c.R.state.activeCaipNetwork?.caipNetworkId),this.search?this.filteredTokens=this.tokenBalances?.filter(e=>e.name.toLowerCase().includes(this.search.toLowerCase())):this.filteredTokens=this.tokens,(0,o.dy)` 307 <wui-flex 308 class="contentContainer" 309 flexDirection="column" 310 .padding=${["0","s","0","s"]} 311 > 312 <wui-flex justifyContent="flex-start" .padding=${["m","s","s","s"]}> 313 <wui-text variant="paragraph-500" color="fg-200">Your tokens</wui-text> 314 </wui-flex> 315 <wui-flex flexDirection="column" gap="xs"> 316 ${this.filteredTokens&&this.filteredTokens.length>0?this.filteredTokens.map(e=>(0,o.dy)`<wui-list-token 317 @click=${this.handleTokenClick.bind(this,e)} 318 ?clickable=${!0} 319 tokenName=${e.name} 320 tokenImageUrl=${e.iconUrl} 321 tokenAmount=${e.quantity.numeric} 322 tokenValue=${e.value} 323 tokenCurrency=${e.symbol} 324 ></wui-list-token>`):(0,o.dy)`<wui-flex 325 .padding=${["4xl","0","0","0"]} 326 alignItems="center" 327 flexDirection="column" 328 gap="l" 329 > 330 <wui-icon-box 331 icon="coinPlaceholder" 332 size="inherit" 333 iconColor="fg-200" 334 backgroundColor="fg-200" 335 iconSize="lg" 336 ></wui-icon-box> 337 <wui-flex 338 class="textContent" 339 gap="xs" 340 flexDirection="column" 341 justifyContent="center" 342 flexDirection="column" 343 > 344 <wui-text variant="paragraph-500" align="center" color="fg-100" 345 >No tokens found</wui-text 346 > 347 <wui-text variant="small-400" align="center" color="fg-200" 348 >Your tokens will appear here</wui-text 349 > 350 </wui-flex> 351 <wui-link @click=${this.onBuyClick.bind(this)}>Buy</wui-link> 352 </wui-flex>`} 353 </wui-flex> 354 </wui-flex> 355 `}onBuyClick(){s.RouterController.push("OnRampProviders")}onInputChange(e){this.onDebouncedSearch(e.detail)}handleTokenClick(e){n.S.setToken(e),n.S.setTokenAmount(void 0),s.RouterController.goBack()}};j.styles=P,N([(0,r.SB)()],j.prototype,"tokenBalances",void 0),N([(0,r.SB)()],j.prototype,"tokens",void 0),N([(0,r.SB)()],j.prototype,"filteredTokens",void 0),N([(0,r.SB)()],j.prototype,"search",void 0),j=N([(0,u.Mo)("w3m-wallet-send-select-token-view")],j);var B=i(1181),E=i(302),I=i(41106);i(78463),i(80019),i(29749),i(73708),i(62951);var O=(0,o.iv)` 356 :host { 357 display: flex; 358 gap: var(--wui-spacing-xs); 359 border-radius: var(--wui-border-radius-3xl); 360 border: 1px solid var(--wui-color-gray-glass-002); 361 background: var(--wui-color-gray-glass-002); 362 padding: var(--wui-spacing-2xs) var(--wui-spacing-xs) var(--wui-spacing-2xs) 363 var(--wui-spacing-s); 364 align-items: center; 365 } 366 367 wui-avatar, 368 wui-icon, 369 wui-image { 370 width: 32px; 371 height: 32px; 372 border: 1px solid var(--wui-color-gray-glass-002); 373 border-radius: var(--wui-border-radius-3xl); 374 box-shadow: 0 0 0 2px var(--wui-color-gray-glass-002); 375 } 376`,z=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>
3763?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let D=class extends o.oi{constructor(){super(...arguments),this.text="",this.address="",this.isAddress=!1}render(){return(0,o.dy)`<wui-text variant="large-500" color="fg-100">${this.text}</wui-text> 377 ${this.imageTemplate()}`}imageTemplate(){return this.isAddress?(0,o.dy)`<wui-avatar address=${this.address} .imageSrc=${this.imageSrc}></wui-avatar>`:this.imageSrc?(0,o.dy)`<wui-image src=${this.imageSrc}></wui-image>`:(0,o.dy)`<wui-icon size="inherit" color="fg-200" name="networkPlaceholder"></wui-icon>`}};D.styles=[m.ET,m.ZM,O],z([(0,r.Cb)()],D.prototype,"text",void 0),z([(0,r.Cb)()],D.prototype,"address",void 0),z([(0,r.Cb)()],D.prototype,"imageSrc",void 0),z([(0,r.Cb)({type:Boolean})],D.prototype,"isAddress",void 0),D=z([(0,x.M)("wui-preview-item")],D);var M=i(34764),V=i(82518),H=i(77141),U=(0,o.iv)` 378 :host { 379 display: flex; 380 column-gap: var(--wui-spacing-s); 381 padding: 17px 18px 17px var(--wui-spacing-m); 382 width: 100%; 383 background-color: var(--wui-color-gray-glass-002); 384 border-radius: var(--wui-border-radius-xs); 385 color: var(--wui-color-fg-250); 386 } 387 388 wui-image { 389 width: var(--wui-icon-size-lg); 390 height: var(--wui-icon-size-lg); 391 border-radius: var(--wui-border-radius-3xl); 392 } 393 394 wui-icon { 395 width: var(--wui-icon-size-lg); 396 height: var(--wui-icon-size-lg); 397 } 398`,L=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>3?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let W=class extends o.oi{constructor(){super(...arguments),this.imageSrc=void 0,this.textTitle="",this.textValue=void 0}render(){return(0,o.dy)` 399 <wui-flex justifyContent="space-between" alignItems="center"> 400 <wui-text variant="paragraph-500" color=${this.textValue?"fg-200":"fg-100"}> 401 ${this.textTitle} 402 </wui-text> 403 ${this.templateContent()} 404 </wui-flex> 405 `}templateContent(){return this.imageSrc?(0,o.dy)`<wui-image src=${this.imageSrc} alt=${this.textTitle}></wui-image>`:this.textValue?(0,o.dy)` <wui-text variant="paragraph-400" color="fg-100"> ${this.textValue} </wui-text>`:(0,o.dy)`<wui-icon size="inherit" color="fg-200" name="networkPlaceholder"></wui-icon>`}};W.styles=[m.ET,m.ZM,U],L([(0,r.Cb)()],W.prototype,"imageSrc",void 0),L([(0,r.Cb)()],W.prototype,"textTitle",void 0),L([(0,r.Cb)()],W.prototype,"textValue",void 0),W=L([(0,x.M)("wui-list-content")],W);var q=(0,o.iv)` 406 :host { 407 display: flex; 408 width: auto; 409 flex-direction: column; 410 gap: var(--wui-border-radius-1xs); 411 border-radius: var(--wui-border-radius-s); 412 background: var(--wui-color-gray-glass-002); 413 padding: var(--wui-spacing-s) var(--wui-spacing-1xs) var(--wui-spacing-1xs) 414 var(--wui-spacing-1xs); 415 } 416 417 wui-text { 418 padding: 0 var(--wui-spacing-1xs); 419 } 420 421 wui-flex { 422 margin-top: var(--wui-spacing-1xs); 423 } 424 425 .network { 426 cursor: pointer; 427 transition: background-color var(--wui-ease-out-power-1) var(--wui-duration-lg); 428 will-change: background-color; 429 } 430 431 .network:focus-visible { 432 border: 1px solid var(--wui-color-accent-100); 433 background-color: var(--wui-color-gray-glass-005); 434 -webkit-box-shadow: 0px 0px 0px 4px var(--wui-box-shadow-blue); 435 -moz-box-shadow: 0px 0px 0px 4px var(--wui-box-shadow-blue); 436 box-shadow: 0px 0px 0px 4px var(--wui-box-shadow-blue); 437 } 438 439 .network:hover { 440 background-color: var(--wui-color-gray-glass-005); 441 } 442 443 .network:active { 444 background-color: var(--wui-color-gray-glass-010); 445 } 446`,F=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>3?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let _=class extends o.oi{render(){return(0,o.dy)` <wui-text variant="small-400" color="fg-200">Details</wui-text> 447 <wui-flex flexDirection="column" gap="xxs"> 448 <wui-list-content 449 textTitle="Address" 450 textValue=${u.Hg.getTruncateString({string:this.receiverAddress??"",charsStart:4,charsEnd:4,truncate:"middle"})} 451 > 452 </wui-list-content> 453 ${this.networkTemplate()} 454 </wui-flex>`}networkTemplate(){return this.caipNetwork?.name?(0,o.dy)` <wui-list-content 455 @click=${()=>this.onNetworkClick(this.caipNetwork)} 456 class="network" 457 textTitle="Network" 458 imageSrc=${(0,V.o)(H.f.getNetworkImage(this.caipNetwork))} 459 ></wui-list-content>`:null}onNetworkClick(e){e&&s.RouterController.push("Networks",{network:e})}};_.styles=q,F([(0,r.Cb)()],_.prototype,"receiverAddress",void 0),F([(0,r.Cb)({type:Object})],_.prototype,"caipNetwork",void 0),_=F([(0,u.Mo)("w3m-wallet-send-details")],_);var Y=(0,o.iv)` 460 wui-avatar, 461 wui-image { 462 display: ruby; 463 width: 32px; 464 height: 32px; 465 border-radius: var(--wui-border-radius-3xl); 466 } 467 468 .sendButton { 469 width: 70%; 470 --local-width: 100% !important; 471 --local-border-radius: var(--wui-border-radius-xs) !important; 472 } 473 474 .cancelButton { 475 width: 30%; 476 --local-width: 100% !important; 477 --local-border-radius: var(--wui-border-radius-xs) !important; 478 } 479`,Z=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>
4793?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let K=class extends o.oi{constructor(){super(),this.unsubscribe=[],this.token=n.S.state.token,this.sendTokenAmount=n.S.state.sendTokenAmount,this.receiverAddress=n.S.state.receiverAddress,this.receiverProfileName=n.S.state.receiverProfileName,this.receiverProfileImageUrl=n.S.state.receiverProfileImageUrl,this.caipNetwork=c.R.state.activeCaipNetwork,this.loading=n.S.state.loading,this.unsubscribe.push(n.S.subscribe(e=>{this.token=e.token,this.sendTokenAmount=e.sendTokenAmount,this.receiverAddress=e.receiverAddress,this.receiverProfileName=e.receiverProfileName,this.receiverProfileImageUrl=e.receiverProfileImageUrl,this.loading=e.loading}),c.R.subscribeKey("activeCaipNetwork",e=>this.caipNetwork=e))}disconnectedCallback(){this.unsubscribe.forEach(e=>e())}render(){return(0,o.dy)` <wui-flex flexDirection="column" .padding=${["0","l","l","l"]}> 480 <wui-flex gap="xs" flexDirection="column" .padding=${["0","xs","0","xs"]}> 481 <wui-flex alignItems="center" justifyContent="space-between"> 482 <wui-flex flexDirection="column" gap="4xs"> 483 <wui-text variant="small-400" color="fg-150">Send</wui-text> 484 ${this.sendValueTemplate()} 485 </wui-flex> 486 <wui-preview-item 487 text="${this.sendTokenAmount?u.Hg.roundNumber(this.sendTokenAmount,6,5):"unknown"} ${this.token?.symbol}" 488 .imageSrc=${this.token?.iconUrl} 489 ></wui-preview-item> 490 </wui-flex> 491 <wui-flex> 492 <wui-icon color="fg-200" size="md" name="arrowBottom"></wui-icon> 493 </wui-flex> 494 <wui-flex alignItems="center" justifyContent="space-between"> 495 <wui-text variant="small-400" color="fg-150">To</wui-text> 496 <wui-preview-item 497 text="${this.receiverProfileName?u.Hg.getTruncateString({string:this.receiverProfileName,charsStart:20,charsEnd:0,truncate:"end"}):u.Hg.getTruncateString({string:this.receiverAddress?this.receiverAddress:"",charsStart:4,charsEnd:4,truncate:"middle"})}" 498 address=${this.receiverAddress??""} 499 .imageSrc=${this.receiverProfileImageUrl??void 0} 500 .isAddress=${!0} 501 ></wui-preview-item> 502 </wui-flex> 503 </wui-flex> 504 <wui-flex flexDirection="column" .padding=${["xxl","0","0","0"]}> 505 <w3m-wallet-send-details 506 .caipNetwork=${this.caipNetwork} 507 .receiverAddress=${this.receiverAddress} 508 ></w3m-wallet-send-details> 509 <wui-flex justifyContent="center" gap="xxs" .padding=${["s","0","0","0"]}> 510 <wui-icon size="sm" color="fg-200" name="warningCircle"></wui-icon> 511 <wui-text variant="small-400" color="fg-200">Review transaction carefully</wui-text> 512 </wui-flex> 513 <wui-flex justifyContent="center" gap="s" .padding=${["l","0","0","0"]}> 514 <wui-button 515 class="cancelButton" 516 @click=${this.onCancelClick.bind(this)} 517 size="lg" 518 variant="neutral" 519 > 520 Cancel 521 </wui-button> 522 <wui-button 523 class="sendButton" 524 @click=${this.onSendClick.bind(this)} 525 size="lg" 526 variant="main" 527 .loading=${this.loading} 528 > 529 Send 530 </wui-button> 531 </wui-flex> 532 </wui-flex></wui-flex 533 >`}sendValueTemplate(){if(this.token&&this.sendTokenAmount){let e=this.token.price*this.sendTokenAmount;return(0,o.dy)`<wui-text variant="paragraph-400" color="fg-100" 534 >$${e.toFixed(2)}</wui-text 535 >`}return null}async onSendClick(){if(!this.sendTokenAmount||!this.receiverAddress){B.SnackController.showError("Please enter a valid amount and receiver address");return}try{await n.S.sendToken(),B.SnackController.showSuccess("Transaction started"),s.RouterController.replace("Account")}catch(i){B.SnackController.showError("Failed to send transaction. Please try again."),console.error("SendController:sendToken - failed to send transaction",i);let e=c.R.state.activeChain,t=i instanceof Error?i.message:"Unknown error";E.X.sendEvent({type:"track",event:"SEND_ERROR",properties:{message:t,isSmartAccount:I.AccountController.state.preferredAccountTypes?.[e]===M.y_.ACCOUNT_TYPES.SMART_ACCOUNT,token:this.token?.symbol||"",amount:this.sendTokenAmount,network:c.R.state.activeCaipNetwork?.caipNetworkId||""}})}}onCancelClick(){s.RouterController.goBack()}};K.styles=Y,Z([(0,r.SB)()],K.prototype,"token",void 0),Z([(0,r.SB)()],K.prototype,"sendTokenAmount",void 0),Z([(0,r.SB)()],K.prototype,"receiverAddress",void 0),Z([(0,r.SB)()],K.prototype,"receiverProfileName",void 0),Z([(0,r.SB)()],K.prototype,"receiverProfileImageUrl",void 0),Z([(0,r.SB)()],K.prototype,"caipNetwork",void 0),Z([(0,r.SB)()],K.prototype,"loading",void 0),K=Z([(0,u.Mo)("w3m-wallet-send-preview-view")],K)},50038:function(e,t,i){i(83230)},27352:function(e,t,i){var o=i(42972),r=i(74023),n=i(82518);i(29749);var a=i(61911),s=i(5437),l=(0,o.iv)` 536 button { 537 padding: var(--wui-spacing-4xs) var(--wui-spacing-xxs); 538 border-radius: var(--wui-border-radius-3xs); 539 background-color: transparent; 540 color: var(--wui-color-accent-100); 541 } 542 543 button:disabled { 544 background-color: transparent; 545 color: var(--wui-color-gray-glass-015); 546 } 547 548 button:hover { 549 background-color: var(--wui-color-gray-glass-005); 550 } 551`,c=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>
5513?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let u=class extends o.oi{constructor(){super(...arguments),this.tabIdx=void 0,this.disabled=!1,this.color="inherit"}render(){return(0,o.dy)` 552 <button ?disabled=${this.disabled} tabindex=${(0,n.o)(this.tabIdx)}> 553 <slot name="iconLeft"></slot> 554 <wui-text variant="small-600" color=${this.color}> 555 <slot></slot> 556 </wui-text> 557 <slot name="iconRight"></slot> 558 </button> 559 `}};u.styles=[a.ET,a.ZM,l],c([(0,r.Cb)()],u.prototype,"tabIdx",void 0),c([(0,r.Cb)({type:Boolean})],u.prototype,"disabled",void 0),c([(0,r.Cb)()],u.prototype,"color",void 0),c([(0,s.M)("wui-link")],u)},97417:function(e,t,i){var o=i(42972),r=i(74023);i(78463),i(80019),i(29749),i(73708);var n=i(61911),a=i(69921),s=i(5437),l=(0,o.iv)` 560 button { 561 padding: 6.5px var(--wui-spacing-l) 6.5px var(--wui-spacing-xs); 562 display: flex; 563 justify-content: space-between; 564 width: 100%; 565 border-radius: var(--wui-border-radius-xs); 566 background-color: var(--wui-color-gray-glass-002); 567 } 568 569 button[data-clickable='false'] { 570 pointer-events: none; 571 background-color: transparent; 572 } 573 574 wui-image, 575 wui-icon { 576 width: var(--wui-spacing-3xl); 577 height: var(--wui-spacing-3xl); 578 } 579 580 wui-image { 581 border-radius: var(--wui-border-radius-3xl); 582 } 583`,c=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>3?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let u=class extends o.oi{constructor(){super(...arguments),this.tokenName="",this.tokenImageUrl="",this.tokenValue=0,this.tokenAmount="0.0",this.tokenCurrency="",this.clickable=!1}render(){return(0,o.dy)` 584 <button data-clickable=${String(this.clickable)}> 585 <wui-flex gap="s" alignItems="center"> 586 ${this.visualTemplate()} 587 <wui-flex flexDirection="column" justifyContent="spaceBetween"> 588 <wui-text variant="paragraph-500" color="fg-100">${this.tokenName}</wui-text> 589 <wui-text variant="small-400" color="fg-200"> 590 ${a.H.formatNumberToLocalString(this.tokenAmount,4)} ${this.tokenCurrency} 591 </wui-text> 592 </wui-flex> 593 </wui-flex> 594 <wui-text variant="paragraph-500" color="fg-100">$${this.tokenValue.toFixed(2)}</wui-text> 595 </button> 596 `}visualTemplate(){return this.tokenName&&this.tokenImageUrl?(0,o.dy)`<wui-image alt=${this.tokenName} src=${this.tokenImageUrl}></wui-image>`:(0,o.dy)`<wui-icon name="coinPlaceholder" color="fg-100"></wui-icon>`}};u.styles=[n.ET,n.ZM,l],c([(0,r.Cb)()],u.prototype,"tokenName",void 0),c([(0,r.Cb)()],u.prototype,"tokenImageUrl",void 0),c([(0,r.Cb)({type:Number})],u.prototype,"tokenValue",void 0),c([(0,r.Cb)()],u.prototype,"tokenAmount",void 0),c([(0,r.Cb)()],u.prototype,"tokenCurrency",void 0),c([(0,r.Cb)({type:Boolean})],u.prototype,"clickable",void 0),c([(0,s.M)("wui-list-token")],u)},26905:function(e,t,i){var o=i(42972),r=i(74023);i(29749);var n=i(61911),a=i(5437),s=(0,o.iv)` 597 :host { 598 position: relative; 599 display: flex; 600 width: 100%; 601 height: 1px; 602 background-color: var(--wui-color-gray-glass-005); 603 justify-content: center; 604 align-items: center; 605 } 606 607 :host > wui-text { 608 position: absolute; 609 padding: 0px 10px; 610 background-color: var(--wui-color-modal-bg); 611 transition: background-color var(--wui-duration-lg) var(--wui-ease-out-power-1); 612 will-change: background-color; 613 } 614`,l=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>3?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let c=class extends o.oi{constructor(){super(...arguments),this.text=""}render(){return(0,o.dy)`${this.template()}`}template(){return this.text?(0,o.dy)`<wui-text variant="small-500" color="fg-200">${this.text}</wui-text>`:null}};c.styles=[n.ET,s],l([(0,r.Cb)()],c.prototype,"text",void 0),l([(0,a.M)("wui-separator")],c)},62951:function(e,t,i){var o=i(42972),r=i(74023);i(80019);var n=i(61911),a=i(69921),s=i(5437),l=(0,o.iv)` 615 :host { 616 display: block; 617 width: var(--local-width); 618 height: var(--local-height); 619 border-radius: var(--wui-border-radius-3xl); 620 box-shadow: 0 0 0 8px var(--wui-color-gray-glass-005); 621 overflow: hidden; 622 position: relative; 623 } 624 625 :host([data-variant='generated']) { 626 --mixed-local-color-1: var(--local-color-1); 627 --mixed-local-color-2: var(--local-color-2); 628 --mixed-local-color-3: var(--local-color-3); 629 --mixed-local-color-4: var(--local-color-4); 630 --mixed-local-color-5: var(--local-color-5); 631 } 632 633 @supports (background: color-mix(in srgb, white 50%, black)) { 634 :host([data-variant='generated']) { 635 --mixed-local-color-1: color-mix( 636 in srgb, 637 var(--w3m-color-mix) var(--w3m-color-mix-strength), 638 var(--local-color-1) 639 ); 640 --mixed-local-color-2: color-mix( 641 in srgb, 642 var(--w3m-color-mix) var(--w3m-color-mix-strength), 643 var(--local-color-2) 644 ); 645 --mixed-local-color-3: color-mix( 646 in srgb, 647 var(--w3m-color-mix) var(--w3m-color-mix-strength), 648 var(--local-color-3) 649 ); 650 --mixed-local-color-4: color-mix( 651 in srgb, 652 var(--w3m-color-mix) var(--w3m-color-mix-strength), 653 var(--local-color-4) 654 ); 655 --mixed-local-color-5: color-mix( 656 in srgb, 657 var(--w3m-color-mix) var(--w3m-color-mix-strength), 658 var(--local-color-5) 659 ); 660 } 661 } 662 663 :host([data-variant='generated']) { 664 box-shadow: 0 0 0 8px var(--wui-color-gray-glass-005); 665 background: radial-gradient( 666 var(--local-radial-circle), 667 #fff 0.52%, 668 var(--mixed-local-color-5) 31.25%, 669 var(--mixed-local-color-3) 51.56%, 670 var(--mixed-local-color-2) 65.63%, 671 var(--mixed-local-color-1) 82.29%, 672 var(--mixed-local-color-4) 100% 673 ); 674 } 675 676 :host([data-variant='default']) { 677 box-shadow: 0 0 0 8px var(--wui-color-gray-glass-005); 678 background: radial-gradient( 679 75.29% 75.29% at 64.96% 24.36%, 680 #fff 0.52%, 681 #f5ccfc 31.25%, 682 #dba4f5 51.56%, 683 #9a8ee8 65.63%, 684 #6493da 82.29%, 685 #6ebdea 100% 686 ); 687 } 688`,c=function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>
6883?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let u=class extends o.oi{constructor(){super(...arguments),this.imageSrc=void 0,this.alt=void 0,this.address=void 0,this.size="xl"}render(){return this.style.cssText=` 689 --local-width: var(--wui-icon-box-size-${this.size}); 690 --local-height: var(--wui-icon-box-size-${this.size}); 691 `,(0,o.dy)`${this.visualTemplate()}`}visualTemplate(){if(this.imageSrc)return this.dataset.variant="image",(0,o.dy)`<wui-image src=${this.imageSrc} alt=${this.alt??"avatar"}></wui-image>`;if(this.address){this.dataset.variant="generated";let e=a.H.generateAvatarColors(this.address);return this.style.cssText+=` 692 ${e}`,null}return this.dataset.variant="default",null}};u.styles=[n.ET,l],c([(0,r.Cb)()],u.prototype,"imageSrc",void 0),c([(0,r.Cb)()],u.prototype,"alt",void 0),c([(0,r.Cb)()],u.prototype,"address",void 0),c([(0,r.Cb)()],u.prototype,"size",void 0),c([(0,s.M)("wui-avatar")],u)},41413:function(e,t,i){i.d(t,{Cv:function(){return o},Ub:function(){return n},ee:function(){return r}});let o=/[.*+?^${}()|[\]\\]/gu,r=/[0-9,.]/u,n="https://reown.com"}}]);
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.