@shapeshiftoss/swap-widget 0.0.2 → 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (159) hide show
  1. package/dist/index.d.ts +233 -0
  2. package/dist/index.js +63612 -0
  3. package/dist/style.css +1 -0
  4. package/package.json +69 -18
  5. package/Dockerfile +0 -87
  6. package/dist/assets/PhArrowCircleDown-B305t-Sh.js +0 -14
  7. package/dist/assets/PhArrowClockwise-CJPxQhr_.js +0 -14
  8. package/dist/assets/PhArrowDown-C4hT9BVu.js +0 -14
  9. package/dist/assets/PhArrowLeft-Way4Cu-r.js +0 -14
  10. package/dist/assets/PhArrowRight-Cp5ZME0F.js +0 -14
  11. package/dist/assets/PhArrowSquareOut-NnrK69c5.js +0 -14
  12. package/dist/assets/PhArrowUp-Dph6j8rm.js +0 -14
  13. package/dist/assets/PhArrowUpRight-BpJjRRRh.js +0 -14
  14. package/dist/assets/PhArrowsClockwise-CFUT8X7R.js +0 -14
  15. package/dist/assets/PhArrowsDownUp-BjBI4ckC.js +0 -14
  16. package/dist/assets/PhArrowsLeftRight-CuLpbKRk.js +0 -14
  17. package/dist/assets/PhBank-Dchr4XQJ.js +0 -14
  18. package/dist/assets/PhBrowser-dUu2TrC1.js +0 -14
  19. package/dist/assets/PhCaretDown-78IuKU3V.js +0 -14
  20. package/dist/assets/PhCaretLeft-_aiyH7n1.js +0 -14
  21. package/dist/assets/PhCaretRight-8zJQEuDX.js +0 -14
  22. package/dist/assets/PhCaretUp-CiCxKWwN.js +0 -14
  23. package/dist/assets/PhCheck-CcADx8br.js +0 -14
  24. package/dist/assets/PhCircleHalf-BYzSzd2h.js +0 -14
  25. package/dist/assets/PhClock-UItiXeJq.js +0 -14
  26. package/dist/assets/PhCompass-CUy3uA7t.js +0 -14
  27. package/dist/assets/PhCopy-C-PDgSlZ.js +0 -14
  28. package/dist/assets/PhCreditCard-CWRaUT6F.js +0 -14
  29. package/dist/assets/PhCurrencyDollar-Cqla3AXT.js +0 -14
  30. package/dist/assets/PhDesktop-BBIPrYLl.js +0 -14
  31. package/dist/assets/PhDeviceMobile-BdsPaATg.js +0 -14
  32. package/dist/assets/PhDotsThree-BMXCQl-0.js +0 -14
  33. package/dist/assets/PhEnvelope-yUsis6yU.js +0 -14
  34. package/dist/assets/PhFunnelSimple-Ba7BbWTp.js +0 -14
  35. package/dist/assets/PhGlobe-DgLxBk5U.js +0 -14
  36. package/dist/assets/PhIdentificationCard-Czjmq9Z3.js +0 -14
  37. package/dist/assets/PhImage-BAJ_erz6.js +0 -14
  38. package/dist/assets/PhInfo-Cr4DhVUE.js +0 -14
  39. package/dist/assets/PhLightbulb-BX_7duTr.js +0 -14
  40. package/dist/assets/PhMagnifyingGlass-Mygfryvz.js +0 -14
  41. package/dist/assets/PhPaperPlaneRight-BeuCA660.js +0 -14
  42. package/dist/assets/PhPlus-BMjcHjsT.js +0 -14
  43. package/dist/assets/PhPower-CGffGmdb.js +0 -14
  44. package/dist/assets/PhPuzzlePiece-wm_GpVSi.js +0 -14
  45. package/dist/assets/PhQrCode-DRwRzXCH.js +0 -14
  46. package/dist/assets/PhQuestion-M09j2U0T.js +0 -14
  47. package/dist/assets/PhQuestionMark-BP9EMB6h.js +0 -14
  48. package/dist/assets/PhSealCheck-BfG80yKn.js +0 -14
  49. package/dist/assets/PhSignOut-C5YOWlPT.js +0 -14
  50. package/dist/assets/PhSpinner-BXooDYzU.js +0 -14
  51. package/dist/assets/PhTrash-Biq6rmmL.js +0 -14
  52. package/dist/assets/PhUser-CAgZSpGe.js +0 -14
  53. package/dist/assets/PhVault-l2PHF38a.js +0 -14
  54. package/dist/assets/PhWallet-w25D16It.js +0 -14
  55. package/dist/assets/PhWarning-DPEydIPw.js +0 -14
  56. package/dist/assets/PhWarningCircle-BqjT745H.js +0 -14
  57. package/dist/assets/PhX-s-SmVExa.js +0 -14
  58. package/dist/assets/SwapController-If0bFrNc.js +0 -1
  59. package/dist/assets/ccip-BBB7uCdL.js +0 -1
  60. package/dist/assets/ccip-CkkdfKKI.js +0 -1
  61. package/dist/assets/data-capture-D4gAy-Yc.js +0 -242
  62. package/dist/assets/email-B1AJehis.js +0 -90
  63. package/dist/assets/embedded-wallet-Q6DQopDk.js +0 -410
  64. package/dist/assets/features-B6JAPAFb.js +0 -5
  65. package/dist/assets/index-5jd8RPN9.js +0 -7428
  66. package/dist/assets/index-B4kNtSTk.js +0 -1080
  67. package/dist/assets/index-B753eAob.js +0 -1
  68. package/dist/assets/index-BZoLTv77.js +0 -3
  69. package/dist/assets/index-Bcw9UURX.js +0 -3
  70. package/dist/assets/index-BkrV-ahK.js +0 -2
  71. package/dist/assets/index-CRQzQ_up.js +0 -9
  72. package/dist/assets/index-CSW0Gt5y.js +0 -132
  73. package/dist/assets/index-CZ4jTIsk.js +0 -138
  74. package/dist/assets/index-Cwa8SB3h.js +0 -61
  75. package/dist/assets/index-DEwQgT4r.js +0 -78
  76. package/dist/assets/index-DVfQiQ1d.js +0 -1
  77. package/dist/assets/index-cV3UdaMs.css +0 -1
  78. package/dist/assets/index-hAmu622O.js +0 -43
  79. package/dist/assets/onramp-XcPNCLRU.js +0 -422
  80. package/dist/assets/pay-with-exchange-BeHt4OF4.js +0 -280
  81. package/dist/assets/property-C9JG5tag.js +0 -27
  82. package/dist/assets/receive-7ff4he2S.js +0 -131
  83. package/dist/assets/send-CkMBIRXT.js +0 -554
  84. package/dist/assets/socials-DmmxuLrP.js +0 -250
  85. package/dist/assets/swaps-IHAYRQ0x.js +0 -1050
  86. package/dist/assets/transactions-9Cxdk7o9.js +0 -16
  87. package/dist/assets/v4-BOvFkHkt.js +0 -1
  88. package/dist/assets/w3m-modal-kJzFnBfB.js +0 -891
  89. package/dist/assets/wallet-standard-Dv8LMoUB.js +0 -1
  90. package/dist/favicon.png +0 -0
  91. package/dist/favicon.svg +0 -11
  92. package/dist/icon-192x192.png +0 -0
  93. package/dist/icon-512x512.png +0 -0
  94. package/dist/index.html +0 -33
  95. package/index.html +0 -32
  96. package/public/favicon.png +0 -0
  97. package/public/favicon.svg +0 -11
  98. package/public/icon-192x192.png +0 -0
  99. package/public/icon-512x512.png +0 -0
  100. package/railway.toml +0 -10
  101. package/src/api/client.ts +0 -95
  102. package/src/components/AddressInputModal.css +0 -173
  103. package/src/components/AddressInputModal.tsx +0 -250
  104. package/src/components/ApprovalStep.tsx +0 -92
  105. package/src/components/ExecutionStep.tsx +0 -27
  106. package/src/components/InputStep.tsx +0 -431
  107. package/src/components/QuoteSelector.css +0 -146
  108. package/src/components/QuoteSelector.tsx +0 -137
  109. package/src/components/QuotesModal.css +0 -250
  110. package/src/components/QuotesModal.tsx +0 -182
  111. package/src/components/SettingsModal.css +0 -145
  112. package/src/components/SettingsModal.tsx +0 -180
  113. package/src/components/StatusStep.tsx +0 -139
  114. package/src/components/SwapWidget.css +0 -713
  115. package/src/components/SwapWidget.tsx +0 -607
  116. package/src/components/TokenSelectModal.css +0 -438
  117. package/src/components/TokenSelectModal.tsx +0 -487
  118. package/src/components/WalletProvider.tsx +0 -92
  119. package/src/config/appkit.ts +0 -104
  120. package/src/config/wagmi.ts +0 -27
  121. package/src/constants/chains.ts +0 -72
  122. package/src/constants/defaults.ts +0 -28
  123. package/src/constants/swappers.ts +0 -48
  124. package/src/constants/viemChains.ts +0 -69
  125. package/src/contexts/SwapWalletContext.tsx +0 -25
  126. package/src/demo/App.css +0 -458
  127. package/src/demo/App.tsx +0 -481
  128. package/src/demo/main.tsx +0 -25
  129. package/src/hooks/useAssets.ts +0 -180
  130. package/src/hooks/useBalances.ts +0 -822
  131. package/src/hooks/useBitcoinSigning.ts +0 -276
  132. package/src/hooks/useMarketData.ts +0 -169
  133. package/src/hooks/useSolanaSigning.ts +0 -275
  134. package/src/hooks/useStatusPolling.ts +0 -137
  135. package/src/hooks/useSwapApproval.ts +0 -106
  136. package/src/hooks/useSwapDisplayValues.ts +0 -157
  137. package/src/hooks/useSwapExecution.ts +0 -199
  138. package/src/hooks/useSwapHandlers.ts +0 -119
  139. package/src/hooks/useSwapQuote.ts +0 -71
  140. package/src/hooks/useSwapQuoting.ts +0 -102
  141. package/src/hooks/useSwapRates.ts +0 -61
  142. package/src/index.ts +0 -43
  143. package/src/machines/SwapMachineContext.ts +0 -5
  144. package/src/machines/__tests__/guards.test.ts +0 -228
  145. package/src/machines/__tests__/setup.test.ts +0 -7
  146. package/src/machines/__tests__/swapMachine.test.ts +0 -544
  147. package/src/machines/__tests__/types.test.ts +0 -124
  148. package/src/machines/guards.ts +0 -33
  149. package/src/machines/swapMachine.ts +0 -288
  150. package/src/machines/types.ts +0 -54
  151. package/src/services/transactionStatus.ts +0 -322
  152. package/src/types/index.ts +0 -361
  153. package/src/utils/addressValidation.ts +0 -201
  154. package/src/utils/redirect.ts +0 -45
  155. package/src/vite-env.d.ts +0 -10
  156. package/tsconfig.json +0 -23
  157. package/tsconfig.node.json +0 -10
  158. package/vite.config.ts +0 -101
  159. package/vitest.config.ts +0 -18
@@ -1,891 +0,0 @@
1
- import{as as k,aP as le,R as c,C as pe,y as v,z as V,G as f,I as g,J as d,F as l,aG as me,A as H,a4 as u,D as fe,k as w,a3 as I,L as B,a1 as U,aL as we,aA as F,E as K,af as A,u as M,O as be,S as E,aw as z,aI as oe,a2 as ge,U as ce,aQ as ye,aR as ve}from"./index-5jd8RPN9.js";import{P as D}from"./index-B4kNtSTk.js";import{S as xe}from"./SwapController-If0bFrNc.js";const de={isUnsupportedChainView(){return c.state.view==="UnsupportedChain"||c.state.view==="SwitchNetwork"&&c.state.history.includes("UnsupportedChain")},async safeClose(){if(this.isUnsupportedChainView()){k.shake();return}if(await le.isSIWXCloseDisabled()){k.shake();return}(c.state.view==="DataCapture"||c.state.view==="DataCaptureOtpConfirm")&&pe.disconnect(),k.close()}},ke=v`
2
- :host {
3
- display: block;
4
- border-radius: clamp(0px, ${({borderRadius:e})=>e[8]}, 44px);
5
- box-shadow: 0 0 0 1px ${({tokens:e})=>e.theme.foregroundPrimary};
6
- overflow: hidden;
7
- }
8
- `;var $e=function(e,t,i,r){var a=arguments.length,o=a<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,i):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,i,r);else for(var s=e.length-1;s>=0;s--)(n=e[s])&&(o=(a<3?n(o):a>3?n(t,i,o):n(t,i))||o);return a>3&&o&&Object.defineProperty(t,i,o),o};let X=class extends g{render(){return d`<slot></slot>`}};X.styles=[V,ke];X=$e([f("wui-card")],X);const Ce=v`
9
- :host {
10
- width: 100%;
11
- }
12
-
13
- :host > wui-flex {
14
- width: 100%;
15
- display: flex;
16
- align-items: center;
17
- justify-content: center;
18
- gap: ${({spacing:e})=>e[2]};
19
- padding: ${({spacing:e})=>e[3]};
20
- border-radius: ${({borderRadius:e})=>e[6]};
21
- border: 1px solid ${({tokens:e})=>e.theme.borderPrimary};
22
- box-sizing: border-box;
23
- background-color: ${({tokens:e})=>e.theme.foregroundPrimary};
24
- box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.25);
25
- color: ${({tokens:e})=>e.theme.textPrimary};
26
- }
27
-
28
- :host > wui-flex[data-type='info'] {
29
- .icon-box {
30
- background-color: ${({tokens:e})=>e.theme.foregroundSecondary};
31
-
32
- wui-icon {
33
- color: ${({tokens:e})=>e.theme.iconDefault};
34
- }
35
- }
36
- }
37
- :host > wui-flex[data-type='success'] {
38
- .icon-box {
39
- background-color: ${({tokens:e})=>e.core.backgroundSuccess};
40
-
41
- wui-icon {
42
- color: ${({tokens:e})=>e.core.borderSuccess};
43
- }
44
- }
45
- }
46
- :host > wui-flex[data-type='warning'] {
47
- .icon-box {
48
- background-color: ${({tokens:e})=>e.core.backgroundWarning};
49
-
50
- wui-icon {
51
- color: ${({tokens:e})=>e.core.borderWarning};
52
- }
53
- }
54
- }
55
- :host > wui-flex[data-type='error'] {
56
- .icon-box {
57
- background-color: ${({tokens:e})=>e.core.backgroundError};
58
-
59
- wui-icon {
60
- color: ${({tokens:e})=>e.core.borderError};
61
- }
62
- }
63
- }
64
-
65
- wui-flex {
66
- width: 100%;
67
- }
68
-
69
- wui-text {
70
- word-break: break-word;
71
- flex: 1;
72
- }
73
-
74
- .close {
75
- cursor: pointer;
76
- color: ${({tokens:e})=>e.theme.iconDefault};
77
- }
78
-
79
- .icon-box {
80
- height: 40px;
81
- width: 40px;
82
- border-radius: ${({borderRadius:e})=>e[2]};
83
- background-color: var(--local-icon-bg-value);
84
- }
85
- `;var G=function(e,t,i,r){var a=arguments.length,o=a<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,i):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,i,r);else for(var s=e.length-1;s>=0;s--)(n=e[s])&&(o=(a<3?n(o):a>3?n(t,i,o):n(t,i))||o);return a>3&&o&&Object.defineProperty(t,i,o),o};const Se={info:"info",success:"checkmark",warning:"warningCircle",error:"warning"};let N=class extends g{constructor(){super(...arguments),this.message="",this.type="info"}render(){return d`
86
- <wui-flex
87
- data-type=${me(this.type)}
88
- flexDirection="row"
89
- justifyContent="space-between"
90
- alignItems="center"
91
- gap="2"
92
- >
93
- <wui-flex columnGap="2" flexDirection="row" alignItems="center">
94
- <wui-flex
95
- flexDirection="row"
96
- alignItems="center"
97
- justifyContent="center"
98
- class="icon-box"
99
- >
100
- <wui-icon color="inherit" size="md" name=${Se[this.type]}></wui-icon>
101
- </wui-flex>
102
- <wui-text variant="md-medium" color="inherit" data-testid="wui-alertbar-text"
103
- >${this.message}</wui-text
104
- >
105
- </wui-flex>
106
- <wui-icon
107
- class="close"
108
- color="inherit"
109
- size="sm"
110
- name="close"
111
- @click=${this.onClose}
112
- ></wui-icon>
113
- </wui-flex>
114
- `}onClose(){H.close()}};N.styles=[V,Ce];G([l()],N.prototype,"message",void 0);G([l()],N.prototype,"type",void 0);N=G([f("wui-alertbar")],N);const Ie=v`
115
- :host {
116
- display: block;
117
- position: absolute;
118
- top: ${({spacing:e})=>e[3]};
119
- left: ${({spacing:e})=>e[4]};
120
- right: ${({spacing:e})=>e[4]};
121
- opacity: 0;
122
- pointer-events: none;
123
- }
124
- `;var ue=function(e,t,i,r){var a=arguments.length,o=a<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,i):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,i,r);else for(var s=e.length-1;s>=0;s--)(n=e[s])&&(o=(a<3?n(o):a>3?n(t,i,o):n(t,i))||o);return a>3&&o&&Object.defineProperty(t,i,o),o};const We={info:{backgroundColor:"fg-350",iconColor:"fg-325",icon:"info"},success:{backgroundColor:"success-glass-reown-020",iconColor:"success-125",icon:"checkmark"},warning:{backgroundColor:"warning-glass-reown-020",iconColor:"warning-100",icon:"warningCircle"},error:{backgroundColor:"error-glass-reown-020",iconColor:"error-125",icon:"warning"}};let L=class extends g{constructor(){super(),this.unsubscribe=[],this.open=H.state.open,this.onOpen(!0),this.unsubscribe.push(H.subscribeKey("open",t=>{this.open=t,this.onOpen(!1)}))}disconnectedCallback(){this.unsubscribe.forEach(t=>t())}render(){const{message:t,variant:i}=H.state,r=We[i];return d`
125
- <wui-alertbar
126
- message=${t}
127
- backgroundColor=${r==null?void 0:r.backgroundColor}
128
- iconColor=${r==null?void 0:r.iconColor}
129
- icon=${r==null?void 0:r.icon}
130
- type=${i}
131
- ></wui-alertbar>
132
- `}onOpen(t){this.open?(this.animate([{opacity:0,transform:"scale(0.85)"},{opacity:1,transform:"scale(1)"}],{duration:150,fill:"forwards",easing:"ease"}),this.style.cssText="pointer-events: auto"):t||(this.animate([{opacity:1,transform:"scale(1)"},{opacity:0,transform:"scale(0.85)"}],{duration:150,fill:"forwards",easing:"ease"}),this.style.cssText="pointer-events: none")}};L.styles=Ie;ue([u()],L.prototype,"open",void 0);L=ue([f("w3m-alertbar")],L);const Re=v`
133
- button {
134
- display: block;
135
- display: flex;
136
- align-items: center;
137
- padding: ${({spacing:e})=>e[1]};
138
- transition: background-color ${({durations:e})=>e.lg}
139
- ${({easings:e})=>e["ease-out-power-2"]};
140
- will-change: background-color;
141
- border-radius: ${({borderRadius:e})=>e[32]};
142
- }
143
-
144
- wui-image {
145
- border-radius: 100%;
146
- }
147
-
148
- wui-text {
149
- padding-left: ${({spacing:e})=>e[1]};
150
- }
151
-
152
- .left-icon-container,
153
- .right-icon-container {
154
- width: 24px;
155
- height: 24px;
156
- justify-content: center;
157
- align-items: center;
158
- }
159
-
160
- wui-icon {
161
- color: ${({tokens:e})=>e.theme.iconDefault};
162
- }
163
-
164
- /* -- Sizes --------------------------------------------------- */
165
- button[data-size='lg'] {
166
- height: 32px;
167
- }
168
-
169
- button[data-size='md'] {
170
- height: 28px;
171
- }
172
-
173
- button[data-size='sm'] {
174
- height: 24px;
175
- }
176
-
177
- button[data-size='lg'] wui-image {
178
- width: 24px;
179
- height: 24px;
180
- }
181
-
182
- button[data-size='md'] wui-image {
183
- width: 20px;
184
- height: 20px;
185
- }
186
-
187
- button[data-size='sm'] wui-image {
188
- width: 16px;
189
- height: 16px;
190
- }
191
-
192
- button[data-size='lg'] .left-icon-container {
193
- width: 24px;
194
- height: 24px;
195
- }
196
-
197
- button[data-size='md'] .left-icon-container {
198
- width: 20px;
199
- height: 20px;
200
- }
201
-
202
- button[data-size='sm'] .left-icon-container {
203
- width: 16px;
204
- height: 16px;
205
- }
206
-
207
- /* -- Variants --------------------------------------------------------- */
208
- button[data-type='filled-dropdown'] {
209
- background-color: ${({tokens:e})=>e.theme.foregroundPrimary};
210
- }
211
-
212
- button[data-type='text-dropdown'] {
213
- background-color: transparent;
214
- }
215
-
216
- /* -- Focus states --------------------------------------------------- */
217
- button:focus-visible:enabled {
218
- background-color: ${({tokens:e})=>e.theme.foregroundSecondary};
219
- box-shadow: 0 0 0 4px ${({tokens:e})=>e.core.foregroundAccent040};
220
- }
221
-
222
- /* -- Hover & Active states ----------------------------------------------------------- */
223
- @media (hover: hover) and (pointer: fine) {
224
- button:hover:enabled,
225
- button:active:enabled {
226
- background-color: ${({tokens:e})=>e.theme.foregroundSecondary};
227
- }
228
- }
229
-
230
- /* -- Disabled states --------------------------------------------------- */
231
- button:disabled {
232
- background-color: ${({tokens:e})=>e.theme.foregroundSecondary};
233
- opacity: 0.5;
234
- }
235
- `;var P=function(e,t,i,r){var a=arguments.length,o=a<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,i):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,i,r);else for(var s=e.length-1;s>=0;s--)(n=e[s])&&(o=(a<3?n(o):a>3?n(t,i,o):n(t,i))||o);return a>3&&o&&Object.defineProperty(t,i,o),o};const Ae={lg:"lg-regular",md:"md-regular",sm:"sm-regular"},Ee={lg:"lg",md:"md",sm:"sm"};let W=class extends g{constructor(){super(...arguments),this.imageSrc="",this.text="",this.size="lg",this.type="text-dropdown",this.disabled=!1}render(){return d`<button ?disabled=${this.disabled} data-size=${this.size} data-type=${this.type}>
236
- ${this.imageTemplate()} ${this.textTemplate()}
237
- <wui-flex class="right-icon-container">
238
- <wui-icon name="chevronBottom"></wui-icon>
239
- </wui-flex>
240
- </button>`}textTemplate(){const t=Ae[this.size];return this.text?d`<wui-text color="primary" variant=${t}>${this.text}</wui-text>`:null}imageTemplate(){if(this.imageSrc)return d`<wui-image src=${this.imageSrc} alt="select visual"></wui-image>`;const t=Ee[this.size];return d` <wui-flex class="left-icon-container">
241
- <wui-icon size=${t} name="networkPlaceholder"></wui-icon>
242
- </wui-flex>`}};W.styles=[V,fe,Re];P([l()],W.prototype,"imageSrc",void 0);P([l()],W.prototype,"text",void 0);P([l()],W.prototype,"size",void 0);P([l()],W.prototype,"type",void 0);P([l({type:Boolean})],W.prototype,"disabled",void 0);W=P([f("wui-select")],W);const Pe=v`
243
- wui-image {
244
- border-radius: ${({borderRadius:e})=>e.round};
245
- }
246
-
247
- .transfers-badge {
248
- background-color: ${({tokens:e})=>e.theme.foregroundPrimary};
249
- border: 1px solid ${({tokens:e})=>e.theme.foregroundSecondary};
250
- border-radius: ${({borderRadius:e})=>e[4]};
251
- }
252
- `;var q=function(e,t,i,r){var a=arguments.length,o=a<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,i):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,i,r);else for(var s=e.length-1;s>=0;s--)(n=e[s])&&(o=(a<3?n(o):a>3?n(t,i,o):n(t,i))||o);return a>3&&o&&Object.defineProperty(t,i,o),o};let T=class extends g{constructor(){super(),this.unsubscribe=[],this.paymentAsset=D.state.paymentAsset,this.amount=D.state.amount,this.unsubscribe.push(D.subscribeKey("paymentAsset",t=>{this.paymentAsset=t}),D.subscribeKey("amount",t=>{this.amount=t}))}disconnectedCallback(){this.unsubscribe.forEach(t=>t())}render(){const i=w.getAllRequestedCaipNetworks().find(r=>r.caipNetworkId===this.paymentAsset.network);return d`<wui-flex
253
- alignItems="center"
254
- gap="1"
255
- .padding=${["1","2","1","1"]}
256
- class="transfers-badge"
257
- >
258
- <wui-image src=${I(this.paymentAsset.metadata.logoURI)} size="xl"></wui-image>
259
- <wui-text variant="lg-regular" color="primary">
260
- ${this.amount} ${this.paymentAsset.metadata.symbol}
261
- </wui-text>
262
- <wui-text variant="sm-regular" color="secondary">
263
- on ${(i==null?void 0:i.name)??"Unknown"}
264
- </wui-text>
265
- </wui-flex>`}};T.styles=[Pe];q([l()],T.prototype,"paymentAsset",void 0);q([l()],T.prototype,"amount",void 0);T=q([f("w3m-pay-header")],T);const Oe=v`
266
- :host {
267
- height: 60px;
268
- }
269
-
270
- :host > wui-flex {
271
- box-sizing: border-box;
272
- background-color: var(--local-header-background-color);
273
- }
274
-
275
- wui-text {
276
- background-color: var(--local-header-background-color);
277
- }
278
-
279
- wui-flex.w3m-header-title {
280
- transform: translateY(0);
281
- opacity: 1;
282
- }
283
-
284
- wui-flex.w3m-header-title[view-direction='prev'] {
285
- animation:
286
- slide-down-out 120ms forwards ${({easings:e})=>e["ease-out-power-2"]},
287
- slide-down-in 120ms forwards ${({easings:e})=>e["ease-out-power-2"]};
288
- animation-delay: 0ms, 200ms;
289
- }
290
-
291
- wui-flex.w3m-header-title[view-direction='next'] {
292
- animation:
293
- slide-up-out 120ms forwards ${({easings:e})=>e["ease-out-power-2"]},
294
- slide-up-in 120ms forwards ${({easings:e})=>e["ease-out-power-2"]};
295
- animation-delay: 0ms, 200ms;
296
- }
297
-
298
- wui-icon-button[data-hidden='true'] {
299
- opacity: 0 !important;
300
- pointer-events: none;
301
- }
302
-
303
- @keyframes slide-up-out {
304
- from {
305
- transform: translateY(0px);
306
- opacity: 1;
307
- }
308
- to {
309
- transform: translateY(3px);
310
- opacity: 0;
311
- }
312
- }
313
-
314
- @keyframes slide-up-in {
315
- from {
316
- transform: translateY(-3px);
317
- opacity: 0;
318
- }
319
- to {
320
- transform: translateY(0);
321
- opacity: 1;
322
- }
323
- }
324
-
325
- @keyframes slide-down-out {
326
- from {
327
- transform: translateY(0px);
328
- opacity: 1;
329
- }
330
- to {
331
- transform: translateY(-3px);
332
- opacity: 0;
333
- }
334
- }
335
-
336
- @keyframes slide-down-in {
337
- from {
338
- transform: translateY(3px);
339
- opacity: 0;
340
- }
341
- to {
342
- transform: translateY(0);
343
- opacity: 1;
344
- }
345
- }
346
- `;var R=function(e,t,i,r){var a=arguments.length,o=a<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,i):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,i,r);else for(var s=e.length-1;s>=0;s--)(n=e[s])&&(o=(a<3?n(o):a>3?n(t,i,o):n(t,i))||o);return a>3&&o&&Object.defineProperty(t,i,o),o};const Ne=["SmartSessionList"],Te={PayWithExchange:B.tokens.theme.foregroundPrimary};function re(){var m,y,O,Z,J,ee,te,ie;const e=(y=(m=c.state.data)==null?void 0:m.connector)==null?void 0:y.name,t=(Z=(O=c.state.data)==null?void 0:O.wallet)==null?void 0:Z.name,i=(ee=(J=c.state.data)==null?void 0:J.network)==null?void 0:ee.name,r=t??e,a=M.getConnectors(),o=a.length===1&&((te=a[0])==null?void 0:te.id)==="w3m-email",n=(ie=w.getAccountData())==null?void 0:ie.socialProvider,s=n?n.charAt(0).toUpperCase()+n.slice(1):"Connect Social";return{Connect:`Connect ${o?"Email":""} Wallet`,Create:"Create Wallet",ChooseAccountName:void 0,Account:void 0,AccountSettings:void 0,AllWallets:"All Wallets",ApproveTransaction:"Approve Transaction",BuyInProgress:"Buy",UsageExceeded:"Usage Exceeded",ConnectingExternal:r??"Connect Wallet",ConnectingWalletConnect:r??"WalletConnect",ConnectingWalletConnectBasic:"WalletConnect",ConnectingSiwe:"Sign In",Convert:"Convert",ConvertSelectToken:"Select token",ConvertPreview:"Preview Convert",Downloads:r?`Get ${r}`:"Downloads",EmailLogin:"Email Login",EmailVerifyOtp:"Confirm Email",EmailVerifyDevice:"Register Device",GetWallet:"Get a Wallet",Networks:"Choose Network",OnRampProviders:"Choose Provider",OnRampActivity:"Activity",OnRampTokenSelect:"Select Token",OnRampFiatSelect:"Select Currency",Pay:"How you pay",ProfileWallets:"Wallets",SwitchNetwork:i??"Switch Network",Transactions:"Activity",UnsupportedChain:"Switch Network",UpgradeEmailWallet:"Upgrade Your Wallet",UpdateEmailWallet:"Edit Email",UpdateEmailPrimaryOtp:"Confirm Current Email",UpdateEmailSecondaryOtp:"Confirm New Email",WhatIsABuy:"What is Buy?",RegisterAccountName:"Choose Name",RegisterAccountNameSuccess:"",WalletReceive:"Receive",WalletCompatibleNetworks:"Compatible Networks",Swap:"Swap",SwapSelectToken:"Select Token",SwapPreview:"Preview Swap",WalletSend:"Send",WalletSendPreview:"Review Send",WalletSendSelectToken:"Select Token",WalletSendConfirmed:"Confirmed",WhatIsANetwork:"What is a network?",WhatIsAWallet:"What is a Wallet?",ConnectWallets:"Connect Wallet",ConnectSocials:"All Socials",ConnectingSocial:s,ConnectingMultiChain:"Select Chain",ConnectingFarcaster:"Farcaster",SwitchActiveChain:"Switch Chain",SmartSessionCreated:void 0,SmartSessionList:"Smart Sessions",SIWXSignMessage:"Sign In",PayLoading:"Processing payment...",PayQuote:"Payment Quote",DataCapture:"Profile",DataCaptureOtpConfirm:"Confirm Email",FundWallet:"Fund Wallet",PayWithExchange:"Deposit from Exchange",PayWithExchangeSelectAsset:"Select Asset",SmartAccountSettings:"Smart Account Settings"}}let $=class extends g{constructor(){super(),this.unsubscribe=[],this.heading=re()[c.state.view],this.network=w.state.activeCaipNetwork,this.networkImage=U.getNetworkImage(this.network),this.showBack=!1,this.prevHistoryLength=1,this.view=c.state.view,this.viewDirection="",this.unsubscribe.push(we.subscribeNetworkImages(()=>{this.networkImage=U.getNetworkImage(this.network)}),c.subscribeKey("view",t=>{setTimeout(()=>{this.view=t,this.heading=re()[t]},F.ANIMATION_DURATIONS.HeaderText),this.onViewChange(),this.onHistoryChange()}),w.subscribeKey("activeCaipNetwork",t=>{this.network=t,this.networkImage=U.getNetworkImage(this.network)}))}disconnectCallback(){this.unsubscribe.forEach(t=>t())}render(){const t=Te[c.state.view]??B.tokens.theme.backgroundPrimary;return this.style.setProperty("--local-header-background-color",t),d`
347
- <wui-flex
348
- .padding=${["0","4","0","4"]}
349
- justifyContent="space-between"
350
- alignItems="center"
351
- >
352
- ${this.leftHeaderTemplate()} ${this.titleTemplate()} ${this.rightHeaderTemplate()}
353
- </wui-flex>
354
- `}onWalletHelp(){K.sendEvent({type:"track",event:"CLICK_WALLET_HELP"}),c.push("WhatIsAWallet")}async onClose(){await de.safeClose()}rightHeaderTemplate(){var i,r,a;const t=(a=(r=(i=A)==null?void 0:i.state)==null?void 0:r.features)==null?void 0:a.smartSessions;return c.state.view!=="Account"||!t?this.closeButtonTemplate():d`<wui-flex>
355
- <wui-icon-button
356
- icon="clock"
357
- size="lg"
358
- iconSize="lg"
359
- type="neutral"
360
- variant="primary"
361
- @click=${()=>c.push("SmartSessionList")}
362
- data-testid="w3m-header-smart-sessions"
363
- ></wui-icon-button>
364
- ${this.closeButtonTemplate()}
365
- </wui-flex> `}closeButtonTemplate(){return d`
366
- <wui-icon-button
367
- icon="close"
368
- size="lg"
369
- type="neutral"
370
- variant="primary"
371
- iconSize="lg"
372
- @click=${this.onClose.bind(this)}
373
- data-testid="w3m-header-close"
374
- ></wui-icon-button>
375
- `}titleTemplate(){if(this.view==="PayQuote")return d`<w3m-pay-header></w3m-pay-header>`;const t=Ne.includes(this.view);return d`
376
- <wui-flex
377
- view-direction="${this.viewDirection}"
378
- class="w3m-header-title"
379
- alignItems="center"
380
- gap="2"
381
- >
382
- <wui-text
383
- display="inline"
384
- variant="lg-regular"
385
- color="primary"
386
- data-testid="w3m-header-text"
387
- >
388
- ${this.heading}
389
- </wui-text>
390
- ${t?d`<wui-tag variant="accent" size="md">Beta</wui-tag>`:null}
391
- </wui-flex>
392
- `}leftHeaderTemplate(){var y;const{view:t}=c.state,i=t==="Connect",r=A.state.enableEmbedded,a=t==="ApproveTransaction",o=t==="ConnectingSiwe",n=t==="Account",s=A.state.enableNetworkSwitch,m=a||o||i&&r;return n&&s?d`<wui-select
393
- id="dynamic"
394
- data-testid="w3m-account-select-network"
395
- active-network=${I((y=this.network)==null?void 0:y.name)}
396
- @click=${this.onNetworks.bind(this)}
397
- imageSrc=${I(this.networkImage)}
398
- ></wui-select>`:this.showBack&&!m?d`<wui-icon-button
399
- data-testid="header-back"
400
- id="dynamic"
401
- icon="chevronLeft"
402
- size="lg"
403
- iconSize="lg"
404
- type="neutral"
405
- variant="primary"
406
- @click=${this.onGoBack.bind(this)}
407
- ></wui-icon-button>`:d`<wui-icon-button
408
- data-hidden=${!i}
409
- id="dynamic"
410
- icon="helpCircle"
411
- size="lg"
412
- iconSize="lg"
413
- type="neutral"
414
- variant="primary"
415
- @click=${this.onWalletHelp.bind(this)}
416
- ></wui-icon-button>`}onNetworks(){this.isAllowedNetworkSwitch()&&(K.sendEvent({type:"track",event:"CLICK_NETWORKS"}),c.push("Networks"))}isAllowedNetworkSwitch(){const t=w.getAllRequestedCaipNetworks(),i=t?t.length>1:!1,r=t==null?void 0:t.find(({id:a})=>{var o;return a===((o=this.network)==null?void 0:o.id)});return i||!r}onViewChange(){const{history:t}=c.state;let i=F.VIEW_DIRECTION.Next;t.length<this.prevHistoryLength&&(i=F.VIEW_DIRECTION.Prev),this.prevHistoryLength=t.length,this.viewDirection=i}async onHistoryChange(){var r;const{history:t}=c.state,i=(r=this.shadowRoot)==null?void 0:r.querySelector("#dynamic");t.length>1&&!this.showBack&&i?(await i.animate([{opacity:1},{opacity:0}],{duration:200,fill:"forwards",easing:"ease"}).finished,this.showBack=!0,i.animate([{opacity:0},{opacity:1}],{duration:200,fill:"forwards",easing:"ease"})):t.length<=1&&this.showBack&&i&&(await i.animate([{opacity:1},{opacity:0}],{duration:200,fill:"forwards",easing:"ease"}).finished,this.showBack=!1,i.animate([{opacity:0},{opacity:1}],{duration:200,fill:"forwards",easing:"ease"}))}onGoBack(){c.goBack()}};$.styles=Oe;R([u()],$.prototype,"heading",void 0);R([u()],$.prototype,"network",void 0);R([u()],$.prototype,"networkImage",void 0);R([u()],$.prototype,"showBack",void 0);R([u()],$.prototype,"prevHistoryLength",void 0);R([u()],$.prototype,"view",void 0);R([u()],$.prototype,"viewDirection",void 0);$=R([f("w3m-header")],$);const _e=v`
417
- :host {
418
- display: flex;
419
- align-items: center;
420
- gap: ${({spacing:e})=>e[1]};
421
- padding: ${({spacing:e})=>e[2]} ${({spacing:e})=>e[3]}
422
- ${({spacing:e})=>e[2]} ${({spacing:e})=>e[2]};
423
- border-radius: ${({borderRadius:e})=>e[20]};
424
- background-color: ${({tokens:e})=>e.theme.foregroundPrimary};
425
- box-shadow:
426
- 0px 0px 8px 0px rgba(0, 0, 0, 0.1),
427
- inset 0 0 0 1px ${({tokens:e})=>e.theme.borderPrimary};
428
- max-width: 320px;
429
- }
430
-
431
- wui-icon-box {
432
- border-radius: ${({borderRadius:e})=>e.round} !important;
433
- overflow: hidden;
434
- }
435
-
436
- wui-loading-spinner {
437
- padding: ${({spacing:e})=>e[1]};
438
- background-color: ${({tokens:e})=>e.core.foregroundAccent010};
439
- border-radius: ${({borderRadius:e})=>e.round} !important;
440
- }
441
- `;var Q=function(e,t,i,r){var a=arguments.length,o=a<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,i):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,i,r);else for(var s=e.length-1;s>=0;s--)(n=e[s])&&(o=(a<3?n(o):a>3?n(t,i,o):n(t,i))||o);return a>3&&o&&Object.defineProperty(t,i,o),o};let _=class extends g{constructor(){super(...arguments),this.message="",this.variant="success"}render(){return d`
442
- ${this.templateIcon()}
443
- <wui-text variant="lg-regular" color="primary" data-testid="wui-snackbar-message"
444
- >${this.message}</wui-text
445
- >
446
- `}templateIcon(){const t={success:"success",error:"error",warning:"warning",info:"default"},i={success:"checkmark",error:"warning",warning:"warningCircle",info:"info"};return this.variant==="loading"?d`<wui-loading-spinner size="md" color="accent-primary"></wui-loading-spinner>`:d`<wui-icon-box
447
- size="md"
448
- color=${t[this.variant]}
449
- icon=${i[this.variant]}
450
- ></wui-icon-box>`}};_.styles=[V,_e];Q([l()],_.prototype,"message",void 0);Q([l()],_.prototype,"variant",void 0);_=Q([f("wui-snackbar")],_);const ze=be`
451
- :host {
452
- display: block;
453
- position: absolute;
454
- opacity: 0;
455
- pointer-events: none;
456
- top: 11px;
457
- left: 50%;
458
- width: max-content;
459
- }
460
- `;var he=function(e,t,i,r){var a=arguments.length,o=a<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,i):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,i,r);else for(var s=e.length-1;s>=0;s--)(n=e[s])&&(o=(a<3?n(o):a>3?n(t,i,o):n(t,i))||o);return a>3&&o&&Object.defineProperty(t,i,o),o};let j=class extends g{constructor(){super(),this.unsubscribe=[],this.timeout=void 0,this.open=E.state.open,this.unsubscribe.push(E.subscribeKey("open",t=>{this.open=t,this.onOpen()}))}disconnectedCallback(){clearTimeout(this.timeout),this.unsubscribe.forEach(t=>t())}render(){const{message:t,variant:i}=E.state;return d` <wui-snackbar message=${t} variant=${i}></wui-snackbar> `}onOpen(){clearTimeout(this.timeout),this.open?(this.animate([{opacity:0,transform:"translateX(-50%) scale(0.85)"},{opacity:1,transform:"translateX(-50%) scale(1)"}],{duration:150,fill:"forwards",easing:"ease"}),this.timeout&&clearTimeout(this.timeout),E.state.autoClose&&(this.timeout=setTimeout(()=>E.hide(),2500))):this.animate([{opacity:1,transform:"translateX(-50%) scale(1)"},{opacity:0,transform:"translateX(-50%) scale(0.85)"}],{duration:150,fill:"forwards",easing:"ease"})}};j.styles=ze;he([u()],j.prototype,"open",void 0);j=he([f("w3m-snackbar")],j);const De=v`
461
- :host {
462
- z-index: ${({tokens:e})=>e.core.zIndex};
463
- display: block;
464
- backface-visibility: hidden;
465
- will-change: opacity;
466
- position: fixed;
467
- top: 0;
468
- left: 0;
469
- right: 0;
470
- bottom: 0;
471
- pointer-events: none;
472
- opacity: 0;
473
- background-color: ${({tokens:e})=>e.theme.overlay};
474
- backdrop-filter: blur(0px);
475
- transition:
476
- opacity ${({durations:e})=>e.lg} ${({easings:e})=>e["ease-out-power-2"]},
477
- backdrop-filter ${({durations:e})=>e.lg}
478
- ${({easings:e})=>e["ease-out-power-2"]};
479
- will-change: opacity;
480
- }
481
-
482
- :host(.open) {
483
- opacity: 1;
484
- backdrop-filter: blur(8px);
485
- }
486
-
487
- :host(.appkit-modal) {
488
- position: relative;
489
- pointer-events: unset;
490
- background: none;
491
- width: 100%;
492
- opacity: 1;
493
- }
494
-
495
- wui-card {
496
- max-width: var(--apkt-modal-width);
497
- width: 100%;
498
- position: relative;
499
- outline: none;
500
- transform: translateY(4px);
501
- box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.05);
502
- transition:
503
- transform ${({durations:e})=>e.lg}
504
- ${({easings:e})=>e["ease-out-power-2"]},
505
- border-radius ${({durations:e})=>e.lg}
506
- ${({easings:e})=>e["ease-out-power-1"]},
507
- background-color ${({durations:e})=>e.lg}
508
- ${({easings:e})=>e["ease-out-power-1"]},
509
- box-shadow ${({durations:e})=>e.lg}
510
- ${({easings:e})=>e["ease-out-power-1"]};
511
- will-change: border-radius, background-color, transform, box-shadow;
512
- background-color: ${({tokens:e})=>e.theme.backgroundPrimary};
513
- padding: var(--local-modal-padding);
514
- box-sizing: border-box;
515
- }
516
-
517
- :host(.open) wui-card {
518
- transform: translateY(0px);
519
- }
520
-
521
- wui-card::before {
522
- z-index: 1;
523
- pointer-events: none;
524
- content: '';
525
- position: absolute;
526
- inset: 0;
527
- border-radius: clamp(0px, var(--apkt-borderRadius-8), 44px);
528
- transition: box-shadow ${({durations:e})=>e.lg}
529
- ${({easings:e})=>e["ease-out-power-2"]};
530
- transition-delay: ${({durations:e})=>e.md};
531
- will-change: box-shadow;
532
- }
533
-
534
- :host([data-mobile-fullscreen='true']) wui-card::before {
535
- border-radius: 0px;
536
- }
537
-
538
- :host([data-border='true']) wui-card::before {
539
- box-shadow: inset 0px 0px 0px 4px ${({tokens:e})=>e.theme.foregroundSecondary};
540
- }
541
-
542
- :host([data-border='false']) wui-card::before {
543
- box-shadow: inset 0px 0px 0px 1px ${({tokens:e})=>e.theme.borderPrimaryDark};
544
- }
545
-
546
- :host([data-border='true']) wui-card {
547
- animation:
548
- fade-in ${({durations:e})=>e.lg} ${({easings:e})=>e["ease-out-power-2"]},
549
- card-background-border var(--apkt-duration-dynamic)
550
- ${({easings:e})=>e["ease-out-power-2"]};
551
- animation-fill-mode: backwards, both;
552
- animation-delay: var(--apkt-duration-dynamic);
553
- }
554
-
555
- :host([data-border='false']) wui-card {
556
- animation:
557
- fade-in ${({durations:e})=>e.lg} ${({easings:e})=>e["ease-out-power-2"]},
558
- card-background-default var(--apkt-duration-dynamic)
559
- ${({easings:e})=>e["ease-out-power-2"]};
560
- animation-fill-mode: backwards, both;
561
- animation-delay: 0s;
562
- }
563
-
564
- :host(.appkit-modal) wui-card {
565
- max-width: var(--apkt-modal-width);
566
- }
567
-
568
- wui-card[shake='true'] {
569
- animation:
570
- fade-in ${({durations:e})=>e.lg} ${({easings:e})=>e["ease-out-power-2"]},
571
- w3m-shake ${({durations:e})=>e.xl}
572
- ${({easings:e})=>e["ease-out-power-2"]};
573
- }
574
-
575
- wui-flex {
576
- overflow-x: hidden;
577
- overflow-y: auto;
578
- display: flex;
579
- align-items: center;
580
- justify-content: center;
581
- width: 100%;
582
- height: 100%;
583
- }
584
-
585
- @media (max-height: 700px) and (min-width: 431px) {
586
- wui-flex {
587
- align-items: flex-start;
588
- }
589
-
590
- wui-card {
591
- margin: var(--apkt-spacing-6) 0px;
592
- }
593
- }
594
-
595
- @media (max-width: 430px) {
596
- :host([data-mobile-fullscreen='true']) {
597
- height: 100dvh;
598
- }
599
- :host([data-mobile-fullscreen='true']) wui-flex {
600
- align-items: stretch;
601
- }
602
- :host([data-mobile-fullscreen='true']) wui-card {
603
- max-width: 100%;
604
- height: 100%;
605
- border-radius: 0;
606
- border: none;
607
- }
608
- :host(:not([data-mobile-fullscreen='true'])) wui-flex {
609
- align-items: flex-end;
610
- }
611
-
612
- :host(:not([data-mobile-fullscreen='true'])) wui-card {
613
- max-width: 100%;
614
- border-bottom: none;
615
- }
616
-
617
- :host(:not([data-mobile-fullscreen='true'])) wui-card[data-embedded='true'] {
618
- border-bottom-left-radius: clamp(0px, var(--apkt-borderRadius-8), 44px);
619
- border-bottom-right-radius: clamp(0px, var(--apkt-borderRadius-8), 44px);
620
- }
621
-
622
- :host(:not([data-mobile-fullscreen='true'])) wui-card:not([data-embedded='true']) {
623
- border-bottom-left-radius: 0px;
624
- border-bottom-right-radius: 0px;
625
- }
626
-
627
- wui-card[shake='true'] {
628
- animation: w3m-shake 0.5s ${({easings:e})=>e["ease-out-power-2"]};
629
- }
630
- }
631
-
632
- @keyframes fade-in {
633
- 0% {
634
- transform: scale(0.99) translateY(4px);
635
- }
636
- 100% {
637
- transform: scale(1) translateY(0);
638
- }
639
- }
640
-
641
- @keyframes w3m-shake {
642
- 0% {
643
- transform: scale(1) rotate(0deg);
644
- }
645
- 20% {
646
- transform: scale(1) rotate(-1deg);
647
- }
648
- 40% {
649
- transform: scale(1) rotate(1.5deg);
650
- }
651
- 60% {
652
- transform: scale(1) rotate(-1.5deg);
653
- }
654
- 80% {
655
- transform: scale(1) rotate(1deg);
656
- }
657
- 100% {
658
- transform: scale(1) rotate(0deg);
659
- }
660
- }
661
-
662
- @keyframes card-background-border {
663
- from {
664
- background-color: ${({tokens:e})=>e.theme.backgroundPrimary};
665
- }
666
- to {
667
- background-color: ${({tokens:e})=>e.theme.foregroundSecondary};
668
- }
669
- }
670
-
671
- @keyframes card-background-default {
672
- from {
673
- background-color: ${({tokens:e})=>e.theme.foregroundSecondary};
674
- }
675
- to {
676
- background-color: ${({tokens:e})=>e.theme.backgroundPrimary};
677
- }
678
- }
679
- `;var C=function(e,t,i,r){var a=arguments.length,o=a<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,i):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,i,r);else for(var s=e.length-1;s>=0;s--)(n=e[s])&&(o=(a<3?n(o):a>3?n(t,i,o):n(t,i))||o);return a>3&&o&&Object.defineProperty(t,i,o),o};const ae="scroll-lock",He={PayWithExchange:"0",PayWithExchangeSelectAsset:"0",Pay:"0",PayQuote:"0",PayLoading:"0"};class x extends g{constructor(){super(),this.unsubscribe=[],this.abortController=void 0,this.hasPrefetched=!1,this.enableEmbedded=A.state.enableEmbedded,this.open=k.state.open,this.caipAddress=w.state.activeCaipAddress,this.caipNetwork=w.state.activeCaipNetwork,this.shake=k.state.shake,this.filterByNamespace=M.state.filterByNamespace,this.padding=B.spacing[1],this.mobileFullScreen=A.state.enableMobileFullScreen,this.initializeTheming(),z.prefetchAnalyticsConfig(),this.unsubscribe.push(k.subscribeKey("open",t=>t?this.onOpen():this.onClose()),k.subscribeKey("shake",t=>this.shake=t),w.subscribeKey("activeCaipNetwork",t=>this.onNewNetwork(t)),w.subscribeKey("activeCaipAddress",t=>this.onNewAddress(t)),A.subscribeKey("enableEmbedded",t=>this.enableEmbedded=t),M.subscribeKey("filterByNamespace",t=>{var i;this.filterByNamespace!==t&&!((i=w.getAccountData(t))!=null&&i.caipAddress)&&(z.fetchRecommendedWallets(),this.filterByNamespace=t)}),c.subscribeKey("view",()=>{this.dataset.border=oe.hasFooter()?"true":"false",this.padding=He[c.state.view]??B.spacing[1]}))}firstUpdated(){if(this.dataset.border=oe.hasFooter()?"true":"false",this.mobileFullScreen&&this.setAttribute("data-mobile-fullscreen","true"),this.caipAddress){if(this.enableEmbedded){k.close(),this.prefetch();return}this.onNewAddress(this.caipAddress)}this.open&&this.onOpen(),this.enableEmbedded&&this.prefetch()}disconnectedCallback(){this.unsubscribe.forEach(t=>t()),this.onRemoveKeyboardListener()}render(){return this.style.setProperty("--local-modal-padding",this.padding),this.enableEmbedded?d`${this.contentTemplate()}
680
- <w3m-tooltip></w3m-tooltip> `:this.open?d`
681
- <wui-flex @click=${this.onOverlayClick.bind(this)} data-testid="w3m-modal-overlay">
682
- ${this.contentTemplate()}
683
- </wui-flex>
684
- <w3m-tooltip></w3m-tooltip>
685
- `:null}contentTemplate(){return d` <wui-card
686
- shake="${this.shake}"
687
- data-embedded="${I(this.enableEmbedded)}"
688
- role="alertdialog"
689
- aria-modal="true"
690
- tabindex="0"
691
- data-testid="w3m-modal-card"
692
- >
693
- <w3m-header></w3m-header>
694
- <w3m-router></w3m-router>
695
- <w3m-footer></w3m-footer>
696
- <w3m-snackbar></w3m-snackbar>
697
- <w3m-alertbar></w3m-alertbar>
698
- </wui-card>`}async onOverlayClick(t){if(t.target===t.currentTarget){if(this.mobileFullScreen)return;await this.handleClose()}}async handleClose(){await de.safeClose()}initializeTheming(){const{themeVariables:t,themeMode:i}=ge.state,r=ce.getColorTheme(i);ye(t,r)}onClose(){this.open=!1,this.classList.remove("open"),this.onScrollUnlock(),E.hide(),this.onRemoveKeyboardListener()}onOpen(){this.open=!0,this.classList.add("open"),this.onScrollLock(),this.onAddKeyboardListener()}onScrollLock(){const t=document.createElement("style");t.dataset.w3m=ae,t.textContent=`
699
- body {
700
- touch-action: none;
701
- overflow: hidden;
702
- overscroll-behavior: contain;
703
- }
704
- w3m-modal {
705
- pointer-events: auto;
706
- }
707
- `,document.head.appendChild(t)}onScrollUnlock(){const t=document.head.querySelector(`style[data-w3m="${ae}"]`);t&&t.remove()}onAddKeyboardListener(){var i;this.abortController=new AbortController;const t=(i=this.shadowRoot)==null?void 0:i.querySelector("wui-card");t==null||t.focus(),window.addEventListener("keydown",r=>{if(r.key==="Escape")this.handleClose();else if(r.key==="Tab"){const{tagName:a}=r.target;a&&!a.includes("W3M-")&&!a.includes("WUI-")&&(t==null||t.focus())}},this.abortController)}onRemoveKeyboardListener(){var t;(t=this.abortController)==null||t.abort(),this.abortController=void 0}async onNewAddress(t){const i=w.state.isSwitchingNamespace,r=c.state.view==="ProfileWallets";!t&&!i&&!r&&k.close(),await le.initializeIfEnabled(t),this.caipAddress=t,w.setIsSwitchingNamespace(!1)}onNewNetwork(t){var y,O;const i=this.caipNetwork,r=(y=i==null?void 0:i.caipNetworkId)==null?void 0:y.toString(),a=(O=t==null?void 0:t.caipNetworkId)==null?void 0:O.toString(),o=r!==a,n=c.state.view==="UnsupportedChain",s=k.state.open;let m=!1;this.enableEmbedded&&c.state.view==="SwitchNetwork"&&(m=!0),o&&xe.resetState(),s&&n&&(m=!0),m&&c.state.view!=="SIWXSignMessage"&&c.goBack(),this.caipNetwork=t}prefetch(){this.hasPrefetched||(z.prefetch(),z.fetchWalletsByPage({page:1}),this.hasPrefetched=!0)}}x.styles=De;C([l({type:Boolean})],x.prototype,"enableEmbedded",void 0);C([u()],x.prototype,"open",void 0);C([u()],x.prototype,"caipAddress",void 0);C([u()],x.prototype,"caipNetwork",void 0);C([u()],x.prototype,"shake",void 0);C([u()],x.prototype,"filterByNamespace",void 0);C([u()],x.prototype,"padding",void 0);C([u()],x.prototype,"mobileFullScreen",void 0);let ne=class extends x{};ne=C([f("w3m-modal")],ne);let se=class extends x{};se=C([f("appkit-modal")],se);const Be=v`
708
- .icon-box {
709
- width: 64px;
710
- height: 64px;
711
- border-radius: ${({borderRadius:e})=>e[5]};
712
- background-color: ${({colors:e})=>e.semanticError010};
713
- }
714
- `;var Le=function(e,t,i,r){var a=arguments.length,o=a<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,i):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,i,r);else for(var s=e.length-1;s>=0;s--)(n=e[s])&&(o=(a<3?n(o):a>3?n(t,i,o):n(t,i))||o);return a>3&&o&&Object.defineProperty(t,i,o),o};let Y=class extends g{constructor(){super()}render(){return d`
715
- <wui-flex
716
- flexDirection="column"
717
- alignItems="center"
718
- gap="4"
719
- .padding="${["1","3","4","3"]}"
720
- >
721
- <wui-flex justifyContent="center" alignItems="center" class="icon-box">
722
- <wui-icon size="xxl" color="error" name="warningCircle"></wui-icon>
723
- </wui-flex>
724
-
725
- <wui-text variant="lg-medium" color="primary" align="center">
726
- The app isn't responding as expected
727
- </wui-text>
728
- <wui-text variant="md-regular" color="secondary" align="center">
729
- Try again or reach out to the app team for help.
730
- </wui-text>
731
-
732
- <wui-button
733
- variant="neutral-secondary"
734
- size="md"
735
- @click=${this.onTryAgainClick.bind(this)}
736
- data-testid="w3m-usage-exceeded-button"
737
- >
738
- <wui-icon color="inherit" slot="iconLeft" name="refresh"></wui-icon>
739
- Try Again
740
- </wui-button>
741
- </wui-flex>
742
- `}onTryAgainClick(){c.goBack()}};Y.styles=Be;Y=Le([f("w3m-usage-exceeded-view")],Y);const je=v`
743
- :host {
744
- width: 100%;
745
- }
746
- `;var p=function(e,t,i,r){var a=arguments.length,o=a<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,i):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,i,r);else for(var s=e.length-1;s>=0;s--)(n=e[s])&&(o=(a<3?n(o):a>3?n(t,i,o):n(t,i))||o);return a>3&&o&&Object.defineProperty(t,i,o),o};let h=class extends g{constructor(){super(...arguments),this.hasImpressionSent=!1,this.walletImages=[],this.imageSrc="",this.name="",this.size="md",this.tabIdx=void 0,this.disabled=!1,this.showAllWallets=!1,this.loading=!1,this.loadingSpinnerColor="accent-100",this.rdnsId="",this.displayIndex=void 0,this.walletRank=void 0,this.namespaces=[]}connectedCallback(){super.connectedCallback()}disconnectedCallback(){super.disconnectedCallback(),this.cleanupIntersectionObserver()}updated(t){super.updated(t),(t.has("name")||t.has("imageSrc")||t.has("walletRank"))&&(this.hasImpressionSent=!1),t.has("walletRank")&&this.walletRank&&!this.intersectionObserver&&this.setupIntersectionObserver()}setupIntersectionObserver(){this.intersectionObserver=new IntersectionObserver(t=>{t.forEach(i=>{i.isIntersecting&&!this.loading&&!this.hasImpressionSent&&this.sendImpressionEvent()})},{threshold:.1}),this.intersectionObserver.observe(this)}cleanupIntersectionObserver(){this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=void 0)}sendImpressionEvent(){!this.name||this.hasImpressionSent||!this.walletRank||(this.hasImpressionSent=!0,(this.rdnsId||this.name)&&K.sendWalletImpressionEvent({name:this.name,walletRank:this.walletRank,rdnsId:this.rdnsId,view:c.state.view,displayIndex:this.displayIndex}))}handleGetWalletNamespaces(){return Object.keys(ve.state.adapters).length>1?this.namespaces:[]}render(){return d`
747
- <wui-list-wallet
748
- .walletImages=${this.walletImages}
749
- imageSrc=${I(this.imageSrc)}
750
- name=${this.name}
751
- size=${I(this.size)}
752
- tagLabel=${I(this.tagLabel)}
753
- .tagVariant=${this.tagVariant}
754
- .walletIcon=${this.walletIcon}
755
- .tabIdx=${this.tabIdx}
756
- .disabled=${this.disabled}
757
- .showAllWallets=${this.showAllWallets}
758
- .loading=${this.loading}
759
- loadingSpinnerColor=${this.loadingSpinnerColor}
760
- .namespaces=${this.handleGetWalletNamespaces()}
761
- ></wui-list-wallet>
762
- `}};h.styles=je;p([l({type:Array})],h.prototype,"walletImages",void 0);p([l()],h.prototype,"imageSrc",void 0);p([l()],h.prototype,"name",void 0);p([l()],h.prototype,"size",void 0);p([l()],h.prototype,"tagLabel",void 0);p([l()],h.prototype,"tagVariant",void 0);p([l()],h.prototype,"walletIcon",void 0);p([l()],h.prototype,"tabIdx",void 0);p([l({type:Boolean})],h.prototype,"disabled",void 0);p([l({type:Boolean})],h.prototype,"showAllWallets",void 0);p([l({type:Boolean})],h.prototype,"loading",void 0);p([l({type:String})],h.prototype,"loadingSpinnerColor",void 0);p([l()],h.prototype,"rdnsId",void 0);p([l()],h.prototype,"displayIndex",void 0);p([l()],h.prototype,"walletRank",void 0);p([l({type:Array})],h.prototype,"namespaces",void 0);h=p([f("w3m-list-wallet")],h);const Ve=v`
763
- :host {
764
- --local-duration-height: 0s;
765
- --local-duration: ${({durations:e})=>e.lg};
766
- --local-transition: ${({easings:e})=>e["ease-out-power-2"]};
767
- }
768
-
769
- .container {
770
- display: block;
771
- overflow: hidden;
772
- overflow: hidden;
773
- position: relative;
774
- height: var(--local-container-height);
775
- transition: height var(--local-duration-height) var(--local-transition);
776
- will-change: height, padding-bottom;
777
- }
778
-
779
- .container[data-mobile-fullscreen='true'] {
780
- overflow: scroll;
781
- }
782
-
783
- .page {
784
- position: absolute;
785
- top: 0;
786
- left: 0;
787
- right: 0;
788
- width: 100%;
789
- height: auto;
790
- width: inherit;
791
- box-sizing: border-box;
792
- display: flex;
793
- flex-direction: column;
794
- background-color: ${({tokens:e})=>e.theme.backgroundPrimary};
795
- border-bottom-left-radius: var(--local-border-bottom-radius);
796
- border-bottom-right-radius: var(--local-border-bottom-radius);
797
- transition: border-bottom-left-radius var(--local-duration) var(--local-transition);
798
- }
799
-
800
- .page[data-mobile-fullscreen='true'] {
801
- height: 100%;
802
- }
803
-
804
- .page-content {
805
- display: flex;
806
- flex-direction: column;
807
- min-height: 100%;
808
- }
809
-
810
- .footer {
811
- height: var(--apkt-footer-height);
812
- }
813
-
814
- div.page[view-direction^='prev-'] .page-content {
815
- animation:
816
- slide-left-out var(--local-duration) forwards var(--local-transition),
817
- slide-left-in var(--local-duration) forwards var(--local-transition);
818
- animation-delay: 0ms, var(--local-duration, ${({durations:e})=>e.lg});
819
- }
820
-
821
- div.page[view-direction^='next-'] .page-content {
822
- animation:
823
- slide-right-out var(--local-duration) forwards var(--local-transition),
824
- slide-right-in var(--local-duration) forwards var(--local-transition);
825
- animation-delay: 0ms, var(--local-duration, ${({durations:e})=>e.lg});
826
- }
827
-
828
- @keyframes slide-left-out {
829
- from {
830
- transform: translateX(0px) scale(1);
831
- opacity: 1;
832
- filter: blur(0px);
833
- }
834
- to {
835
- transform: translateX(8px) scale(0.99);
836
- opacity: 0;
837
- filter: blur(4px);
838
- }
839
- }
840
-
841
- @keyframes slide-left-in {
842
- from {
843
- transform: translateX(-8px) scale(0.99);
844
- opacity: 0;
845
- filter: blur(4px);
846
- }
847
- to {
848
- transform: translateX(0) translateY(0) scale(1);
849
- opacity: 1;
850
- filter: blur(0px);
851
- }
852
- }
853
-
854
- @keyframes slide-right-out {
855
- from {
856
- transform: translateX(0px) scale(1);
857
- opacity: 1;
858
- filter: blur(0px);
859
- }
860
- to {
861
- transform: translateX(-8px) scale(0.99);
862
- opacity: 0;
863
- filter: blur(4px);
864
- }
865
- }
866
-
867
- @keyframes slide-right-in {
868
- from {
869
- transform: translateX(8px) scale(0.99);
870
- opacity: 0;
871
- filter: blur(4px);
872
- }
873
- to {
874
- transform: translateX(0) translateY(0) scale(1);
875
- opacity: 1;
876
- filter: blur(0px);
877
- }
878
- }
879
- `;var S=function(e,t,i,r){var a=arguments.length,o=a<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,i):r,n;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")o=Reflect.decorate(e,t,i,r);else for(var s=e.length-1;s>=0;s--)(n=e[s])&&(o=(a<3?n(o):a>3?n(t,i,o):n(t,i))||o);return a>3&&o&&Object.defineProperty(t,i,o),o};const Ue=60;let b=class extends g{constructor(){super(...arguments),this.resizeObserver=void 0,this.transitionDuration="0.15s",this.transitionFunction="",this.history="",this.view="",this.setView=void 0,this.viewDirection="",this.historyState="",this.previousHeight="0px",this.mobileFullScreen=A.state.enableMobileFullScreen,this.onViewportResize=()=>{this.updateContainerHeight()}}updated(t){if(t.has("history")){const i=this.history;this.historyState!==""&&this.historyState!==i&&this.onViewChange(i)}t.has("transitionDuration")&&this.style.setProperty("--local-duration",this.transitionDuration),t.has("transitionFunction")&&this.style.setProperty("--local-transition",this.transitionFunction)}firstUpdated(){var t;this.transitionFunction&&this.style.setProperty("--local-transition",this.transitionFunction),this.style.setProperty("--local-duration",this.transitionDuration),this.historyState=this.history,this.resizeObserver=new ResizeObserver(i=>{var r;for(const a of i)if(a.target===this.getWrapper()){let o=a.contentRect.height;const n=parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--apkt-footer-height")||"0");if(this.mobileFullScreen){const s=((r=window.visualViewport)==null?void 0:r.height)||window.innerHeight,m=this.getHeaderHeight();o=s-m-n,this.style.setProperty("--local-border-bottom-radius","0px")}else o=o+n,this.style.setProperty("--local-border-bottom-radius",n?"var(--apkt-borderRadius-5)":"0px");this.style.setProperty("--local-container-height",`${o}px`),this.previousHeight!=="0px"&&this.style.setProperty("--local-duration-height",this.transitionDuration),this.previousHeight=`${o}px`}}),this.resizeObserver.observe(this.getWrapper()),this.updateContainerHeight(),window.addEventListener("resize",this.onViewportResize),(t=window.visualViewport)==null||t.addEventListener("resize",this.onViewportResize)}disconnectedCallback(){var i;const t=this.getWrapper();t&&this.resizeObserver&&this.resizeObserver.unobserve(t),window.removeEventListener("resize",this.onViewportResize),(i=window.visualViewport)==null||i.removeEventListener("resize",this.onViewportResize)}render(){return d`
880
- <div class="container" data-mobile-fullscreen="${I(this.mobileFullScreen)}">
881
- <div
882
- class="page"
883
- data-mobile-fullscreen="${I(this.mobileFullScreen)}"
884
- view-direction="${this.viewDirection}"
885
- >
886
- <div class="page-content">
887
- <slot></slot>
888
- </div>
889
- </div>
890
- </div>
891
- `}onViewChange(t){const i=t.split(",").filter(Boolean),r=this.historyState.split(",").filter(Boolean),a=r.length,o=i.length,n=i[i.length-1]||"",s=ce.cssDurationToNumber(this.transitionDuration);let m="";o>a?m="next":o<a?m="prev":o===a&&i[o-1]!==r[a-1]&&(m="next"),this.viewDirection=`${m}-${n}`,setTimeout(()=>{var y;this.historyState=t,(y=this.setView)==null||y.call(this,n)},s),setTimeout(()=>{this.viewDirection=""},s*2)}getWrapper(){var t;return(t=this.shadowRoot)==null?void 0:t.querySelector("div.page")}updateContainerHeight(){var a;const t=this.getWrapper();if(!t)return;const i=parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--apkt-footer-height")||"0");let r=0;if(this.mobileFullScreen){const o=((a=window.visualViewport)==null?void 0:a.height)||window.innerHeight,n=this.getHeaderHeight();r=o-n-i,this.style.setProperty("--local-border-bottom-radius","0px")}else r=t.getBoundingClientRect().height+i,this.style.setProperty("--local-border-bottom-radius",i?"var(--apkt-borderRadius-5)":"0px");this.style.setProperty("--local-container-height",`${r}px`),this.previousHeight!=="0px"&&this.style.setProperty("--local-duration-height",this.transitionDuration),this.previousHeight=`${r}px`}getHeaderHeight(){return Ue}};b.styles=[Ve];S([l({type:String})],b.prototype,"transitionDuration",void 0);S([l({type:String})],b.prototype,"transitionFunction",void 0);S([l({type:String})],b.prototype,"history",void 0);S([l({type:String})],b.prototype,"view",void 0);S([l({attribute:!1})],b.prototype,"setView",void 0);S([u()],b.prototype,"viewDirection",void 0);S([u()],b.prototype,"historyState",void 0);S([u()],b.prototype,"previousHeight",void 0);S([u()],b.prototype,"mobileFullScreen",void 0);b=S([f("w3m-router-container")],b);export{se as AppKitModal,h as W3mListWallet,ne as W3mModal,x as W3mModalBase,b as W3mRouterContainer,Y as W3mUsageExceededView};