@latticexyz/entrykit 2.2.18-ebe1aea8d4afb690ce1c7c2bcb42dc0f1faf6e77 → 2.2.18

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.
@@ -1,1398 +1,2361 @@
1
- function Vt(e){return{...e,appName:e.appName??document.title,appIcon:e.appIcon??document.querySelector("link[rel~='icon']")?.getAttribute("href")??"/favico.ico"}}import{Root as sr,DialogPortal as lr,DialogContent as dr}from"@radix-ui/react-dialog";import{forwardRef as er,useEffect as tr,useRef as Me,useState as Te}from"react";import rr from"react-dom";var Ce=`*, ::before, ::after {
2
- --tw-border-spacing-x: 0;
3
- --tw-border-spacing-y: 0;
4
- --tw-translate-x: 0;
5
- --tw-translate-y: 0;
6
- --tw-rotate: 0;
7
- --tw-skew-x: 0;
8
- --tw-skew-y: 0;
9
- --tw-scale-x: 1;
10
- --tw-scale-y: 1;
11
- --tw-pan-x: ;
12
- --tw-pan-y: ;
13
- --tw-pinch-zoom: ;
14
- --tw-scroll-snap-strictness: proximity;
15
- --tw-gradient-from-position: ;
16
- --tw-gradient-via-position: ;
17
- --tw-gradient-to-position: ;
18
- --tw-ordinal: ;
19
- --tw-slashed-zero: ;
20
- --tw-numeric-figure: ;
21
- --tw-numeric-spacing: ;
22
- --tw-numeric-fraction: ;
23
- --tw-ring-inset: ;
24
- --tw-ring-offset-width: 0px;
25
- --tw-ring-offset-color: #fff;
26
- --tw-ring-color: rgb(59 130 246 / 0.5);
27
- --tw-ring-offset-shadow: 0 0 #0000;
28
- --tw-ring-shadow: 0 0 #0000;
29
- --tw-shadow: 0 0 #0000;
30
- --tw-shadow-colored: 0 0 #0000;
31
- --tw-blur: ;
32
- --tw-brightness: ;
33
- --tw-contrast: ;
34
- --tw-grayscale: ;
35
- --tw-hue-rotate: ;
36
- --tw-invert: ;
37
- --tw-saturate: ;
38
- --tw-sepia: ;
39
- --tw-drop-shadow: ;
40
- --tw-backdrop-blur: ;
41
- --tw-backdrop-brightness: ;
42
- --tw-backdrop-contrast: ;
43
- --tw-backdrop-grayscale: ;
44
- --tw-backdrop-hue-rotate: ;
45
- --tw-backdrop-invert: ;
46
- --tw-backdrop-opacity: ;
47
- --tw-backdrop-saturate: ;
48
- --tw-backdrop-sepia: ;
49
- --tw-contain-size: ;
50
- --tw-contain-layout: ;
51
- --tw-contain-paint: ;
52
- --tw-contain-style: ;
53
- }
54
-
55
- ::backdrop {
56
- --tw-border-spacing-x: 0;
57
- --tw-border-spacing-y: 0;
58
- --tw-translate-x: 0;
59
- --tw-translate-y: 0;
60
- --tw-rotate: 0;
61
- --tw-skew-x: 0;
62
- --tw-skew-y: 0;
63
- --tw-scale-x: 1;
64
- --tw-scale-y: 1;
65
- --tw-pan-x: ;
66
- --tw-pan-y: ;
67
- --tw-pinch-zoom: ;
68
- --tw-scroll-snap-strictness: proximity;
69
- --tw-gradient-from-position: ;
70
- --tw-gradient-via-position: ;
71
- --tw-gradient-to-position: ;
72
- --tw-ordinal: ;
73
- --tw-slashed-zero: ;
74
- --tw-numeric-figure: ;
75
- --tw-numeric-spacing: ;
76
- --tw-numeric-fraction: ;
77
- --tw-ring-inset: ;
78
- --tw-ring-offset-width: 0px;
79
- --tw-ring-offset-color: #fff;
80
- --tw-ring-color: rgb(59 130 246 / 0.5);
81
- --tw-ring-offset-shadow: 0 0 #0000;
82
- --tw-ring-shadow: 0 0 #0000;
83
- --tw-shadow: 0 0 #0000;
84
- --tw-shadow-colored: 0 0 #0000;
85
- --tw-blur: ;
86
- --tw-brightness: ;
87
- --tw-contrast: ;
88
- --tw-grayscale: ;
89
- --tw-hue-rotate: ;
90
- --tw-invert: ;
91
- --tw-saturate: ;
92
- --tw-sepia: ;
93
- --tw-drop-shadow: ;
94
- --tw-backdrop-blur: ;
95
- --tw-backdrop-brightness: ;
96
- --tw-backdrop-contrast: ;
97
- --tw-backdrop-grayscale: ;
98
- --tw-backdrop-hue-rotate: ;
99
- --tw-backdrop-invert: ;
100
- --tw-backdrop-opacity: ;
101
- --tw-backdrop-saturate: ;
102
- --tw-backdrop-sepia: ;
103
- --tw-contain-size: ;
104
- --tw-contain-layout: ;
105
- --tw-contain-paint: ;
106
- --tw-contain-style: ;
107
- }/*
108
- ! tailwindcss v3.4.13 | MIT License | https://tailwindcss.com
109
- *//*
110
- 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
111
- 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
112
- */
113
-
114
- *,
115
- ::before,
116
- ::after {
117
- box-sizing: border-box; /* 1 */
118
- border-width: 0; /* 2 */
119
- border-style: solid; /* 2 */
120
- border-color: #e5e7eb; /* 2 */
121
- }
122
-
123
- ::before,
124
- ::after {
125
- --tw-content: '';
126
- }
127
-
128
- /*
129
- 1. Use a consistent sensible line-height in all browsers.
130
- 2. Prevent adjustments of font size after orientation changes in iOS.
131
- 3. Use a more readable tab size.
132
- 4. Use the user's configured \`sans\` font-family by default.
133
- 5. Use the user's configured \`sans\` font-feature-settings by default.
134
- 6. Use the user's configured \`sans\` font-variation-settings by default.
135
- 7. Disable tap highlights on iOS
136
- */
137
-
138
- html,
139
- :host {
140
- line-height: 1.5; /* 1 */
141
- -webkit-text-size-adjust: 100%; /* 2 */ /* 3 */
142
- tab-size: 4; /* 3 */
143
- font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
144
- font-feature-settings: normal; /* 5 */
145
- font-variation-settings: normal; /* 6 */
146
- -webkit-tap-highlight-color: transparent; /* 7 */
147
- }
148
-
149
- /*
150
- 1. Remove the margin in all browsers.
151
- 2. Inherit line-height from \`html\` so users can set them as a class directly on the \`html\` element.
152
- */
153
-
154
- body {
155
- margin: 0; /* 1 */
156
- line-height: inherit; /* 2 */
157
- }
158
-
159
- /*
160
- 1. Add the correct height in Firefox.
161
- 2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
162
- 3. Ensure horizontal rules are visible by default.
163
- */
164
-
165
- hr {
166
- height: 0; /* 1 */
167
- color: inherit; /* 2 */
168
- border-top-width: 1px; /* 3 */
169
- }
170
-
171
- /*
172
- Add the correct text decoration in Chrome, Edge, and Safari.
173
- */
174
-
175
- abbr:where([title]) {
176
- -webkit-text-decoration: underline dotted;
177
- text-decoration: underline dotted;
178
- }
179
-
180
- /*
181
- Remove the default font size and weight for headings.
182
- */
183
-
184
- h1,
185
- h2,
186
- h3,
187
- h4,
188
- h5,
189
- h6 {
190
- font-size: inherit;
191
- font-weight: inherit;
192
- }
193
-
194
- /*
195
- Reset links to optimize for opt-in styling instead of opt-out.
196
- */
197
-
198
- a {
199
- color: inherit;
200
- text-decoration: inherit;
201
- }
202
-
203
- /*
204
- Add the correct font weight in Edge and Safari.
205
- */
206
-
207
- b,
208
- strong {
209
- font-weight: bolder;
210
- }
211
-
212
- /*
213
- 1. Use the user's configured \`mono\` font-family by default.
214
- 2. Use the user's configured \`mono\` font-feature-settings by default.
215
- 3. Use the user's configured \`mono\` font-variation-settings by default.
216
- 4. Correct the odd \`em\` font sizing in all browsers.
217
- */
218
-
219
- code,
220
- kbd,
221
- samp,
222
- pre {
223
- font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
224
- font-feature-settings: normal; /* 2 */
225
- font-variation-settings: normal; /* 3 */
226
- font-size: 1em; /* 4 */
227
- }
228
-
229
- /*
230
- Add the correct font size in all browsers.
231
- */
232
-
233
- small {
234
- font-size: 80%;
235
- }
236
-
237
- /*
238
- Prevent \`sub\` and \`sup\` elements from affecting the line height in all browsers.
239
- */
240
-
241
- sub,
242
- sup {
243
- font-size: 75%;
244
- line-height: 0;
245
- position: relative;
246
- vertical-align: baseline;
247
- }
248
-
249
- sub {
250
- bottom: -0.25em;
251
- }
252
-
253
- sup {
254
- top: -0.5em;
255
- }
256
-
257
- /*
258
- 1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
259
- 2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
260
- 3. Remove gaps between table borders by default.
261
- */
262
-
263
- table {
264
- text-indent: 0; /* 1 */
265
- border-color: inherit; /* 2 */
266
- border-collapse: collapse; /* 3 */
267
- }
268
-
269
- /*
270
- 1. Change the font styles in all browsers.
271
- 2. Remove the margin in Firefox and Safari.
272
- 3. Remove default padding in all browsers.
273
- */
274
-
275
- button,
276
- input,
277
- optgroup,
278
- select,
279
- textarea {
280
- font-family: inherit; /* 1 */
281
- font-feature-settings: inherit; /* 1 */
282
- font-variation-settings: inherit; /* 1 */
283
- font-size: 100%; /* 1 */
284
- font-weight: inherit; /* 1 */
285
- line-height: inherit; /* 1 */
286
- letter-spacing: inherit; /* 1 */
287
- color: inherit; /* 1 */
288
- margin: 0; /* 2 */
289
- padding: 0; /* 3 */
290
- }
291
-
292
- /*
293
- Remove the inheritance of text transform in Edge and Firefox.
294
- */
295
-
296
- button,
297
- select {
298
- text-transform: none;
299
- }
300
-
301
- /*
302
- 1. Correct the inability to style clickable types in iOS and Safari.
303
- 2. Remove default button styles.
304
- */
305
-
306
- button,
307
- input:where([type='button']),
308
- input:where([type='reset']),
309
- input:where([type='submit']) {
310
- -webkit-appearance: button; /* 1 */
311
- background-color: transparent; /* 2 */
312
- background-image: none; /* 2 */
313
- }
314
-
315
- /*
316
- Use the modern Firefox focus style for all focusable elements.
317
- */
318
-
319
- :-moz-focusring {
320
- outline: auto;
321
- }
322
-
323
- /*
324
- Remove the additional \`:invalid\` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
325
- */
326
-
327
- :-moz-ui-invalid {
328
- box-shadow: none;
329
- }
330
-
331
- /*
332
- Add the correct vertical alignment in Chrome and Firefox.
333
- */
334
-
335
- progress {
336
- vertical-align: baseline;
337
- }
338
-
339
- /*
340
- Correct the cursor style of increment and decrement buttons in Safari.
341
- */
342
-
343
- ::-webkit-inner-spin-button,
344
- ::-webkit-outer-spin-button {
345
- height: auto;
346
- }
347
-
348
- /*
349
- 1. Correct the odd appearance in Chrome and Safari.
350
- 2. Correct the outline style in Safari.
351
- */
352
-
353
- [type='search'] {
354
- -webkit-appearance: textfield; /* 1 */
355
- outline-offset: -2px; /* 2 */
356
- }
357
-
358
- /*
359
- Remove the inner padding in Chrome and Safari on macOS.
360
- */
361
-
362
- ::-webkit-search-decoration {
363
- -webkit-appearance: none;
364
- }
365
-
366
- /*
367
- 1. Correct the inability to style clickable types in iOS and Safari.
368
- 2. Change font properties to \`inherit\` in Safari.
369
- */
370
-
371
- ::-webkit-file-upload-button {
372
- -webkit-appearance: button; /* 1 */
373
- font: inherit; /* 2 */
374
- }
375
-
376
- /*
377
- Add the correct display in Chrome and Safari.
378
- */
379
-
380
- summary {
381
- display: list-item;
382
- }
383
-
384
- /*
385
- Removes the default spacing and border for appropriate elements.
386
- */
387
-
388
- blockquote,
389
- dl,
390
- dd,
391
- h1,
392
- h2,
393
- h3,
394
- h4,
395
- h5,
396
- h6,
397
- hr,
398
- figure,
399
- p,
400
- pre {
401
- margin: 0;
402
- }
403
-
404
- fieldset {
405
- margin: 0;
406
- padding: 0;
407
- }
408
-
409
- legend {
410
- padding: 0;
411
- }
412
-
413
- ol,
414
- ul,
415
- menu {
416
- list-style: none;
417
- margin: 0;
418
- padding: 0;
419
- }
420
-
421
- /*
422
- Reset default styling for dialogs.
423
- */
424
- dialog {
425
- padding: 0;
426
- }
427
-
428
- /*
429
- Prevent resizing textareas horizontally by default.
430
- */
431
-
432
- textarea {
433
- resize: vertical;
434
- }
435
-
436
- /*
437
- 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
438
- 2. Set the default placeholder color to the user's configured gray 400 color.
439
- */
440
-
441
- input::placeholder,
442
- textarea::placeholder {
443
- opacity: 1; /* 1 */
444
- color: #9ca3af; /* 2 */
445
- }
446
-
447
- /*
448
- Set the default cursor for buttons.
449
- */
450
-
451
- button,
452
- [role="button"] {
453
- cursor: pointer;
454
- }
455
-
456
- /*
457
- Make sure disabled buttons don't get the pointer cursor.
458
- */
459
- :disabled {
460
- cursor: default;
461
- }
462
-
463
- /*
464
- 1. Make replaced elements \`display: block\` by default. (https://github.com/mozdevs/cssremedy/issues/14)
465
- 2. Add \`vertical-align: middle\` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
466
- This can trigger a poorly considered lint error in some tools but is included by design.
467
- */
468
-
469
- img,
470
- svg,
471
- video,
472
- canvas,
473
- audio,
474
- iframe,
475
- embed,
476
- object {
477
- display: block; /* 1 */
478
- vertical-align: middle; /* 2 */
479
- }
480
-
481
- /*
482
- Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
483
- */
484
-
485
- img,
486
- video {
487
- max-width: 100%;
488
- height: auto;
489
- }
490
-
491
- /* Make elements with the HTML hidden attribute stay hidden by default */
492
- [hidden] {
493
- display: none;
494
- }
495
-
496
- .container {
497
- width: 100%;
498
- }
499
-
500
- @media (min-width: 640px) {
501
-
502
- .container {
503
- max-width: 640px;
1
+ // src/config/defineConfig.ts
2
+ function defineConfig(input) {
3
+ return {
4
+ ...input,
5
+ appName: input.appName ?? document.title,
6
+ appIcon: input.appIcon ?? document.querySelector("link[rel~='icon']")?.getAttribute("href") ?? "/favico.ico"
7
+ };
8
+ }
9
+
10
+ // src/ui/Modal.tsx
11
+ import { Root as DialogRoot, DialogPortal, DialogContent } from "@radix-ui/react-dialog";
12
+
13
+ // src/ui/Shadow.tsx
14
+ import { forwardRef, useEffect, useRef, useState } from "react";
15
+ import ReactDOM from "react-dom";
16
+
17
+ // ../../node_modules/.pnpm/tailwindcss@3.4.13/node_modules/tailwindcss/tailwind.css?inline
18
+ var tailwind_default = '*, ::before, ::after {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}\n\n::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}/*\n! tailwindcss v3.4.13 | MIT License | https://tailwindcss.com\n*//*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n border-width: 0; /* 2 */\n border-style: solid; /* 2 */\n border-color: #e5e7eb; /* 2 */\n}\n\n::before,\n::after {\n --tw-content: \'\';\n}\n\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user\'s configured `sans` font-family by default.\n5. Use the user\'s configured `sans` font-feature-settings by default.\n6. Use the user\'s configured `sans` font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\n\nhtml,\n:host {\n line-height: 1.5; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */ /* 3 */\n tab-size: 4; /* 3 */\n font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */\n font-feature-settings: normal; /* 5 */\n font-variation-settings: normal; /* 6 */\n -webkit-tap-highlight-color: transparent; /* 7 */\n}\n\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\n\nbody {\n margin: 0; /* 1 */\n line-height: inherit; /* 2 */\n}\n\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\nhr {\n height: 0; /* 1 */\n color: inherit; /* 2 */\n border-top-width: 1px; /* 3 */\n}\n\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\n/*\nRemove the default font size and weight for headings.\n*/\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: inherit;\n font-weight: inherit;\n}\n\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\na {\n color: inherit;\n text-decoration: inherit;\n}\n\n/*\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/*\n1. Use the user\'s configured `mono` font-family by default.\n2. Use the user\'s configured `mono` font-feature-settings by default.\n3. Use the user\'s configured `mono` font-variation-settings by default.\n4. Correct the odd `em` font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */\n font-feature-settings: normal; /* 2 */\n font-variation-settings: normal; /* 3 */\n font-size: 1em; /* 4 */\n}\n\n/*\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n font-size: 80%;\n}\n\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\ntable {\n text-indent: 0; /* 1 */\n border-color: inherit; /* 2 */\n border-collapse: collapse; /* 3 */\n}\n\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-feature-settings: inherit; /* 1 */\n font-variation-settings: inherit; /* 1 */\n font-size: 100%; /* 1 */\n font-weight: inherit; /* 1 */\n line-height: inherit; /* 1 */\n letter-spacing: inherit; /* 1 */\n color: inherit; /* 1 */\n margin: 0; /* 2 */\n padding: 0; /* 3 */\n}\n\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\nbutton,\nselect {\n text-transform: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\nbutton,\ninput:where([type=\'button\']),\ninput:where([type=\'reset\']),\ninput:where([type=\'submit\']) {\n -webkit-appearance: button; /* 1 */\n background-color: transparent; /* 2 */\n background-image: none; /* 2 */\n}\n\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n:-moz-focusring {\n outline: auto;\n}\n\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n:-moz-ui-invalid {\n box-shadow: none;\n}\n\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n vertical-align: baseline;\n}\n\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type=\'search\'] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n display: list-item;\n}\n\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n margin: 0;\n}\n\nfieldset {\n margin: 0;\n padding: 0;\n}\n\nlegend {\n padding: 0;\n}\n\nol,\nul,\nmenu {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n/*\nReset default styling for dialogs.\n*/\ndialog {\n padding: 0;\n}\n\n/*\nPrevent resizing textareas horizontally by default.\n*/\n\ntextarea {\n resize: vertical;\n}\n\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user\'s configured gray 400 color.\n*/\n\ninput::placeholder,\ntextarea::placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\n/*\nSet the default cursor for buttons.\n*/\n\nbutton,\n[role="button"] {\n cursor: pointer;\n}\n\n/*\nMake sure disabled buttons don\'t get the pointer cursor.\n*/\n:disabled {\n cursor: default;\n}\n\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n display: block; /* 1 */\n vertical-align: middle; /* 2 */\n}\n\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\nimg,\nvideo {\n max-width: 100%;\n height: auto;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden] {\n display: none;\n}\n\n.container {\n width: 100%;\n}\n\n@media (min-width: 640px) {\n\n .container {\n max-width: 640px;\n }\n}\n\n@media (min-width: 768px) {\n\n .container {\n max-width: 768px;\n }\n}\n\n@media (min-width: 1024px) {\n\n .container {\n max-width: 1024px;\n }\n}\n\n@media (min-width: 1280px) {\n\n .container {\n max-width: 1280px;\n }\n}\n\n@media (min-width: 1536px) {\n\n .container {\n max-width: 1536px;\n }\n}\n\n.grid-cols-2.divide-y > :not([hidden]) ~ :not([hidden]):nth-child(-n + 2) {\n border-top-width: 0;\n border-bottom-width: 0;\n}\n\n.sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n}\n\n.pointer-events-none {\n pointer-events: none;\n}\n\n.pointer-events-auto {\n pointer-events: auto;\n}\n\n.fixed {\n position: fixed;\n}\n\n.absolute {\n position: absolute;\n}\n\n.relative {\n position: relative;\n}\n\n.sticky {\n position: sticky;\n}\n\n.inset-0 {\n inset: 0px;\n}\n\n.bottom-0 {\n bottom: 0px;\n}\n\n.left-0 {\n left: 0px;\n}\n\n.right-0 {\n right: 0px;\n}\n\n.top-0 {\n top: 0px;\n}\n\n.col-start-1 {\n grid-column-start: 1;\n}\n\n.row-start-1 {\n grid-row-start: 1;\n}\n\n.m-0 {\n margin: 0px;\n}\n\n.m-2 {\n margin: 0.5rem;\n}\n\n.-mx-0\\.5 {\n margin-left: -0.125rem;\n margin-right: -0.125rem;\n}\n\n.-my-1 {\n margin-top: -0.25rem;\n margin-bottom: -0.25rem;\n}\n\n.-my-\\[0\\.125em\\] {\n margin-top: -0.125em;\n margin-bottom: -0.125em;\n}\n\n.mx-auto {\n margin-left: auto;\n margin-right: auto;\n}\n\n.-ml-3 {\n margin-left: -0.75rem;\n}\n\n.-mt-2 {\n margin-top: -0.5rem;\n}\n\n.block {\n display: block;\n}\n\n.flex {\n display: flex;\n}\n\n.inline-flex {\n display: inline-flex;\n}\n\n.table {\n display: table;\n}\n\n.grid {\n display: grid;\n}\n\n.inline-grid {\n display: inline-grid;\n}\n\n.contents {\n display: contents;\n}\n\n.hidden {\n display: none;\n}\n\n.h-12 {\n height: 3rem;\n}\n\n.h-16 {\n height: 4rem;\n}\n\n.h-4 {\n height: 1rem;\n}\n\n.h-6 {\n height: 1.5rem;\n}\n\n.h-64 {\n height: 16rem;\n}\n\n.h-\\[1\\.25em\\] {\n height: 1.25em;\n}\n\n.h-\\[1em\\] {\n height: 1em;\n}\n\n.h-full {\n height: 100%;\n}\n\n.max-h-full {\n max-height: 100%;\n}\n\n.min-h-\\[22rem\\] {\n min-height: 22rem;\n}\n\n.min-h-\\[26rem\\] {\n min-height: 26rem;\n}\n\n.w-16 {\n width: 4rem;\n}\n\n.w-24 {\n width: 6rem;\n}\n\n.w-28 {\n width: 7rem;\n}\n\n.w-4 {\n width: 1rem;\n}\n\n.w-48 {\n width: 12rem;\n}\n\n.w-6 {\n width: 1.5rem;\n}\n\n.w-60 {\n width: 15rem;\n}\n\n.w-\\[0\\.6em\\] {\n width: 0.6em;\n}\n\n.w-\\[1\\.25em\\] {\n width: 1.25em;\n}\n\n.w-full {\n width: 100%;\n}\n\n.max-w-\\[26rem\\] {\n max-width: 26rem;\n}\n\n.flex-shrink-0 {\n flex-shrink: 0;\n}\n\n.flex-grow {\n flex-grow: 1;\n}\n\n.-translate-y-2 {\n --tw-translate-y: -0.5rem;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n.-translate-y-4 {\n --tw-translate-y: -1rem;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n.translate-x-2 {\n --tw-translate-x: 0.5rem;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n.translate-y-0 {\n --tw-translate-y: 0px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n.scale-100 {\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n.scale-50 {\n --tw-scale-x: .5;\n --tw-scale-y: .5;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n@keyframes spin {\n\n to {\n transform: rotate(360deg);\n }\n}\n\n.animate-spin {\n animation: spin 1s linear infinite;\n}\n\n.cursor-pointer {\n cursor: pointer;\n}\n\n.grid-cols-\\[1fr_auto_1fr\\] {\n grid-template-columns: 1fr auto 1fr;\n}\n\n.flex-col {\n flex-direction: column;\n}\n\n.place-items-center {\n place-items: center;\n}\n\n.items-end {\n align-items: flex-end;\n}\n\n.items-center {\n align-items: center;\n}\n\n.justify-end {\n justify-content: flex-end;\n}\n\n.justify-center {\n justify-content: center;\n}\n\n.justify-between {\n justify-content: space-between;\n}\n\n.gap-1 {\n gap: 0.25rem;\n}\n\n.gap-2 {\n gap: 0.5rem;\n}\n\n.gap-2\\.5 {\n gap: 0.625rem;\n}\n\n.gap-4 {\n gap: 1rem;\n}\n\n.gap-6 {\n gap: 1.5rem;\n}\n\n.space-y-6 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));\n}\n\n.divide-y > :not([hidden]) ~ :not([hidden]) {\n --tw-divide-y-reverse: 0;\n border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));\n border-bottom-width: calc(1px * var(--tw-divide-y-reverse));\n}\n\n.divide-neutral-800 > :not([hidden]) ~ :not([hidden]) {\n --tw-divide-opacity: 1;\n border-color: rgb(38 38 38 / var(--tw-divide-opacity));\n}\n\n.self-auto {\n align-self: auto;\n}\n\n.self-center {\n align-self: center;\n}\n\n.overflow-auto {\n overflow: auto;\n}\n\n.overflow-clip {\n overflow: clip;\n}\n\n.whitespace-pre-wrap {\n white-space: pre-wrap;\n}\n\n.rounded-full {\n border-radius: 9999px;\n}\n\n.border {\n border-width: 1px;\n}\n\n.border-4 {\n border-width: 4px;\n}\n\n.border-neutral-300 {\n --tw-border-opacity: 1;\n border-color: rgb(212 212 212 / var(--tw-border-opacity));\n}\n\n.border-transparent {\n border-color: transparent;\n}\n\n.bg-black\\/10 {\n background-color: rgb(0 0 0 / 0.1);\n}\n\n.bg-blue-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(37 99 235 / var(--tw-bg-opacity));\n}\n\n.bg-blue-700 {\n --tw-bg-opacity: 1;\n background-color: rgb(29 78 216 / var(--tw-bg-opacity));\n}\n\n.bg-blue-700\\/60 {\n background-color: rgb(29 78 216 / 0.6);\n}\n\n.bg-neutral-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(245 245 245 / var(--tw-bg-opacity));\n}\n\n.bg-neutral-700 {\n --tw-bg-opacity: 1;\n background-color: rgb(64 64 64 / var(--tw-bg-opacity));\n}\n\n.bg-neutral-800 {\n --tw-bg-opacity: 1;\n background-color: rgb(38 38 38 / var(--tw-bg-opacity));\n}\n\n.bg-neutral-800\\/85 {\n background-color: rgb(38 38 38 / 0.85);\n}\n\n.bg-neutral-900 {\n --tw-bg-opacity: 1;\n background-color: rgb(23 23 23 / var(--tw-bg-opacity));\n}\n\n.bg-orange-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(249 115 22 / var(--tw-bg-opacity));\n}\n\n.bg-orange-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(234 88 12 / var(--tw-bg-opacity));\n}\n\n.bg-gradient-to-b {\n background-image: linear-gradient(to bottom, var(--tw-gradient-stops));\n}\n\n.from-transparent {\n --tw-gradient-from: transparent var(--tw-gradient-from-position);\n --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);\n}\n\n.to-blue-700 {\n --tw-gradient-to: #1d4ed8 var(--tw-gradient-to-position);\n}\n\n.bg-cover {\n background-size: cover;\n}\n\n.bg-center {\n background-position: center;\n}\n\n.bg-no-repeat {\n background-repeat: no-repeat;\n}\n\n.object-cover {\n object-fit: cover;\n}\n\n.p-1 {\n padding: 0.25rem;\n}\n\n.p-2 {\n padding: 0.5rem;\n}\n\n.p-3 {\n padding: 0.75rem;\n}\n\n.p-4 {\n padding: 1rem;\n}\n\n.p-6 {\n padding: 1.5rem;\n}\n\n.p-\\[\\.75em\\] {\n padding: .75em;\n}\n\n.px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n}\n\n.py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n\n.py-8 {\n padding-top: 2rem;\n padding-bottom: 2rem;\n}\n\n.pb-8 {\n padding-bottom: 2rem;\n}\n\n.pt-8 {\n padding-top: 2rem;\n}\n\n.text-left {\n text-align: left;\n}\n\n.text-center {\n text-align: center;\n}\n\n.font-mono {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;\n}\n\n.text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n\n.text-\\[\\.75em\\] {\n font-size: .75em;\n}\n\n.text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n\n.text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n\n.text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n\n.text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n\n.font-bold {\n font-weight: 700;\n}\n\n.font-medium {\n font-weight: 500;\n}\n\n.leading-none {\n line-height: 1;\n}\n\n.tracking-\\[-1ch\\] {\n letter-spacing: -1ch;\n}\n\n.text-black {\n --tw-text-opacity: 1;\n color: rgb(0 0 0 / var(--tw-text-opacity));\n}\n\n.text-neutral-400 {\n --tw-text-opacity: 1;\n color: rgb(163 163 163 / var(--tw-text-opacity));\n}\n\n.text-orange-500 {\n --tw-text-opacity: 1;\n color: rgb(249 115 22 / var(--tw-text-opacity));\n}\n\n.text-transparent {\n color: transparent;\n}\n\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n\n.text-white\\/20 {\n color: rgb(255 255 255 / 0.2);\n}\n\n.text-white\\/80 {\n color: rgb(255 255 255 / 0.8);\n}\n\n.opacity-0 {\n opacity: 0;\n}\n\n.opacity-100 {\n opacity: 1;\n}\n\n.opacity-25 {\n opacity: 0.25;\n}\n\n.opacity-30 {\n opacity: 0.3;\n}\n\n.opacity-75 {\n opacity: 0.75;\n}\n\n.outline-none {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n\n.ring-1 {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n.ring-neutral-700\\/50 {\n --tw-ring-color: rgb(64 64 64 / 0.5);\n}\n\n.filter {\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n.transition {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n\n.duration-100 {\n transition-duration: 100ms;\n}\n\n.duration-300 {\n transition-duration: 300ms;\n}\n\n@keyframes enter {\n\n from {\n opacity: var(--tw-enter-opacity, 1);\n transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));\n }\n}\n\n@keyframes exit {\n\n to {\n opacity: var(--tw-exit-opacity, 1);\n transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0));\n }\n}\n\n.animate-in {\n animation-name: enter;\n animation-duration: 150ms;\n --tw-enter-opacity: initial;\n --tw-enter-scale: initial;\n --tw-enter-rotate: initial;\n --tw-enter-translate-x: initial;\n --tw-enter-translate-y: initial;\n}\n\n.fade-in {\n --tw-enter-opacity: 0;\n}\n\n.slide-in-from-bottom-16 {\n --tw-enter-translate-y: 4rem;\n}\n\n.slide-in-from-bottom-8 {\n --tw-enter-translate-y: 2rem;\n}\n\n.animate-duration-300 {\n animation-duration: 300ms;\n}\n\n@property --tw-border-gradient-angle {\n syntax: \'<angle>\';\n inherits: true;\n initial-value: 0deg;\n}\n\n@property --tw-conic-gradient-angle {\n syntax: \'<angle>\';\n inherits: true;\n initial-value: 0deg;\n}\n\n@keyframes border-gradient {\n\n to {\n --tw-border-gradient-angle: 360deg;\n }\n}\n\n.after\\:select-none::after {\n content: var(--tw-content);\n -webkit-user-select: none;\n user-select: none;\n}\n\n.after\\:content-\\[\\\'\\2026\\\'\\]::after {\n --tw-content: \'\u2026\';\n content: var(--tw-content);\n}\n\n.hover\\:bg-blue-500:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(59 130 246 / var(--tw-bg-opacity));\n}\n\n.hover\\:bg-neutral-200:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(229 229 229 / var(--tw-bg-opacity));\n}\n\n.hover\\:bg-orange-400:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(251 146 60 / var(--tw-bg-opacity));\n}\n\n.hover\\:text-white:hover {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n\n.hover\\:text-white\\/40:hover {\n color: rgb(255 255 255 / 0.4);\n}\n\n.hover\\:brightness-125:hover {\n --tw-brightness: brightness(1.25);\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n.focus\\:border-orange-500:focus {\n --tw-border-opacity: 1;\n border-color: rgb(249 115 22 / var(--tw-border-opacity));\n}\n\n.focus\\:border-yellow-400:focus {\n --tw-border-opacity: 1;\n border-color: rgb(250 204 21 / var(--tw-border-opacity));\n}\n\n.active\\:bg-orange-600:active {\n --tw-bg-opacity: 1;\n background-color: rgb(234 88 12 / var(--tw-bg-opacity));\n}\n\n.active\\:brightness-150:active {\n --tw-brightness: brightness(1.5);\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n.group:hover .group-hover\\:rotate-90 {\n --tw-rotate: 90deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n.aria-busy\\:pointer-events-none[aria-busy="true"] {\n pointer-events: none;\n}\n\n.aria-busy\\:bg-blue-500[aria-busy="true"] {\n --tw-bg-opacity: 1;\n background-color: rgb(59 130 246 / var(--tw-bg-opacity));\n}\n\n.aria-disabled\\:pointer-events-none[aria-disabled="true"] {\n pointer-events: none;\n}\n\n.aria-disabled\\:opacity-50[aria-disabled="true"] {\n opacity: 0.5;\n}\n\n.group[aria-busy="true"] .group-aria-busy\\:inline {\n display: inline;\n}\n\n.group[aria-busy="true"] .group-aria-busy\\:hidden {\n display: none;\n}\n\n.group\\/button[aria-busy="true"] .group-aria-busy\\/button\\:translate-x-0 {\n --tw-translate-x: 0px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n.group[aria-busy="true"] .group-aria-busy\\:scale-100 {\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n.group[aria-busy="true"] .group-aria-busy\\:scale-125 {\n --tw-scale-x: 1.25;\n --tw-scale-y: 1.25;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n.group\\/button[aria-busy="true"] .group-aria-busy\\/button\\:opacity-100 {\n opacity: 1;\n}\n\n.group[aria-busy="true"] .group-aria-busy\\:opacity-0 {\n opacity: 0;\n}\n\n.group[aria-busy="true"] .group-aria-busy\\:opacity-100 {\n opacity: 1;\n}\n\n.group\\/button[aria-busy="true"] .group-aria-busy\\/button\\:duration-300 {\n transition-duration: 300ms;\n}\n\n.data-\\[highlighted\\]\\:bg-neutral-200[data-highlighted] {\n --tw-bg-opacity: 1;\n background-color: rgb(229 229 229 / var(--tw-bg-opacity));\n}\n\n.links\\:font-medium a[href]:not(.links-unset) {\n font-weight: 500;\n}\n\n.links\\:text-white a[href]:not(.links-unset) {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n\n.links\\:underline a[href]:not(.links-unset) {\n text-decoration-line: underline;\n}\n\n.links\\:decoration-neutral-500 a[href]:not(.links-unset) {\n text-decoration-color: #737373;\n}\n\n.links\\:underline-offset-4 a[href]:not(.links-unset) {\n text-underline-offset: 4px;\n}\n\n.hover\\:links\\:decoration-orange-500 a[href]:not(.links-unset):hover {\n text-decoration-color: #f97316;\n}\n\n@media (min-width: 640px) {\n\n .sm\\:items-center {\n align-items: center;\n }\n}\n\n.dark\\:border-neutral-700:where([data-theme="dark"], [data-theme="dark"] *) {\n --tw-border-opacity: 1;\n border-color: rgb(64 64 64 / var(--tw-border-opacity));\n}\n\n.dark\\:bg-neutral-800:where([data-theme="dark"], [data-theme="dark"] *) {\n --tw-bg-opacity: 1;\n background-color: rgb(38 38 38 / var(--tw-bg-opacity));\n}\n\n.dark\\:bg-white\\/10:where([data-theme="dark"], [data-theme="dark"] *) {\n background-color: rgb(255 255 255 / 0.1);\n}\n\n.dark\\:text-white:where([data-theme="dark"], [data-theme="dark"] *) {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n\n.dark\\:hover\\:bg-neutral-700:hover:where([data-theme="dark"], [data-theme="dark"] *) {\n --tw-bg-opacity: 1;\n background-color: rgb(64 64 64 / var(--tw-bg-opacity));\n}\n';
19
+
20
+ // src/ui/Shadow.tsx
21
+ import { useResizeObserver } from "usehooks-ts";
22
+ import { mergeRefs } from "react-merge-refs";
23
+
24
+ // src/ui/FrameProvider.tsx
25
+ import { createContext, useContext } from "react";
26
+ import { jsx } from "react/jsx-runtime";
27
+ var Context = createContext(null);
28
+ function FrameProvider({ frame, children }) {
29
+ const value = useContext(Context);
30
+ if (value) throw new Error("`FrameProvider` can only be used once.");
31
+ return /* @__PURE__ */ jsx(Context.Provider, { value: { frame }, children });
32
+ }
33
+
34
+ // src/useTheme.ts
35
+ import { useMediaQuery } from "usehooks-ts";
36
+
37
+ // src/EntryKitConfigProvider.tsx
38
+ import "@rainbow-me/rainbowkit/styles.css";
39
+ import { createContext as createContext2, useContext as useContext2 } from "react";
40
+ import { RainbowKitProvider, midnightTheme } from "@rainbow-me/rainbowkit";
41
+ import { useChains } from "wagmi";
42
+
43
+ // src/getBundlerTransport.ts
44
+ import { transactionQueue } from "@latticexyz/common/actions";
45
+ import { createClient, fallback, http, keccak256, stringToHex, webSocket } from "viem";
46
+ import { privateKeyToAccount } from "viem/accounts";
47
+
48
+ // src/quarry/transports/userOpExecutor.ts
49
+ import {
50
+ createTransport,
51
+ numberToHex,
52
+ parseEther
53
+ } from "viem";
54
+ import { entryPoint07Address as entryPoint07Address2 } from "viem/account-abstraction";
55
+
56
+ // src/quarry/transports/methods/estimateUserOperationGas.ts
57
+ import { formatUserOperationRequest } from "viem/account-abstraction";
58
+ async function estimateUserOperationGas(_params) {
59
+ return formatUserOperationRequest({
60
+ callGasLimit: 20000000n,
61
+ preVerificationGas: 200000n,
62
+ verificationGasLimit: 2000000n,
63
+ paymasterVerificationGasLimit: 200000n,
64
+ paymasterPostOpGasLimit: 200000n
65
+ });
66
+ }
67
+
68
+ // src/quarry/transports/methods/sendUserOperation.ts
69
+ import { parseEventLogs } from "viem";
70
+ import {
71
+ formatUserOperation,
72
+ toPackedUserOperation,
73
+ getUserOperationHash,
74
+ entryPoint07Address,
75
+ entryPoint07Abi
76
+ } from "viem/account-abstraction";
77
+ import { waitForTransactionReceipt, writeContract } from "viem/actions";
78
+ import { getAction } from "viem/utils";
79
+ async function sendUserOperation({
80
+ executor,
81
+ rpcUserOp
82
+ }) {
83
+ const userOp = formatUserOperation(rpcUserOp);
84
+ const packedUserOp = toPackedUserOperation(userOp);
85
+ const userOpHash = getUserOperationHash({
86
+ userOperation: userOp,
87
+ chainId: executor.chain.id,
88
+ entryPointVersion: "0.7",
89
+ entryPointAddress: entryPoint07Address
90
+ });
91
+ const transactionHash = await getAction(
92
+ executor,
93
+ writeContract,
94
+ "writeContract"
95
+ )({
96
+ abi: entryPoint07Abi,
97
+ address: entryPoint07Address,
98
+ functionName: "handleOps",
99
+ args: [[packedUserOp], executor.account.address],
100
+ chain: executor.chain,
101
+ account: executor.account
102
+ });
103
+ const receipt = await getAction(
104
+ executor,
105
+ waitForTransactionReceipt,
106
+ "waitForTransactionReceipt"
107
+ )({ hash: transactionHash });
108
+ const parsedLogs = parseEventLogs({
109
+ logs: receipt.logs,
110
+ abi: entryPoint07Abi,
111
+ eventName: "UserOperationEvent"
112
+ });
113
+ return {
114
+ success: parsedLogs[0].args.success,
115
+ userOpHash,
116
+ receipt
117
+ };
118
+ }
119
+
120
+ // src/debug.ts
121
+ import createDebug from "debug";
122
+ var debug = createDebug("mud:entrykit");
123
+ var error = createDebug("mud:entrykit");
124
+ debug.log = console.debug.bind(console);
125
+ error.log = console.error.bind(console);
126
+
127
+ // src/quarry/debug.ts
128
+ var debug2 = debug.extend("quarry");
129
+
130
+ // src/quarry/transports/userOpExecutor.ts
131
+ import { setBalance } from "viem/actions";
132
+ function userOpExecutor({ executor }) {
133
+ return () => {
134
+ debug2("using a local user op executor", executor.account.address);
135
+ if (executor.chain.id === 31337) {
136
+ debug2("setting executor balance");
137
+ setBalance(
138
+ executor.extend(() => ({ mode: "anvil" })),
139
+ {
140
+ address: executor.account.address,
141
+ value: parseEther("100")
142
+ }
143
+ );
144
+ }
145
+ const receipts = /* @__PURE__ */ new Map();
146
+ const request = async ({ method, params }) => {
147
+ if (method === "eth_chainId") {
148
+ return numberToHex(executor.chain.id);
149
+ }
150
+ if (method === "eth_supportedEntryPoints") {
151
+ return [entryPoint07Address2];
152
+ }
153
+ if (method === "eth_sendUserOperation") {
154
+ const [rpcUserOp, entrypoint] = params;
155
+ if (entrypoint === entryPoint07Address2) {
156
+ const result = await sendUserOperation({ executor, rpcUserOp });
157
+ receipts.set(result.userOpHash, result);
158
+ return result.userOpHash;
159
+ }
160
+ }
161
+ if (method === "eth_getUserOperationReceipt") {
162
+ const [hash] = params;
163
+ return receipts.get(hash) ?? null;
164
+ }
165
+ if (method === "eth_estimateUserOperationGas") {
166
+ return await estimateUserOperationGas(params);
167
+ }
168
+ throw new Error("Method not implemented.");
169
+ };
170
+ return createTransport({
171
+ key: "userOpExecutor",
172
+ type: "userOpExecutor",
173
+ name: "User Operation Executor Transport",
174
+ request
175
+ });
176
+ };
177
+ }
178
+
179
+ // src/getBundlerTransport.ts
180
+ function getBundlerTransport(chain) {
181
+ const bundlerHttpUrl = chain.rpcUrls.bundler?.http[0];
182
+ const bundlerTransport = bundlerHttpUrl ? http(bundlerHttpUrl) : chain.id === 31337 ? userOpExecutor({
183
+ executor: createClient({
184
+ chain,
185
+ transport: fallback([webSocket(), http()]),
186
+ account: privateKeyToAccount(keccak256(stringToHex("local user op executor"))),
187
+ pollingInterval: 10
188
+ }).extend(transactionQueue())
189
+ }) : null;
190
+ if (!bundlerTransport) {
191
+ throw new Error(`Chain ${chain.id} config did not include a bundler RPC URL.`);
504
192
  }
505
- }
506
-
507
- @media (min-width: 768px) {
508
-
509
- .container {
510
- max-width: 768px;
193
+ return bundlerTransport;
194
+ }
195
+
196
+ // src/EntryKitConfigProvider.tsx
197
+ import { jsx as jsx2 } from "react/jsx-runtime";
198
+ var Context2 = createContext2(null);
199
+ function EntryKitConfigProvider({ config, children }) {
200
+ const currentConfig = useContext2(Context2);
201
+ if (currentConfig) throw new Error("`EntryKitProvider` can only be used once.");
202
+ const chains = useChains();
203
+ const chain = chains.find(({ id }) => id === config.chainId);
204
+ if (!chain) throw new Error(`Could not find configured chain for chain ID ${config.chainId}.`);
205
+ getBundlerTransport(chain);
206
+ return /* @__PURE__ */ jsx2(
207
+ RainbowKitProvider,
208
+ {
209
+ initialChain: 0,
210
+ appInfo: {
211
+ appName: config.appName
212
+ // TODO: learn more and disclaimer
213
+ },
214
+ theme: midnightTheme({ borderRadius: "none" }),
215
+ children: /* @__PURE__ */ jsx2(Context2.Provider, { value: { ...config, chain }, children })
216
+ }
217
+ );
218
+ }
219
+ function useEntryKitConfig() {
220
+ const config = useContext2(Context2);
221
+ if (!config) throw new Error("`useEntryKitConfig` can only be used within a `EntryKitProvider`.");
222
+ return config;
223
+ }
224
+
225
+ // src/useTheme.ts
226
+ function useTheme() {
227
+ const { theme: initialTheme } = useEntryKitConfig();
228
+ const darkMode = useMediaQuery("(prefers-color-scheme: dark)");
229
+ const theme = initialTheme ?? (darkMode ? "dark" : "light");
230
+ return theme;
231
+ }
232
+
233
+ // src/ui/Shadow.tsx
234
+ import { jsx as jsx3, jsxs } from "react/jsx-runtime";
235
+ function Resizer({
236
+ onSize,
237
+ ...props
238
+ }) {
239
+ const ref = useRef(null);
240
+ useResizeObserver({ ref, onResize: onSize });
241
+ return /* @__PURE__ */ jsx3("div", { ref, ...props, style: { ...props.style, display: "inline-grid" } });
242
+ }
243
+ var Shadow = forwardRef(function Shadow2({ mode, children }, forwardedRef) {
244
+ const frameRef = useRef(null);
245
+ const [loaded, setLoaded] = useState(false);
246
+ const frame = loaded ? frameRef.current : null;
247
+ const [frameSize, setFrameSize] = useState({
248
+ width: void 0,
249
+ height: void 0
250
+ });
251
+ const frameDocument = frame?.contentDocument;
252
+ const theme = useTheme();
253
+ useEffect(() => {
254
+ if (frameDocument) {
255
+ frameDocument.body.setAttribute("data-theme", theme);
256
+ }
257
+ }, [frameDocument, theme]);
258
+ const frameStyle = mode === "modal" ? {
259
+ all: "unset",
260
+ display: "block",
261
+ position: "fixed",
262
+ inset: "0",
263
+ width: "100%",
264
+ height: "100%",
265
+ zIndex: "2147483646"
266
+ } : frameSize.width && frameSize.height ? {
267
+ all: "unset",
268
+ display: "inline-grid",
269
+ width: `${frameSize.width}px`,
270
+ height: `${frameSize.height}px`
271
+ } : {
272
+ all: "unset",
273
+ display: "block",
274
+ position: "fixed",
275
+ inset: "0",
276
+ width: "100%",
277
+ height: "100%",
278
+ opacity: 0,
279
+ pointerEvents: "none"
280
+ };
281
+ return /* @__PURE__ */ jsx3(
282
+ "iframe",
283
+ {
284
+ ref: mergeRefs([forwardedRef, frameRef]),
285
+ style: frameStyle,
286
+ onLoad: () => setLoaded(true),
287
+ srcDoc: "<!doctype html><title>\u2026</title>",
288
+ children: frameDocument ? ReactDOM.createPortal(
289
+ /* @__PURE__ */ jsxs(FrameProvider, { frame, children: [
290
+ /* @__PURE__ */ jsx3("div", { children: mode === "modal" ? children : /* @__PURE__ */ jsx3(Resizer, { onSize: setFrameSize, children }) }),
291
+ /* @__PURE__ */ jsx3("style", { dangerouslySetInnerHTML: { __html: tailwind_default } })
292
+ ] }),
293
+ frameDocument.body
294
+ ) : null
295
+ }
296
+ );
297
+ });
298
+
299
+ // src/ui/Modal.tsx
300
+ import { twMerge } from "tailwind-merge";
301
+ import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
302
+ function Modal({ open, onOpenChange, children }) {
303
+ return /* @__PURE__ */ jsx4(DialogRoot, { open, onOpenChange, children: /* @__PURE__ */ jsx4(DialogPortal, { children: /* @__PURE__ */ jsxs2(Shadow, { mode: "modal", children: [
304
+ /* @__PURE__ */ jsx4("div", { className: twMerge("fixed inset-0", "bg-neutral-800/85", "animate-in animate-duration-300 fade-in") }),
305
+ /* @__PURE__ */ jsx4(
306
+ "div",
307
+ {
308
+ className: twMerge(
309
+ "fixed inset-0",
310
+ "grid items-end sm:items-center",
311
+ "animate-in animate-duration-300 fade-in slide-in-from-bottom-16"
312
+ ),
313
+ children: /* @__PURE__ */ jsx4("div", { children: /* @__PURE__ */ jsx4(
314
+ DialogContent,
315
+ {
316
+ className: "outline-none w-full max-w-[26rem] mx-auto",
317
+ "aria-describedby": void 0,
318
+ onOpenAutoFocus: (event) => {
319
+ event.preventDefault();
320
+ },
321
+ children
322
+ }
323
+ ) })
324
+ }
325
+ )
326
+ ] }) }) });
327
+ }
328
+
329
+ // src/useAccountModal.ts
330
+ import { useCallback, useMemo } from "react";
331
+ import { useStore } from "zustand";
332
+ import { createStore } from "zustand/vanilla";
333
+ var store = createStore(() => ({ open: false }));
334
+ function useAccountModal() {
335
+ const accountModalOpen = useStore(store, (state) => state.open);
336
+ const openAccountModal = useCallback(() => {
337
+ store.setState({ open: true });
338
+ }, []);
339
+ const closeAccountModal = useCallback(() => {
340
+ store.setState({ open: false });
341
+ }, []);
342
+ const toggleAccountModal = useCallback((open) => {
343
+ store.setState({ open });
344
+ }, []);
345
+ return useMemo(
346
+ () => ({
347
+ accountModalOpen,
348
+ openAccountModal,
349
+ closeAccountModal,
350
+ toggleAccountModal
351
+ }),
352
+ [accountModalOpen, openAccountModal, closeAccountModal, toggleAccountModal]
353
+ );
354
+ }
355
+
356
+ // src/AccountModal.tsx
357
+ import { twMerge as twMerge10 } from "tailwind-merge";
358
+
359
+ // src/AccountModalContent.tsx
360
+ import { useAccount as useAccount2, useConnectorClient } from "wagmi";
361
+
362
+ // src/ConnectWallet.tsx
363
+ import { useAccount } from "wagmi";
364
+
365
+ // src/ui/Button.tsx
366
+ import { twMerge as twMerge3 } from "tailwind-merge";
367
+
368
+ // src/icons/PendingIcon.tsx
369
+ import { twMerge as twMerge2 } from "tailwind-merge";
370
+ import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
371
+ function PendingIcon({ className, ...props }) {
372
+ return /* @__PURE__ */ jsxs3(
373
+ "svg",
374
+ {
375
+ className: twMerge2("-my-[0.125em] h-[1.25em] w-[1.25em] animate-spin", className),
376
+ xmlns: "http://www.w3.org/2000/svg",
377
+ fill: "none",
378
+ viewBox: "0 0 24 24",
379
+ ...props,
380
+ children: [
381
+ /* @__PURE__ */ jsx5("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
382
+ /* @__PURE__ */ jsx5(
383
+ "path",
384
+ {
385
+ className: "opacity-75",
386
+ fill: "currentColor",
387
+ d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
388
+ }
389
+ )
390
+ ]
391
+ }
392
+ );
393
+ }
394
+
395
+ // src/ui/Button.tsx
396
+ import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
397
+ var buttonClassName = ({ variant = "secondary" } = {}) => twMerge3(
398
+ "group/button self-center leading-none outline-none border-4 border-transparent",
399
+ "transition hover:brightness-125 active:brightness-150",
400
+ "focus:border-orange-500",
401
+ "aria-disabled:pointer-events-none aria-busy:pointer-events-none",
402
+ // TODO: better disabled state
403
+ "aria-disabled:opacity-50",
404
+ "p-[.75em] font-medium",
405
+ {
406
+ primary: twMerge3("bg-orange-600 text-white focus:border-yellow-400"),
407
+ secondary: twMerge3("bg-neutral-700 text-white focus:border-orange-500"),
408
+ tertiary: twMerge3("bg-neutral-800 text-white focus:border-orange-500")
409
+ }[variant]
410
+ );
411
+ var Button = ({ pending, variant, type, className, children, disabled, ...props }) => {
412
+ return /* @__PURE__ */ jsx6(
413
+ "button",
414
+ {
415
+ type: type || "button",
416
+ className: twMerge3(buttonClassName({ variant, pending }), className),
417
+ "aria-busy": pending,
418
+ "aria-disabled": disabled,
419
+ disabled: disabled || pending,
420
+ ...props,
421
+ children: /* @__PURE__ */ jsxs4("span", { className: "grid grid-cols-[1fr_auto_1fr] gap-2", children: [
422
+ /* @__PURE__ */ jsx6("span", { className: "flex items-center justify-end text-[.75em]", children: /* @__PURE__ */ jsx6("span", { className: "transition opacity-0 translate-x-2 group-aria-busy/button:opacity-100 group-aria-busy/button:translate-x-0 duration-100 group-aria-busy/button:duration-300", children: /* @__PURE__ */ jsx6(PendingIcon, {}) }) }),
423
+ /* @__PURE__ */ jsx6("span", { children })
424
+ ] })
425
+ }
426
+ );
427
+ };
428
+
429
+ // src/ConnectWallet.tsx
430
+ import { useConnectModal } from "@rainbow-me/rainbowkit";
431
+
432
+ // src/icons/Logo.tsx
433
+ import { twMerge as twMerge4 } from "tailwind-merge";
434
+ import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
435
+ function Logo({ className, ...props }) {
436
+ return /* @__PURE__ */ jsxs5(
437
+ "svg",
438
+ {
439
+ xmlns: "http://www.w3.org/2000/svg",
440
+ viewBox: "0 0 8 8",
441
+ fill: "currentColor",
442
+ shapeRendering: "crispEdges",
443
+ className: twMerge4("-my-[0.125em] h-[1.25em] w-[1.25em]", className),
444
+ ...props,
445
+ children: [
446
+ /* @__PURE__ */ jsx7("path", { d: "M0 0h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm1 0h1v1H1zm1 0h1v1H2zm1 0h1v1H3zm1 0h1v1H4zm1 0h1v1H5zm2-1h1v1H7zm0 1h1v1H7zM6 7h1v1H6zm1-2h1v1H7zm0-1h1v1H7zm0-1h1v1H7z" }),
447
+ /* @__PURE__ */ jsx7(
448
+ "path",
449
+ {
450
+ d: "M2 2h1v1H2zm0 1h1v1H2zm0 1h1v1H2zm0 1h1v1H2zm1-3h1v1H3zm1 0h1v1H4zm1 0h1v1H5zm0 1h1v1H5zm0 1h1v1H5zm0 1h1v1H5zM4 5h1v1H4zM3 5h1v1H3z",
451
+ opacity: ".5"
452
+ }
453
+ ),
454
+ /* @__PURE__ */ jsx7("path", { d: "M7 2h1v1H7zm0-1h1v1H7zM1 0h1v1H1zm1 0h1v1H2zm1 0h1v1H3zm1 0h1v1H4zm1 0h1v1H5zm1 0h1v1H6zm1 0h1v1H7z" })
455
+ ]
456
+ }
457
+ );
458
+ }
459
+
460
+ // src/usePreloadImage.tsx
461
+ import { useQuery } from "@tanstack/react-query";
462
+ function usePreloadImage(url) {
463
+ return useQuery({
464
+ enabled: !!url,
465
+ retry: false,
466
+ retryOnMount: false,
467
+ refetchOnMount: false,
468
+ refetchOnWindowFocus: false,
469
+ queryKey: ["preloadImage", url],
470
+ queryFn: () => new Promise((resolve, reject) => {
471
+ if (!url) throw new Error("usePreloadImage: Must provide `url` to preload image.");
472
+ const image = new Image();
473
+ image.onload = () => resolve(image);
474
+ image.onerror = () => reject(new Error(`usePreloadImage: Could not load image.
475
+
476
+ URL: ${url}`));
477
+ image.src = url;
478
+ })
479
+ });
480
+ }
481
+
482
+ // src/AppInfo.tsx
483
+ import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
484
+ function AppInfo() {
485
+ const { appName, appIcon } = useEntryKitConfig();
486
+ const { data: hasAppIcon, isLoading: appIconLoading } = usePreloadImage(appIcon);
487
+ return /* @__PURE__ */ jsxs6("div", { className: "flex-grow flex flex-col items-center justify-center gap-2", children: [
488
+ /* @__PURE__ */ jsx8("div", { className: "w-16 h-16 m-2", children: !appIconLoading ? hasAppIcon ? /* @__PURE__ */ jsx8("img", { src: appIcon, className: "w-full h-full object-cover" }) : (
489
+ // TODO: swap with favicon
490
+ /* @__PURE__ */ jsx8(Logo, { className: "w-full h-full text-orange-500 dark:bg-neutral-800" })
491
+ ) : null }),
492
+ /* @__PURE__ */ jsx8("div", { className: "text-2xl text-white text-center", children: appName })
493
+ ] });
494
+ }
495
+
496
+ // src/ConnectWallet.tsx
497
+ import { twMerge as twMerge5 } from "tailwind-merge";
498
+ import { useEffect as useEffect2, useState as useState2 } from "react";
499
+ import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
500
+ function ConnectWallet() {
501
+ const userAccount = useAccount();
502
+ const { openConnectModal, connectModalOpen } = useConnectModal();
503
+ const [hasAutoOpened, setHasAutoOpened] = useState2(false);
504
+ useEffect2(() => {
505
+ if (!connectModalOpen && !hasAutoOpened) {
506
+ openConnectModal?.();
507
+ setHasAutoOpened(true);
508
+ }
509
+ }, [connectModalOpen, hasAutoOpened, openConnectModal]);
510
+ return /* @__PURE__ */ jsxs7(
511
+ "div",
512
+ {
513
+ className: twMerge5("flex flex-col gap-6 p-6", "animate-in animate-duration-300 fade-in slide-in-from-bottom-8"),
514
+ children: [
515
+ /* @__PURE__ */ jsx9("div", { className: "p-4", children: /* @__PURE__ */ jsx9(AppInfo, {}) }),
516
+ /* @__PURE__ */ jsx9("div", { className: "self-center flex flex-col gap-2 w-60", children: /* @__PURE__ */ jsx9(
517
+ Button,
518
+ {
519
+ variant: "secondary",
520
+ className: "self-auto flex justify-center",
521
+ disabled: userAccount.status === "connecting",
522
+ onClick: openConnectModal,
523
+ autoFocus: true,
524
+ children: "Connect wallet"
525
+ },
526
+ "create"
527
+ ) })
528
+ ]
529
+ }
530
+ );
531
+ }
532
+
533
+ // src/onboarding/ConnectedSteps.tsx
534
+ import { useEffect as useEffect7, useMemo as useMemo2, useRef as useRef2, useState as useState3 } from "react";
535
+ import { twMerge as twMerge7 } from "tailwind-merge";
536
+
537
+ // src/onboarding/common.ts
538
+ import { parseEther as parseEther2 } from "viem";
539
+ var minGasBalance = parseEther2("0.01");
540
+
541
+ // src/onboarding/quarry/useAllowance.ts
542
+ import { useClient } from "wagmi";
543
+ import { queryOptions, useQuery as useQuery2 } from "@tanstack/react-query";
544
+
545
+ // src/quarry/getAllowance.ts
546
+ import { numberToHex as numberToHex2 } from "viem";
547
+
548
+ // src/quarry/common.ts
549
+ import { defineStore } from "@latticexyz/store";
550
+ import { parseAbi } from "viem";
551
+ var paymasterAbi = parseAbi([
552
+ "error SpenderSystem_AlreadyRegistered(address spender, address user)",
553
+ "error SpenderSystem_HasOwnBalance(address spender)",
554
+ "function registerSpender(address spender)"
555
+ ]);
556
+ var paymasterConfig = defineStore({
557
+ namespaces: {
558
+ root: {
559
+ namespace: "",
560
+ tables: {
561
+ Allowance: {
562
+ schema: {
563
+ user: "address",
564
+ allowance: "uint256"
565
+ },
566
+ key: ["user"]
567
+ },
568
+ Grantor: {
569
+ schema: {
570
+ grantor: "address",
571
+ allowance: "uint256"
572
+ },
573
+ key: ["grantor"]
574
+ },
575
+ PassHolder: {
576
+ schema: {
577
+ user: "address",
578
+ passId: "bytes32",
579
+ lastRenewed: "uint256",
580
+ lastClaimed: "uint256"
581
+ },
582
+ key: ["user", "passId"]
583
+ },
584
+ PassConfig: {
585
+ schema: {
586
+ passId: "bytes32",
587
+ claimAmount: "uint256",
588
+ claimInterval: "uint256",
589
+ validityPeriod: "uint256",
590
+ grantor: "address"
591
+ },
592
+ key: ["passId"]
593
+ },
594
+ Spender: {
595
+ schema: {
596
+ spender: "address",
597
+ user: "address"
598
+ },
599
+ key: ["spender"]
600
+ },
601
+ SystemConfig: {
602
+ schema: {
603
+ entryPoint: "address"
604
+ },
605
+ key: []
606
+ }
607
+ }
608
+ }
511
609
  }
512
- }
513
-
514
- @media (min-width: 1024px) {
515
-
516
- .container {
517
- max-width: 1024px;
610
+ });
611
+ var paymasterTables = paymasterConfig.namespaces.root.tables;
612
+
613
+ // src/quarry/getAllowance.ts
614
+ import { getRecord, getStaticDataLocation } from "@latticexyz/store/internal";
615
+ import { getKeyTuple } from "@latticexyz/protocol-parser/internal";
616
+ import { setStorageAt } from "viem/actions";
617
+
618
+ // src/getPaymaster.ts
619
+ function getPaymaster(chain) {
620
+ const contracts = chain.contracts ?? {};
621
+ if ("quarryPaymaster" in contracts && contracts.quarryPaymaster != null) {
622
+ if ("address" in contracts.quarryPaymaster) {
623
+ return {
624
+ type: "quarry",
625
+ address: contracts.quarryPaymaster.address
626
+ };
627
+ }
518
628
  }
519
- }
520
-
521
- @media (min-width: 1280px) {
522
-
523
- .container {
524
- max-width: 1280px;
629
+ if ("paymaster" in contracts && contracts.paymaster != null) {
630
+ if ("address" in contracts.paymaster) {
631
+ return {
632
+ type: "simple",
633
+ address: contracts.paymaster.address
634
+ };
635
+ }
525
636
  }
526
637
  }
527
638
 
528
- @media (min-width: 1536px) {
529
-
530
- .container {
531
- max-width: 1536px;
639
+ // src/quarry/getAllowance.ts
640
+ async function getAllowance({ client, userAddress }) {
641
+ const paymaster = getPaymaster(client.chain);
642
+ if (paymaster?.type !== "quarry") return null;
643
+ const record = await getRecord(client, {
644
+ address: paymaster.address,
645
+ table: paymasterTables.Allowance,
646
+ key: { user: userAddress },
647
+ blockTag: "pending"
648
+ });
649
+ return record.allowance;
650
+ }
651
+ async function setAllowanceSlot({ client, userAddress, allowance }) {
652
+ const paymaster = getPaymaster(client.chain);
653
+ if (paymaster?.type !== "quarry") return;
654
+ const slot = getStaticDataLocation(
655
+ paymasterTables.Allowance.tableId,
656
+ getKeyTuple(paymasterTables.Allowance, { user: userAddress })
657
+ );
658
+ await setStorageAt(
659
+ client.extend(() => ({ mode: "anvil" })),
660
+ {
661
+ address: paymaster.address,
662
+ index: slot,
663
+ value: numberToHex2(allowance, { size: 32 })
664
+ }
665
+ );
666
+ }
667
+
668
+ // src/onboarding/quarry/useAllowance.ts
669
+ function getAllowanceQueryOptions({
670
+ client,
671
+ userAddress
672
+ }) {
673
+ const queryKey = ["getAllowance", client?.uid, userAddress];
674
+ return queryOptions(
675
+ client && userAddress ? {
676
+ queryKey,
677
+ queryFn: () => getAllowance({ client, userAddress })
678
+ } : { queryKey, enabled: false }
679
+ );
680
+ }
681
+ function useAllowance(userAddress) {
682
+ const { chainId } = useEntryKitConfig();
683
+ const client = useClient({ chainId });
684
+ return useQuery2(getAllowanceQueryOptions({ client, userAddress }));
685
+ }
686
+
687
+ // src/onboarding/quarry/useSpender.ts
688
+ import { useClient as useClient2 } from "wagmi";
689
+ import { queryOptions as queryOptions2, useQuery as useQuery3 } from "@tanstack/react-query";
690
+
691
+ // src/onboarding/quarry/getSpender.ts
692
+ import { getRecord as getRecord2 } from "@latticexyz/store/internal";
693
+ async function getSpender({ client, userAddress, sessionAddress }) {
694
+ const paymaster = getPaymaster(client.chain);
695
+ if (paymaster?.type !== "quarry") return null;
696
+ const record = await getRecord2(client, {
697
+ address: paymaster.address,
698
+ table: paymasterTables.Spender,
699
+ key: { spender: sessionAddress },
700
+ blockTag: "pending"
701
+ });
702
+ return record.user.toLowerCase() === userAddress.toLowerCase();
703
+ }
704
+
705
+ // src/onboarding/quarry/useSpender.ts
706
+ function getSpenderQueryOptions({
707
+ client,
708
+ userAddress,
709
+ sessionAddress
710
+ }) {
711
+ const queryKey = ["getSpender", client?.uid, userAddress, sessionAddress];
712
+ return queryOptions2(
713
+ client && userAddress && sessionAddress ? {
714
+ queryKey,
715
+ queryFn: () => getSpender({ client, userAddress, sessionAddress })
716
+ } : { queryKey, enabled: false }
717
+ );
718
+ }
719
+
720
+ // src/onboarding/useDelegation.ts
721
+ import { useClient as useClient3 } from "wagmi";
722
+ import { queryOptions as queryOptions3, useQuery as useQuery4 } from "@tanstack/react-query";
723
+
724
+ // src/onboarding/getDelegation.ts
725
+ import { getRecord as getRecord3 } from "@latticexyz/store/internal";
726
+
727
+ // src/common.ts
728
+ import { resourceToHex } from "@latticexyz/common";
729
+ import { parseAbi as parseAbi2 } from "viem";
730
+ import worldConfig from "@latticexyz/world/mud.config";
731
+ var defaultClientConfig = {
732
+ pollingInterval: 250
733
+ };
734
+ var unlimitedDelegationControlId = resourceToHex({ type: "system", namespace: "", name: "unlimited" });
735
+ var worldTables = worldConfig.namespaces.world.tables;
736
+ var worldAbi = parseAbi2([
737
+ "function registerDelegation(address delegatee, bytes32 delegationControlId, bytes initCallData)"
738
+ ]);
739
+
740
+ // src/onboarding/getDelegation.ts
741
+ async function getDelegation({ client, worldAddress, userAddress, sessionAddress }) {
742
+ const record = await getRecord3(client, {
743
+ address: worldAddress,
744
+ table: worldTables.UserDelegationControl,
745
+ key: { delegator: userAddress, delegatee: sessionAddress },
746
+ blockTag: "pending"
747
+ });
748
+ return record.delegationControlId === unlimitedDelegationControlId;
749
+ }
750
+
751
+ // src/onboarding/useDelegation.ts
752
+ function getDelegationQueryOptions({
753
+ client,
754
+ worldAddress,
755
+ userAddress,
756
+ sessionAddress
757
+ }) {
758
+ const queryKey = ["getDelegation", client?.uid, worldAddress, userAddress, sessionAddress];
759
+ return queryOptions3(
760
+ client && userAddress && sessionAddress ? {
761
+ queryKey,
762
+ queryFn: () => getDelegation({ client, worldAddress, userAddress, sessionAddress })
763
+ } : { queryKey, enabled: false }
764
+ );
765
+ }
766
+
767
+ // src/onboarding/usePrerequisites.ts
768
+ import { queryOptions as queryOptions5, useQuery as useQuery6, useQueryClient } from "@tanstack/react-query";
769
+ import { useClient as useClient5, useConfig } from "wagmi";
770
+
771
+ // src/useSessionAccount.ts
772
+ import { useClient as useClient4 } from "wagmi";
773
+ import { queryOptions as queryOptions4, useQuery as useQuery5 } from "@tanstack/react-query";
774
+
775
+ // src/getSessionAccount.ts
776
+ import { toSimpleSmartAccount } from "permissionless/accounts";
777
+
778
+ // src/getSessionSigner.ts
779
+ import { isHex } from "viem";
780
+
781
+ // src/store.ts
782
+ import { createStore as createStore2 } from "zustand/vanilla";
783
+ import { persist } from "zustand/middleware";
784
+ var store2 = createStore2(
785
+ persist(
786
+ () => ({
787
+ signers: {}
788
+ }),
789
+ {
790
+ name: "mud:entrykit",
791
+ partialize: ({ signers }) => ({ signers })
792
+ }
793
+ )
794
+ );
795
+ function listener(event) {
796
+ if (event.key === store2.persist.getOptions().name) {
797
+ store2.persist.rehydrate();
532
798
  }
533
799
  }
534
-
535
- .grid-cols-2.divide-y > :not([hidden]) ~ :not([hidden]):nth-child(-n + 2) {
536
- border-top-width: 0;
537
- border-bottom-width: 0;
538
- }
539
-
540
- .sr-only {
541
- position: absolute;
542
- width: 1px;
543
- height: 1px;
544
- padding: 0;
545
- margin: -1px;
546
- overflow: hidden;
547
- clip: rect(0, 0, 0, 0);
548
- white-space: nowrap;
549
- border-width: 0;
550
- }
551
-
552
- .pointer-events-none {
553
- pointer-events: none;
554
- }
555
-
556
- .pointer-events-auto {
557
- pointer-events: auto;
558
- }
559
-
560
- .fixed {
561
- position: fixed;
562
- }
563
-
564
- .absolute {
565
- position: absolute;
566
- }
567
-
568
- .relative {
569
- position: relative;
570
- }
571
-
572
- .inset-0 {
573
- inset: 0px;
574
- }
575
-
576
- .right-0 {
577
- right: 0px;
578
- }
579
-
580
- .top-0 {
581
- top: 0px;
582
- }
583
-
584
- .col-start-1 {
585
- grid-column-start: 1;
586
- }
587
-
588
- .row-start-1 {
589
- grid-row-start: 1;
590
- }
591
-
592
- .m-0 {
593
- margin: 0px;
594
- }
595
-
596
- .m-2 {
597
- margin: 0.5rem;
598
- }
599
-
600
- .-mx-0\\.5 {
601
- margin-left: -0.125rem;
602
- margin-right: -0.125rem;
603
- }
604
-
605
- .-my-1 {
606
- margin-top: -0.25rem;
607
- margin-bottom: -0.25rem;
608
- }
609
-
610
- .-my-\\[0\\.125em\\] {
611
- margin-top: -0.125em;
612
- margin-bottom: -0.125em;
613
- }
614
-
615
- .mx-auto {
616
- margin-left: auto;
617
- margin-right: auto;
618
- }
619
-
620
- .-ml-3 {
621
- margin-left: -0.75rem;
622
- }
623
-
624
- .block {
625
- display: block;
626
- }
627
-
628
- .flex {
629
- display: flex;
630
- }
631
-
632
- .inline-flex {
633
- display: inline-flex;
634
- }
635
-
636
- .table {
637
- display: table;
638
- }
639
-
640
- .grid {
641
- display: grid;
642
- }
643
-
644
- .inline-grid {
645
- display: inline-grid;
646
- }
647
-
648
- .contents {
649
- display: contents;
650
- }
651
-
652
- .h-16 {
653
- height: 4rem;
654
- }
655
-
656
- .h-4 {
657
- height: 1rem;
658
- }
659
-
660
- .h-6 {
661
- height: 1.5rem;
662
- }
663
-
664
- .h-\\[1\\.25em\\] {
665
- height: 1.25em;
666
- }
667
-
668
- .h-\\[1em\\] {
669
- height: 1em;
670
- }
671
-
672
- .h-full {
673
- height: 100%;
674
- }
675
-
676
- .max-h-32 {
677
- max-height: 8rem;
678
- }
679
-
680
- .min-h-\\[22rem\\] {
681
- min-height: 22rem;
682
- }
683
-
684
- .min-h-\\[26rem\\] {
685
- min-height: 26rem;
686
- }
687
-
688
- .w-16 {
689
- width: 4rem;
690
- }
691
-
692
- .w-28 {
693
- width: 7rem;
694
- }
695
-
696
- .w-4 {
697
- width: 1rem;
698
- }
699
-
700
- .w-48 {
701
- width: 12rem;
702
- }
703
-
704
- .w-6 {
705
- width: 1.5rem;
706
- }
707
-
708
- .w-60 {
709
- width: 15rem;
710
- }
711
-
712
- .w-\\[0\\.6em\\] {
713
- width: 0.6em;
714
- }
715
-
716
- .w-\\[1\\.25em\\] {
717
- width: 1.25em;
718
- }
719
-
720
- .w-full {
721
- width: 100%;
722
- }
723
-
724
- .max-w-\\[26rem\\] {
725
- max-width: 26rem;
726
- }
727
-
728
- .flex-shrink-0 {
729
- flex-shrink: 0;
730
- }
731
-
732
- .flex-grow {
733
- flex-grow: 1;
734
- }
735
-
736
- .translate-x-2 {
737
- --tw-translate-x: 0.5rem;
738
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
739
- }
740
-
741
- .scale-100 {
742
- --tw-scale-x: 1;
743
- --tw-scale-y: 1;
744
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
745
- }
746
-
747
- .scale-50 {
748
- --tw-scale-x: .5;
749
- --tw-scale-y: .5;
750
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
751
- }
752
-
753
- @keyframes spin {
754
-
755
- to {
756
- transform: rotate(360deg);
800
+ window.addEventListener("storage", listener);
801
+
802
+ // src/getSessionSigner.ts
803
+ import { generatePrivateKey, privateKeyToAccount as privateKeyToAccount2 } from "viem/accounts";
804
+ function getSessionSigner(userAddress) {
805
+ const label = userAddress.toLowerCase();
806
+ const sessionSignerPrivateKey = store2.getState().signers[label] ?? (() => {
807
+ const deprecatedPrivateKey = localStorage.getItem(`mud:appSigner:privateKey:${userAddress.toLowerCase()}`)?.replace(/^"(.*)"$/, "$1");
808
+ const privateKey = isHex(deprecatedPrivateKey) ? deprecatedPrivateKey : generatePrivateKey();
809
+ store2.setState((state) => ({
810
+ signers: {
811
+ ...state.signers,
812
+ [label]: privateKey
813
+ }
814
+ }));
815
+ return privateKey;
816
+ })();
817
+ return privateKeyToAccount2(sessionSignerPrivateKey);
818
+ }
819
+
820
+ // src/getSessionAccount.ts
821
+ async function getSessionAccount({
822
+ client,
823
+ userAddress
824
+ }) {
825
+ const signer = getSessionSigner(userAddress);
826
+ const account = await toSimpleSmartAccount({ client, owner: signer });
827
+ return account;
828
+ }
829
+
830
+ // src/useSessionAccount.ts
831
+ function getSessionAccountQueryOptions({
832
+ client,
833
+ userAddress
834
+ }) {
835
+ const queryKey = ["getSessionAccount", client?.uid, userAddress];
836
+ return queryOptions4(
837
+ client && userAddress ? {
838
+ queryKey,
839
+ queryFn: () => getSessionAccount({ client, userAddress }),
840
+ staleTime: Infinity,
841
+ // TODO: replace with function to retry only connection errors
842
+ retry: false
843
+ } : { queryKey, enabled: false }
844
+ );
845
+ }
846
+
847
+ // src/onboarding/usePrerequisites.ts
848
+ import { getBalanceQueryOptions } from "wagmi/query";
849
+ function getPrequisitesQueryOptions({
850
+ queryClient,
851
+ config,
852
+ client,
853
+ userAddress,
854
+ worldAddress
855
+ }) {
856
+ const queryKey = ["getPrerequisites", client?.uid, userAddress];
857
+ return queryOptions5(
858
+ client && userAddress ? {
859
+ queryKey,
860
+ async queryFn() {
861
+ const paymaster = getPaymaster(client.chain);
862
+ const { address: sessionAddress } = await queryClient.fetchQuery(
863
+ getSessionAccountQueryOptions({ client, userAddress })
864
+ );
865
+ const [sessionBalance, allowance, spender, hasDelegation] = await Promise.all([
866
+ !paymaster ? queryClient.fetchQuery(
867
+ getBalanceQueryOptions(config, { chainId: client.chain.id, address: sessionAddress })
868
+ ) : null,
869
+ paymaster?.type === "quarry" ? queryClient.fetchQuery(getAllowanceQueryOptions({ client, userAddress })) : null,
870
+ paymaster?.type === "quarry" ? queryClient.fetchQuery(getSpenderQueryOptions({ client, userAddress, sessionAddress })) : null,
871
+ queryClient.fetchQuery(getDelegationQueryOptions({ client, worldAddress, userAddress, sessionAddress }))
872
+ ]);
873
+ const hasAllowance = allowance == null || allowance >= minGasBalance;
874
+ const isSpender = spender == null ? true : spender;
875
+ const hasGasBalance = sessionBalance == null || sessionBalance.value >= minGasBalance;
876
+ return {
877
+ sessionAddress,
878
+ hasAllowance,
879
+ isSpender,
880
+ hasGasBalance,
881
+ hasDelegation,
882
+ complete: hasAllowance && isSpender && hasDelegation
883
+ };
884
+ },
885
+ retry: false
886
+ } : { queryKey, enabled: false }
887
+ );
888
+ }
889
+ function usePrerequisites(userAddress) {
890
+ const queryClient = useQueryClient();
891
+ const config = useConfig();
892
+ const { chainId, worldAddress } = useEntryKitConfig();
893
+ const client = useClient5({ chainId });
894
+ const prereqs = useQuery6(
895
+ getPrequisitesQueryOptions({
896
+ queryClient,
897
+ config,
898
+ client,
899
+ userAddress,
900
+ worldAddress
901
+ }),
902
+ queryClient
903
+ );
904
+ return prereqs;
905
+ }
906
+
907
+ // src/onboarding/Wallet.tsx
908
+ import { useDisconnect } from "wagmi";
909
+
910
+ // src/useENS.ts
911
+ import { useQuery as useQuery7 } from "@tanstack/react-query";
912
+ function useENS(address) {
913
+ const normalizedAddress = address?.toLowerCase();
914
+ return useQuery7({
915
+ enabled: !!normalizedAddress,
916
+ queryKey: ["ens", normalizedAddress],
917
+ queryFn: async () => {
918
+ const data = await fetch(`https://api.ensideas.com/ens/resolve/${normalizedAddress}`).then((res) => res.json());
919
+ return {
920
+ address: data.address ?? void 0,
921
+ name: data.name ?? void 0,
922
+ displayName: data.displayName ?? void 0,
923
+ avatar: data.avatar ?? void 0
924
+ };
925
+ }
926
+ });
927
+ }
928
+
929
+ // src/ui/TruncatedHex.tsx
930
+ import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
931
+ function TruncatedHex({ hex }) {
932
+ if (hex.length <= 10) {
933
+ return /* @__PURE__ */ jsx10("span", { title: hex, children: hex });
757
934
  }
758
- }
759
-
760
- .animate-spin {
761
- animation: spin 1s linear infinite;
762
- }
763
-
764
- .cursor-pointer {
765
- cursor: pointer;
766
- }
767
-
768
- .grid-cols-\\[1fr_auto_1fr\\] {
769
- grid-template-columns: 1fr auto 1fr;
770
- }
771
-
772
- .flex-col {
773
- flex-direction: column;
774
- }
775
-
776
- .place-items-center {
777
- place-items: center;
778
- }
779
-
780
- .items-end {
781
- align-items: flex-end;
782
- }
783
-
784
- .items-center {
785
- align-items: center;
786
- }
787
-
788
- .justify-end {
789
- justify-content: flex-end;
790
- }
791
-
792
- .justify-center {
793
- justify-content: center;
794
- }
795
-
796
- .justify-between {
797
- justify-content: space-between;
798
- }
799
-
800
- .gap-1 {
801
- gap: 0.25rem;
802
- }
803
-
804
- .gap-2 {
805
- gap: 0.5rem;
806
- }
807
-
808
- .gap-2\\.5 {
809
- gap: 0.625rem;
810
- }
811
-
812
- .gap-4 {
813
- gap: 1rem;
814
- }
815
-
816
- .gap-6 {
817
- gap: 1.5rem;
818
- }
819
-
820
- .divide-y > :not([hidden]) ~ :not([hidden]) {
821
- --tw-divide-y-reverse: 0;
822
- border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
823
- border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
824
- }
825
-
826
- .divide-neutral-700 > :not([hidden]) ~ :not([hidden]) {
827
- --tw-divide-opacity: 1;
828
- border-color: rgb(64 64 64 / var(--tw-divide-opacity));
829
- }
830
-
831
- .divide-neutral-800 > :not([hidden]) ~ :not([hidden]) {
832
- --tw-divide-opacity: 1;
833
- border-color: rgb(38 38 38 / var(--tw-divide-opacity));
834
- }
835
-
836
- .self-auto {
837
- align-self: auto;
838
- }
839
-
840
- .self-end {
841
- align-self: flex-end;
842
- }
843
-
844
- .self-center {
845
- align-self: center;
846
- }
847
-
848
- .overflow-y-scroll {
849
- overflow-y: scroll;
850
- }
851
-
852
- .whitespace-break-spaces {
853
- white-space: break-spaces;
854
- }
855
-
856
- .break-all {
857
- word-break: break-all;
858
- }
859
-
860
- .rounded-full {
861
- border-radius: 9999px;
862
- }
863
-
864
- .border {
865
- border-width: 1px;
866
- }
867
-
868
- .border-4 {
869
- border-width: 4px;
870
- }
871
-
872
- .border-l-4 {
873
- border-left-width: 4px;
874
- }
875
-
876
- .border-neutral-300 {
877
- --tw-border-opacity: 1;
878
- border-color: rgb(212 212 212 / var(--tw-border-opacity));
879
- }
880
-
881
- .border-red-500 {
882
- --tw-border-opacity: 1;
883
- border-color: rgb(239 68 68 / var(--tw-border-opacity));
884
- }
885
-
886
- .border-transparent {
887
- border-color: transparent;
888
- }
889
-
890
- .bg-black\\/10 {
891
- background-color: rgb(0 0 0 / 0.1);
892
- }
893
-
894
- .bg-neutral-100 {
895
- --tw-bg-opacity: 1;
896
- background-color: rgb(245 245 245 / var(--tw-bg-opacity));
897
- }
898
-
899
- .bg-neutral-700 {
900
- --tw-bg-opacity: 1;
901
- background-color: rgb(64 64 64 / var(--tw-bg-opacity));
902
- }
903
-
904
- .bg-neutral-800 {
905
- --tw-bg-opacity: 1;
906
- background-color: rgb(38 38 38 / var(--tw-bg-opacity));
907
- }
908
-
909
- .bg-neutral-800\\/85 {
910
- background-color: rgb(38 38 38 / 0.85);
911
- }
912
-
913
- .bg-neutral-900 {
914
- --tw-bg-opacity: 1;
915
- background-color: rgb(23 23 23 / var(--tw-bg-opacity));
916
- }
917
-
918
- .bg-orange-500 {
919
- --tw-bg-opacity: 1;
920
- background-color: rgb(249 115 22 / var(--tw-bg-opacity));
921
- }
922
-
923
- .bg-orange-600 {
924
- --tw-bg-opacity: 1;
925
- background-color: rgb(234 88 12 / var(--tw-bg-opacity));
926
- }
927
-
928
- .bg-red-100 {
929
- --tw-bg-opacity: 1;
930
- background-color: rgb(254 226 226 / var(--tw-bg-opacity));
931
- }
932
-
933
- .bg-cover {
934
- background-size: cover;
935
- }
936
-
937
- .bg-center {
938
- background-position: center;
939
- }
940
-
941
- .bg-no-repeat {
942
- background-repeat: no-repeat;
943
- }
944
-
945
- .object-cover {
946
- object-fit: cover;
947
- }
948
-
949
- .p-1 {
950
- padding: 0.25rem;
951
- }
952
-
953
- .p-2 {
954
- padding: 0.5rem;
955
- }
956
-
957
- .p-3 {
958
- padding: 0.75rem;
959
- }
960
-
961
- .p-4 {
962
- padding: 1rem;
963
- }
964
-
965
- .p-5 {
966
- padding: 1.25rem;
967
- }
968
-
969
- .p-6 {
970
- padding: 1.5rem;
971
- }
972
-
973
- .p-\\[\\.75em\\] {
974
- padding: .75em;
975
- }
976
-
977
- .px-3 {
978
- padding-left: 0.75rem;
979
- padding-right: 0.75rem;
980
- }
981
-
982
- .px-8 {
983
- padding-left: 2rem;
984
- padding-right: 2rem;
985
- }
986
-
987
- .py-2 {
988
- padding-top: 0.5rem;
989
- padding-bottom: 0.5rem;
990
- }
991
-
992
- .py-8 {
993
- padding-top: 2rem;
994
- padding-bottom: 2rem;
995
- }
996
-
997
- .text-left {
998
- text-align: left;
999
- }
1000
-
1001
- .text-center {
1002
- text-align: center;
1003
- }
1004
-
1005
- .font-mono {
1006
- font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
1007
- }
1008
-
1009
- .text-2xl {
1010
- font-size: 1.5rem;
1011
- line-height: 2rem;
1012
- }
1013
-
1014
- .text-\\[\\.75em\\] {
1015
- font-size: .75em;
1016
- }
1017
-
1018
- .text-base {
1019
- font-size: 1rem;
1020
- line-height: 1.5rem;
1021
- }
1022
-
1023
- .text-sm {
1024
- font-size: 0.875rem;
1025
- line-height: 1.25rem;
1026
- }
1027
-
1028
- .text-xs {
1029
- font-size: 0.75rem;
1030
- line-height: 1rem;
1031
- }
1032
-
1033
- .font-medium {
1034
- font-weight: 500;
1035
- }
1036
-
1037
- .font-semibold {
1038
- font-weight: 600;
1039
- }
1040
-
1041
- .leading-none {
1042
- line-height: 1;
1043
- }
1044
-
1045
- .tracking-\\[-1ch\\] {
1046
- letter-spacing: -1ch;
1047
- }
1048
-
1049
- .text-black {
1050
- --tw-text-opacity: 1;
1051
- color: rgb(0 0 0 / var(--tw-text-opacity));
1052
- }
1053
-
1054
- .text-neutral-400 {
1055
- --tw-text-opacity: 1;
1056
- color: rgb(163 163 163 / var(--tw-text-opacity));
1057
- }
1058
-
1059
- .text-neutral-500 {
1060
- --tw-text-opacity: 1;
1061
- color: rgb(115 115 115 / var(--tw-text-opacity));
1062
- }
1063
-
1064
- .text-neutral-700 {
1065
- --tw-text-opacity: 1;
1066
- color: rgb(64 64 64 / var(--tw-text-opacity));
1067
- }
1068
-
1069
- .text-orange-500 {
1070
- --tw-text-opacity: 1;
1071
- color: rgb(249 115 22 / var(--tw-text-opacity));
1072
- }
1073
-
1074
- .text-red-900 {
1075
- --tw-text-opacity: 1;
1076
- color: rgb(127 29 29 / var(--tw-text-opacity));
1077
- }
1078
-
1079
- .text-transparent {
1080
- color: transparent;
1081
- }
1082
-
1083
- .text-white {
1084
- --tw-text-opacity: 1;
1085
- color: rgb(255 255 255 / var(--tw-text-opacity));
1086
- }
1087
-
1088
- .opacity-0 {
1089
- opacity: 0;
1090
- }
1091
-
1092
- .opacity-100 {
1093
- opacity: 1;
1094
- }
1095
-
1096
- .opacity-25 {
1097
- opacity: 0.25;
1098
- }
1099
-
1100
- .opacity-30 {
1101
- opacity: 0.3;
1102
- }
1103
-
1104
- .opacity-75 {
1105
- opacity: 0.75;
1106
- }
1107
-
1108
- .outline-none {
1109
- outline: 2px solid transparent;
1110
- outline-offset: 2px;
1111
- }
1112
-
1113
- .ring-1 {
1114
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1115
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
1116
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
1117
- }
1118
-
1119
- .ring-neutral-700\\/50 {
1120
- --tw-ring-color: rgb(64 64 64 / 0.5);
1121
- }
1122
-
1123
- .filter {
1124
- filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
1125
- }
1126
-
1127
- .transition {
1128
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
1129
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
1130
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
1131
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1132
- transition-duration: 150ms;
1133
- }
1134
-
1135
- .duration-100 {
1136
- transition-duration: 100ms;
1137
- }
1138
-
1139
- .duration-300 {
1140
- transition-duration: 300ms;
1141
- }
1142
-
1143
- @keyframes enter {
1144
-
1145
- from {
1146
- opacity: var(--tw-enter-opacity, 1);
1147
- transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));
935
+ return /* @__PURE__ */ jsxs8("span", { title: hex, children: [
936
+ /* @__PURE__ */ jsx10("span", { className: "after:select-none after:content-['\u2026']", children: hex.slice(0, 6) }),
937
+ /* @__PURE__ */ jsx10("span", { className: "tracking-[-1ch] text-transparent", children: hex.slice(6, -4) }),
938
+ hex.slice(-4)
939
+ ] });
940
+ }
941
+
942
+ // src/errors/store.ts
943
+ import { findCause } from "@latticexyz/common";
944
+ import { createStore as createStore3 } from "zustand/vanilla";
945
+ var store3 = createStore3(() => ({
946
+ lastId: 0,
947
+ errors: []
948
+ }));
949
+ function addError({
950
+ error: error2,
951
+ retry,
952
+ dismiss
953
+ }) {
954
+ if (findCause(error2, ({ name }) => name === "UserRejectedRequestError")) {
955
+ return;
1148
956
  }
1149
- }
1150
-
1151
- @keyframes exit {
1152
-
1153
- to {
1154
- opacity: var(--tw-exit-opacity, 1);
1155
- transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0));
957
+ store3.setState((state) => {
958
+ if (state.errors.some((e) => e.error === error2)) {
959
+ return {};
960
+ }
961
+ const id = state.lastId + 1;
962
+ return {
963
+ lastId: id,
964
+ errors: [
965
+ ...state.errors,
966
+ {
967
+ id,
968
+ error: error2,
969
+ dismiss: dismiss ? () => {
970
+ removeError(error2);
971
+ dismiss();
972
+ } : void 0,
973
+ retry: retry ? async () => {
974
+ removeError(error2);
975
+ await retry();
976
+ } : void 0
977
+ }
978
+ ]
979
+ };
980
+ });
981
+ return () => {
982
+ removeError(error2);
983
+ };
984
+ }
985
+ function removeError(error2) {
986
+ store3.setState((state) => ({
987
+ errors: state.errors.filter((e) => e.error !== error2)
988
+ }));
989
+ }
990
+
991
+ // src/errors/useShowMutationError.ts
992
+ import { useEffect as useEffect3 } from "react";
993
+ function useShowMutationError(result) {
994
+ const { error: error2, reset } = result;
995
+ useEffect3(() => {
996
+ if (!error2) return;
997
+ return addError({ error: error2, dismiss: reset });
998
+ }, [error2, reset]);
999
+ return result;
1000
+ }
1001
+
1002
+ // src/onboarding/Wallet.tsx
1003
+ import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
1004
+ function Wallet({ isActive, isExpanded, userAddress }) {
1005
+ const { data: ens } = useENS(userAddress);
1006
+ const { disconnect, isPending: disconnectIsPending } = useShowMutationError(useDisconnect());
1007
+ const { closeAccountModal } = useAccountModal();
1008
+ return /* @__PURE__ */ jsxs9("div", { className: "flex flex-col gap-4", children: [
1009
+ /* @__PURE__ */ jsxs9("div", { className: "flex justify-between gap-4", children: [
1010
+ /* @__PURE__ */ jsxs9("div", { children: [
1011
+ /* @__PURE__ */ jsx11("div", { children: "Account" }),
1012
+ /* @__PURE__ */ jsx11("div", { className: "font-mono text-white", children: ens?.name ?? /* @__PURE__ */ jsx11(TruncatedHex, { hex: userAddress }) })
1013
+ ] }),
1014
+ /* @__PURE__ */ jsx11(
1015
+ Button,
1016
+ {
1017
+ variant: isActive ? "primary" : "tertiary",
1018
+ className: "flex-shrink-0 text-sm p-1 w-28",
1019
+ autoFocus: isActive,
1020
+ pending: disconnectIsPending,
1021
+ onClick: () => {
1022
+ closeAccountModal();
1023
+ disconnect();
1024
+ },
1025
+ children: "Sign out"
1026
+ }
1027
+ )
1028
+ ] }),
1029
+ isExpanded ? /* @__PURE__ */ jsx11("p", { className: "text-sm", children: "Each of your onchain actions in this app is associated with your account." }) : null
1030
+ ] });
1031
+ }
1032
+
1033
+ // src/onboarding/quarry/useClaimGasPass.ts
1034
+ import { parseEther as parseEther3 } from "viem";
1035
+ import { useMutation, useQueryClient as useQueryClient2 } from "@tanstack/react-query";
1036
+
1037
+ // src/quarry/transports/quarryPassIssuer.ts
1038
+ import { http as http2 } from "viem";
1039
+ function quarryPassIssuer() {
1040
+ return ({ chain }) => {
1041
+ if (!chain) throw new Error("No chain provided to issuer transport.");
1042
+ const url = "quarryPassIssuer" in chain.rpcUrls ? chain.rpcUrls.quarryPassIssuer.http[0] : void 0;
1043
+ if (!url) throw new Error(`No \`quarryPassIssuer\` RPC URL found for chain ${chain.id}.`);
1044
+ return http2(url)({ chain, retryCount: 0 });
1045
+ };
1046
+ }
1047
+
1048
+ // src/quarry/claimGasPass.ts
1049
+ async function claimGasPass({ chain, userAddress }) {
1050
+ const transport = quarryPassIssuer()({ chain });
1051
+ debug2("Issuing gas pass to", userAddress);
1052
+ await transport.request({
1053
+ method: "quarry_issuePass",
1054
+ params: ["0x01", userAddress]
1055
+ });
1056
+ debug2("Claiming gas allowance for", userAddress);
1057
+ await transport.request({
1058
+ method: "quarry_claimAllowance",
1059
+ params: ["0x01", userAddress]
1060
+ });
1061
+ }
1062
+
1063
+ // src/onboarding/quarry/useClaimGasPass.ts
1064
+ import { useClient as useClient6 } from "wagmi";
1065
+ function useClaimGasPass() {
1066
+ const queryClient = useQueryClient2();
1067
+ const { chain } = useEntryKitConfig();
1068
+ const client = useClient6({ chainId: chain.id });
1069
+ const mutationKey = ["claimGasPass", chain.id];
1070
+ return useMutation({
1071
+ retry: 0,
1072
+ mutationKey,
1073
+ mutationFn: async (userAddress) => {
1074
+ if (chain.id === 31337) {
1075
+ if (!client) throw new Error("No client?");
1076
+ await setAllowanceSlot({ client, userAddress, allowance: parseEther3("1") });
1077
+ } else {
1078
+ await claimGasPass({ chain, userAddress });
1079
+ }
1080
+ await Promise.all([
1081
+ queryClient.invalidateQueries({ queryKey: ["getAllowance"] }),
1082
+ queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] })
1083
+ ]);
1084
+ }
1085
+ });
1086
+ }
1087
+
1088
+ // src/icons/EthIcon.tsx
1089
+ import { twMerge as twMerge6 } from "tailwind-merge";
1090
+ import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
1091
+ function EthIcon({ className, ...props }) {
1092
+ return /* @__PURE__ */ jsxs10(
1093
+ "svg",
1094
+ {
1095
+ xmlns: "http://www.w3.org/2000/svg",
1096
+ viewBox: "0 0 263 428",
1097
+ fill: "currentColor",
1098
+ className: twMerge6("w-[0.6em] h-[1em]", className),
1099
+ ...props,
1100
+ children: [
1101
+ /* @__PURE__ */ jsx12("path", { d: "M132 321V428L263 243L132 321Z" }),
1102
+ /* @__PURE__ */ jsx12("path", { d: "M0 243L132 321V428", fillOpacity: "0.5" }),
1103
+ /* @__PURE__ */ jsx12("path", { d: "M132 0V296L263 218" }),
1104
+ /* @__PURE__ */ jsx12("path", { d: "M0 218L132 296V0L0 218Z", fillOpacity: "0.5" })
1105
+ ]
1106
+ }
1107
+ );
1108
+ }
1109
+
1110
+ // src/formatBalance.ts
1111
+ import { formatEther } from "viem";
1112
+ function formatBalance(wei) {
1113
+ const formatted = formatEther(wei);
1114
+ const magnitude = Math.floor(parseFloat(formatted)).toString().length;
1115
+ return parseFloat(formatted).toLocaleString("en-US", { maximumFractionDigits: Math.max(0, 6 - magnitude) });
1116
+ }
1117
+
1118
+ // src/ui/Balance.tsx
1119
+ import { formatEther as formatEther2 } from "viem";
1120
+ import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
1121
+ function Balance({ wei }) {
1122
+ return /* @__PURE__ */ jsxs11("span", { className: "inline-flex items-center gap-1", title: formatEther2(wei), children: [
1123
+ formatBalance(wei),
1124
+ " ",
1125
+ /* @__PURE__ */ jsx13(EthIcon, {})
1126
+ ] });
1127
+ }
1128
+
1129
+ // src/onboarding/quarry/Allowance.tsx
1130
+ import { useEffect as useEffect5 } from "react";
1131
+
1132
+ // src/errors/useShowQueryError.ts
1133
+ import { useEffect as useEffect4 } from "react";
1134
+ function useShowQueryError(result) {
1135
+ const { error: error2, refetch } = result;
1136
+ useEffect4(() => {
1137
+ if (!error2) return;
1138
+ return addError({ error: error2, retry: refetch, dismiss: () => {
1139
+ } });
1140
+ }, [error2, refetch]);
1141
+ return result;
1142
+ }
1143
+
1144
+ // src/onboarding/quarry/Allowance.tsx
1145
+ import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
1146
+ function Allowance({ isActive, isExpanded, userAddress }) {
1147
+ const allowance = useShowQueryError(useAllowance(userAddress));
1148
+ const claimGasPass2 = useShowMutationError(useClaimGasPass());
1149
+ useEffect5(() => {
1150
+ const timer = setTimeout(() => {
1151
+ if (isActive && claimGasPass2.status === "idle" && allowance.isSuccess && allowance.data != null && allowance.data < minGasBalance) {
1152
+ claimGasPass2.mutate(userAddress);
1153
+ }
1154
+ });
1155
+ return () => clearTimeout(timer);
1156
+ }, [allowance.data, allowance.isSuccess, claimGasPass2, isActive, userAddress]);
1157
+ return /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-4", children: [
1158
+ /* @__PURE__ */ jsxs12("div", { className: "flex justify-between gap-4", children: [
1159
+ /* @__PURE__ */ jsxs12("div", { children: [
1160
+ /* @__PURE__ */ jsx14("div", { children: "Allowance" }),
1161
+ /* @__PURE__ */ jsx14("div", { className: "font-mono text-white", children: allowance.data != null ? /* @__PURE__ */ jsx14(Balance, { wei: allowance.data }) : /* @__PURE__ */ jsx14(PendingIcon, { className: "text-sm" }) })
1162
+ ] }),
1163
+ /* @__PURE__ */ jsx14(
1164
+ Button,
1165
+ {
1166
+ variant: isActive ? "primary" : "tertiary",
1167
+ className: "flex-shrink-0 text-sm p-1 w-28",
1168
+ autoFocus: isActive || isExpanded,
1169
+ pending: allowance.status === "pending" || claimGasPass2.status === "pending",
1170
+ onClick: () => claimGasPass2.mutate(userAddress),
1171
+ children: "Top up"
1172
+ }
1173
+ )
1174
+ ] }),
1175
+ isExpanded ? /* @__PURE__ */ jsx14("p", { className: "text-sm", children: "Your allowance is used to pay for onchain computation." }) : null
1176
+ ] });
1177
+ }
1178
+
1179
+ // src/onboarding/useSetupSession.ts
1180
+ import { encodeFunctionData } from "viem";
1181
+ import { useMutation as useMutation2, useQueryClient as useQueryClient3 } from "@tanstack/react-query";
1182
+ import { getAction as getAction4 } from "viem/utils";
1183
+ import { sendUserOperation as sendUserOperation2, waitForUserOperationReceipt } from "viem/account-abstraction";
1184
+ import { waitForTransactionReceipt as waitForTransactionReceipt2 } from "viem/actions";
1185
+
1186
+ // src/utils/defineCall.ts
1187
+ function defineCall(call) {
1188
+ return call;
1189
+ }
1190
+
1191
+ // src/onboarding/useSetupSession.ts
1192
+ import { useClient as useClient7 } from "wagmi";
1193
+ import { resourceToHex as resourceToHex2 } from "@latticexyz/common";
1194
+ import IBaseWorldAbi from "@latticexyz/world/out/IBaseWorld.sol/IBaseWorld.abi.json";
1195
+
1196
+ // src/utils/callWithSignature.ts
1197
+ import { writeContract as viem_writeContract } from "viem/actions";
1198
+ import { getAction as getAction3 } from "viem/utils";
1199
+
1200
+ // src/utils/signCall.ts
1201
+ import { toHex } from "viem";
1202
+ import { signTypedData } from "viem/actions";
1203
+ import { callWithSignatureTypes } from "@latticexyz/world-module-callwithsignature/internal";
1204
+ import { getRecord as getRecord4 } from "@latticexyz/store/internal";
1205
+ import moduleConfig from "@latticexyz/world-module-callwithsignature/mud.config";
1206
+ import { hexToResource } from "@latticexyz/common";
1207
+ import { getAction as getAction2 } from "viem/utils";
1208
+ async function signCall({
1209
+ userClient,
1210
+ worldAddress,
1211
+ systemId,
1212
+ callData,
1213
+ nonce: initialNonce,
1214
+ client
1215
+ }) {
1216
+ const nonce = initialNonce ?? (client ? (await getRecord4(client, {
1217
+ address: worldAddress,
1218
+ table: moduleConfig.tables.CallWithSignatureNonces,
1219
+ key: { signer: userClient.account.address },
1220
+ blockTag: "pending"
1221
+ })).nonce : 0n);
1222
+ const { namespace: systemNamespace, name: systemName } = hexToResource(systemId);
1223
+ return await getAction2(
1224
+ userClient,
1225
+ signTypedData,
1226
+ "signTypedData"
1227
+ )({
1228
+ account: userClient.account,
1229
+ domain: {
1230
+ verifyingContract: worldAddress,
1231
+ salt: toHex(userClient.chain.id, { size: 32 })
1232
+ },
1233
+ types: callWithSignatureTypes,
1234
+ primaryType: "Call",
1235
+ message: {
1236
+ signer: userClient.account.address,
1237
+ systemNamespace,
1238
+ systemName,
1239
+ callData,
1240
+ nonce
1241
+ }
1242
+ });
1243
+ }
1244
+
1245
+ // src/utils/callWithSignature.ts
1246
+ import CallWithSignatureAbi from "@latticexyz/world-module-callwithsignature/out/CallWithSignatureSystem.sol/CallWithSignatureSystem.abi.json";
1247
+ async function callWithSignature({
1248
+ sessionClient,
1249
+ ...opts
1250
+ }) {
1251
+ const signature = await signCall(opts);
1252
+ return getAction3(
1253
+ sessionClient,
1254
+ viem_writeContract,
1255
+ "writeContract"
1256
+ )({
1257
+ address: opts.worldAddress,
1258
+ abi: CallWithSignatureAbi,
1259
+ functionName: "callWithSignature",
1260
+ args: [opts.userClient.account.address, opts.systemId, opts.callData, signature]
1261
+ });
1262
+ }
1263
+
1264
+ // src/onboarding/useSetupSession.ts
1265
+ function useSetupSession({ userClient }) {
1266
+ const queryClient = useQueryClient3();
1267
+ const { chainId, worldAddress } = useEntryKitConfig();
1268
+ const client = useClient7({ chainId });
1269
+ const mutationKey = ["setupSession", client?.chain.id, userClient.account.address];
1270
+ return useMutation2({
1271
+ retry: 0,
1272
+ mutationKey,
1273
+ mutationFn: async ({
1274
+ sessionClient,
1275
+ registerSpender,
1276
+ registerDelegation
1277
+ }) => {
1278
+ if (!client) throw new Error("Client not ready.");
1279
+ const paymaster = getPaymaster(client.chain);
1280
+ const sessionAddress = sessionClient.account.address;
1281
+ console.log("setting up session");
1282
+ if (userClient.account.type === "smart") {
1283
+ const calls = [];
1284
+ if (registerSpender && paymaster?.type === "quarry") {
1285
+ console.log("registering spender");
1286
+ calls.push(
1287
+ defineCall({
1288
+ to: paymaster.address,
1289
+ abi: paymasterAbi,
1290
+ functionName: "registerSpender",
1291
+ args: [sessionAddress]
1292
+ })
1293
+ );
1294
+ }
1295
+ if (registerDelegation) {
1296
+ console.log("registering delegation");
1297
+ calls.push(
1298
+ defineCall({
1299
+ to: worldAddress,
1300
+ abi: worldAbi,
1301
+ functionName: "registerDelegation",
1302
+ args: [sessionAddress, unlimitedDelegationControlId, "0x"]
1303
+ })
1304
+ );
1305
+ }
1306
+ if (!calls.length) return;
1307
+ console.log("setting up account with", calls, userClient);
1308
+ const hash = await getAction4(userClient, sendUserOperation2, "sendUserOperation")({ calls });
1309
+ console.log("got user op hash", hash);
1310
+ const receipt = await getAction4(
1311
+ userClient,
1312
+ waitForUserOperationReceipt,
1313
+ "waitForUserOperationReceipt"
1314
+ )({ hash });
1315
+ console.log("got user op receipt", receipt);
1316
+ if (!receipt.success) {
1317
+ console.error("not successful?", receipt);
1318
+ }
1319
+ } else {
1320
+ const txs = [];
1321
+ if (registerSpender && paymaster?.type === "quarry") {
1322
+ console.log("registering spender");
1323
+ const tx = await callWithSignature({
1324
+ client,
1325
+ userClient,
1326
+ sessionClient,
1327
+ worldAddress: paymaster.address,
1328
+ systemId: resourceToHex2({ type: "system", namespace: "", name: "SpenderSystem" }),
1329
+ callData: encodeFunctionData({
1330
+ abi: paymasterAbi,
1331
+ functionName: "registerSpender",
1332
+ args: [sessionAddress]
1333
+ })
1334
+ });
1335
+ console.log("got spender tx", tx);
1336
+ txs.push(tx);
1337
+ }
1338
+ if (registerDelegation) {
1339
+ console.log("registering delegation");
1340
+ const tx = await callWithSignature({
1341
+ client,
1342
+ userClient,
1343
+ sessionClient,
1344
+ worldAddress,
1345
+ systemId: resourceToHex2({ type: "system", namespace: "", name: "Registration" }),
1346
+ callData: encodeFunctionData({
1347
+ abi: IBaseWorldAbi,
1348
+ functionName: "registerDelegation",
1349
+ args: [sessionAddress, unlimitedDelegationControlId, "0x"]
1350
+ })
1351
+ });
1352
+ console.log("got delegation tx", tx);
1353
+ txs.push(tx);
1354
+ }
1355
+ if (!txs.length) return;
1356
+ console.log("waiting for", txs.length, "receipts");
1357
+ for (const hash of txs) {
1358
+ const receipt = await getAction4(client, waitForTransactionReceipt2, "waitForTransactionReceipt")({ hash });
1359
+ console.log("got tx receipt", receipt);
1360
+ if (receipt.status === "reverted") {
1361
+ console.error("tx reverted?", receipt);
1362
+ }
1363
+ }
1364
+ }
1365
+ await Promise.all([
1366
+ queryClient.invalidateQueries({ queryKey: ["getSpender"] }),
1367
+ queryClient.invalidateQueries({ queryKey: ["getDelegation"] }),
1368
+ queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] })
1369
+ ]);
1370
+ }
1371
+ });
1372
+ }
1373
+
1374
+ // src/onboarding/Session.tsx
1375
+ import { useEffect as useEffect6 } from "react";
1376
+
1377
+ // src/useSessionClient.ts
1378
+ import { useClient as useClient8 } from "wagmi";
1379
+ import {
1380
+ queryOptions as queryOptions6,
1381
+ useQuery as useQuery8,
1382
+ useQueryClient as useQueryClient4
1383
+ } from "@tanstack/react-query";
1384
+
1385
+ // src/getSessionClient.ts
1386
+ import { smartAccountActions } from "permissionless";
1387
+ import { callFrom } from "@latticexyz/world/internal";
1388
+
1389
+ // src/createBundlerClient.ts
1390
+ import {
1391
+ createBundlerClient as viem_createBundlerClient
1392
+ } from "viem/account-abstraction";
1393
+ var knownChainFees = /* @__PURE__ */ new Set([
1394
+ // anvil hardcodes fee returned by `eth_maxPriorityFeePerGas`
1395
+ // so we have to override it here
1396
+ // https://github.com/foundry-rs/foundry/pull/8081#issuecomment-2402002485
1397
+ 31337,
1398
+ // rhodolite
1399
+ 17420,
1400
+ // garnet
1401
+ 17069,
1402
+ // redstone
1403
+ 690
1404
+ ]);
1405
+ function createBundlerClient(config) {
1406
+ const chain = config.chain ?? config.client?.chain;
1407
+ const paymaster = chain ? getPaymaster(chain) : void 0;
1408
+ return viem_createBundlerClient({
1409
+ ...defaultClientConfig,
1410
+ paymaster: paymaster ? {
1411
+ getPaymasterData: async () => ({
1412
+ paymaster: paymaster.address,
1413
+ paymasterData: "0x"
1414
+ })
1415
+ } : void 0,
1416
+ // TODO: figure out why viem isn't falling back to `chain.fees.estimateFeesPerGas` when this isn't set
1417
+ userOperation: {
1418
+ estimateFeesPerGas: (
1419
+ // TODO: move this to gas estimator transport?
1420
+ chain && knownChainFees.has(chain.id) ? async () => ({
1421
+ maxFeePerGas: 100000n,
1422
+ maxPriorityFeePerGas: 0n
1423
+ }) : void 0
1424
+ )
1425
+ },
1426
+ ...config
1427
+ });
1428
+ }
1429
+
1430
+ // src/getSessionClient.ts
1431
+ async function getSessionClient({
1432
+ userAddress,
1433
+ sessionAccount,
1434
+ worldAddress
1435
+ }) {
1436
+ const client = sessionAccount.client;
1437
+ if (!clientHasChain(client)) {
1438
+ throw new Error("Session account client had no associated chain.");
1156
1439
  }
1157
- }
1158
-
1159
- .animate-in {
1160
- animation-name: enter;
1161
- animation-duration: 150ms;
1162
- --tw-enter-opacity: initial;
1163
- --tw-enter-scale: initial;
1164
- --tw-enter-rotate: initial;
1165
- --tw-enter-translate-x: initial;
1166
- --tw-enter-translate-y: initial;
1167
- }
1168
-
1169
- .fade-in {
1170
- --tw-enter-opacity: 0;
1171
- }
1172
-
1173
- .slide-in-from-bottom-16 {
1174
- --tw-enter-translate-y: 4rem;
1175
- }
1176
-
1177
- .slide-in-from-bottom-8 {
1178
- --tw-enter-translate-y: 2rem;
1179
- }
1180
-
1181
- .animate-duration-300 {
1182
- animation-duration: 300ms;
1183
- }
1184
-
1185
- @property --tw-border-gradient-angle {
1186
- syntax: '<angle>';
1187
- inherits: true;
1188
- initial-value: 0deg;
1189
- }
1190
-
1191
- @property --tw-conic-gradient-angle {
1192
- syntax: '<angle>';
1193
- inherits: true;
1194
- initial-value: 0deg;
1195
- }
1196
-
1197
- @keyframes border-gradient {
1198
-
1199
- to {
1200
- --tw-border-gradient-angle: 360deg;
1440
+ const bundlerTransport = getBundlerTransport(client.chain);
1441
+ const bundlerClient = createBundlerClient({
1442
+ transport: bundlerTransport,
1443
+ client,
1444
+ account: sessionAccount
1445
+ });
1446
+ const sessionClient = bundlerClient.extend(smartAccountActions).extend(
1447
+ callFrom({
1448
+ worldAddress,
1449
+ delegatorAddress: userAddress,
1450
+ publicClient: client
1451
+ })
1452
+ ).extend(() => ({ userAddress }));
1453
+ return sessionClient;
1454
+ }
1455
+ function clientHasChain(client) {
1456
+ return client.chain != null;
1457
+ }
1458
+
1459
+ // src/useSessionClient.ts
1460
+ function getSessionClientQueryOptions({
1461
+ queryClient,
1462
+ client,
1463
+ userAddress,
1464
+ worldAddress
1465
+ }) {
1466
+ const queryKey = ["getSessionClient", client?.uid, userAddress, worldAddress];
1467
+ return queryOptions6(
1468
+ userAddress ? {
1469
+ queryKey,
1470
+ async queryFn() {
1471
+ const sessionAccount = await queryClient.fetchQuery(getSessionAccountQueryOptions({ client, userAddress }));
1472
+ return await getSessionClient({
1473
+ sessionAccount,
1474
+ userAddress,
1475
+ worldAddress
1476
+ });
1477
+ },
1478
+ staleTime: Infinity,
1479
+ // TODO: replace with function to retry only connection errors
1480
+ retry: false
1481
+ } : { queryKey, enabled: false }
1482
+ );
1483
+ }
1484
+ function useSessionClient(userAddress) {
1485
+ const queryClient = useQueryClient4();
1486
+ const { chainId, worldAddress } = useEntryKitConfig();
1487
+ const client = useClient8({ chainId });
1488
+ return useQuery8(
1489
+ getSessionClientQueryOptions({
1490
+ queryClient,
1491
+ client,
1492
+ userAddress,
1493
+ worldAddress
1494
+ })
1495
+ );
1496
+ }
1497
+
1498
+ // src/onboarding/Session.tsx
1499
+ import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
1500
+ function Session({ isActive, isExpanded, userClient, registerSpender, registerDelegation }) {
1501
+ const sessionClient = useShowQueryError(useSessionClient(userClient.account.address));
1502
+ const setup = useShowMutationError(useSetupSession({ userClient }));
1503
+ const hasSession = !registerDelegation && !registerDelegation;
1504
+ useEffect6(() => {
1505
+ const timer = setTimeout(() => {
1506
+ if (isActive && setup.status === "idle" && sessionClient.data && !hasSession) {
1507
+ setup.mutate({
1508
+ sessionClient: sessionClient.data,
1509
+ registerSpender,
1510
+ registerDelegation
1511
+ });
1512
+ }
1513
+ });
1514
+ return () => clearTimeout(timer);
1515
+ }, [hasSession, isActive, registerDelegation, registerSpender, sessionClient, setup]);
1516
+ return /* @__PURE__ */ jsxs13("div", { className: "flex flex-col gap-4", children: [
1517
+ /* @__PURE__ */ jsxs13("div", { className: "flex justify-between gap-4", children: [
1518
+ /* @__PURE__ */ jsxs13("div", { children: [
1519
+ /* @__PURE__ */ jsx15("div", { children: "Session" }),
1520
+ /* @__PURE__ */ jsx15("div", { className: "font-mono text-white", children: hasSession ? "Enabled" : "Set up" })
1521
+ ] }),
1522
+ hasSession ? /* @__PURE__ */ jsx15(Button, { variant: "tertiary", className: "flex-shrink-0 text-sm p-1 w-28", autoFocus: isActive, disabled: true, children: "Enabled" }) : /* @__PURE__ */ jsx15(
1523
+ Button,
1524
+ {
1525
+ variant: isActive ? "primary" : "tertiary",
1526
+ className: "flex-shrink-0 text-sm p-1 w-28",
1527
+ autoFocus: isActive,
1528
+ pending: !sessionClient.data || setup.status === "pending",
1529
+ onClick: sessionClient.data ? () => setup.mutate({
1530
+ sessionClient: sessionClient.data,
1531
+ registerSpender,
1532
+ registerDelegation
1533
+ }) : void 0,
1534
+ children: "Enable"
1535
+ }
1536
+ )
1537
+ ] }),
1538
+ isExpanded ? /* @__PURE__ */ jsx15("p", { className: "text-sm", children: "You can perform actions in this app without interruptions for approvals." }) : null
1539
+ ] });
1540
+ }
1541
+
1542
+ // src/onboarding/GasBalance.tsx
1543
+ import { useBalance, useWatchBlockNumber } from "wagmi";
1544
+
1545
+ // src/data/relayChains.json
1546
+ var relayChains_default = {
1547
+ "1": {
1548
+ bridgeUrl: "https://relay.link/bridge/ethereum"
1549
+ },
1550
+ "10": {
1551
+ bridgeUrl: "https://relay.link/bridge/optimism"
1552
+ },
1553
+ "56": {
1554
+ bridgeUrl: "https://relay.link/bridge/bnb"
1555
+ },
1556
+ "100": {
1557
+ bridgeUrl: "https://relay.link/bridge/gnosis"
1558
+ },
1559
+ "111": {
1560
+ bridgeUrl: "https://testnets.relay.link/bridge/bob"
1561
+ },
1562
+ "137": {
1563
+ bridgeUrl: "https://relay.link/bridge/polygon"
1564
+ },
1565
+ "185": {
1566
+ bridgeUrl: "https://relay.link/bridge/mint"
1567
+ },
1568
+ "288": {
1569
+ bridgeUrl: "https://relay.link/bridge/boba"
1570
+ },
1571
+ "324": {
1572
+ bridgeUrl: "https://relay.link/bridge/zksync"
1573
+ },
1574
+ "360": {
1575
+ bridgeUrl: "https://relay.link/bridge/shape"
1576
+ },
1577
+ "480": {
1578
+ bridgeUrl: "https://relay.link/bridge/world-chain"
1579
+ },
1580
+ "690": {
1581
+ bridgeUrl: "https://relay.link/bridge/redstone"
1582
+ },
1583
+ "919": {
1584
+ bridgeUrl: "https://testnets.relay.link/bridge/mode-testnet"
1585
+ },
1586
+ "1101": {
1587
+ bridgeUrl: "https://relay.link/bridge/polygon-zkevm"
1588
+ },
1589
+ "1135": {
1590
+ bridgeUrl: "https://relay.link/bridge/lisk"
1591
+ },
1592
+ "1301": {
1593
+ bridgeUrl: "https://testnets.relay.link/bridge/unichain-sepolia"
1594
+ },
1595
+ "1329": {
1596
+ bridgeUrl: "https://relay.link/bridge/sei"
1597
+ },
1598
+ "1625": {
1599
+ bridgeUrl: "https://relay.link/bridge/gravity"
1600
+ },
1601
+ "1868": {
1602
+ bridgeUrl: "https://relay.link/bridge/soneium"
1603
+ },
1604
+ "1993": {
1605
+ bridgeUrl: "https://testnets.relay.link/bridge/b3"
1606
+ },
1607
+ "1996": {
1608
+ bridgeUrl: "https://relay.link/bridge/sanko"
1609
+ },
1610
+ "2741": {
1611
+ bridgeUrl: "https://relay.link/bridge/abstract"
1612
+ },
1613
+ "2911": {
1614
+ bridgeUrl: "https://relay.link/bridge/hychain"
1615
+ },
1616
+ "4202": {
1617
+ bridgeUrl: "https://testnets.relay.link/bridge/lisk-sepolia"
1618
+ },
1619
+ "4321": {
1620
+ bridgeUrl: "https://relay.link/bridge/echos"
1621
+ },
1622
+ "5000": {
1623
+ bridgeUrl: "https://relay.link/bridge/mantle"
1624
+ },
1625
+ "5112": {
1626
+ bridgeUrl: "https://relay.link/bridge/ham"
1627
+ },
1628
+ "7560": {
1629
+ bridgeUrl: "https://relay.link/bridge/cyber"
1630
+ },
1631
+ "7865": {
1632
+ bridgeUrl: "https://relay.link/bridge/powerloom"
1633
+ },
1634
+ "7897": {
1635
+ bridgeUrl: "https://relay.link/bridge/arena-z"
1636
+ },
1637
+ "8333": {
1638
+ bridgeUrl: "https://relay.link/bridge/B3"
1639
+ },
1640
+ "8453": {
1641
+ bridgeUrl: "https://relay.link/bridge/base"
1642
+ },
1643
+ "9897": {
1644
+ bridgeUrl: "https://testnets.relay.link/bridge/arena-z-testnet"
1645
+ },
1646
+ "11011": {
1647
+ bridgeUrl: "https://testnets.relay.link/bridge/shape-sepolia"
1648
+ },
1649
+ "11124": {
1650
+ bridgeUrl: "https://testnets.relay.link/bridge/abstract"
1651
+ },
1652
+ "13746": {
1653
+ bridgeUrl: "https://testnets.relay.link/bridge/game7-testnet"
1654
+ },
1655
+ "17000": {
1656
+ bridgeUrl: "https://testnets.relay.link/bridge/holesky"
1657
+ },
1658
+ "17069": {
1659
+ bridgeUrl: "https://testnets.relay.link/bridge/garnet"
1660
+ },
1661
+ "17071": {
1662
+ bridgeUrl: "https://relay.link/bridge/onchain-points"
1663
+ },
1664
+ "33139": {
1665
+ bridgeUrl: "https://relay.link/bridge/apechain"
1666
+ },
1667
+ "33979": {
1668
+ bridgeUrl: "https://relay.link/bridge/funki"
1669
+ },
1670
+ "34443": {
1671
+ bridgeUrl: "https://relay.link/bridge/mode"
1672
+ },
1673
+ "42161": {
1674
+ bridgeUrl: "https://relay.link/bridge/arbitrum"
1675
+ },
1676
+ "42170": {
1677
+ bridgeUrl: "https://relay.link/bridge/arbitrum-nova"
1678
+ },
1679
+ "43114": {
1680
+ bridgeUrl: "https://relay.link/bridge/avalanche"
1681
+ },
1682
+ "55244": {
1683
+ bridgeUrl: "https://relay.link/bridge/superposition"
1684
+ },
1685
+ "57073": {
1686
+ bridgeUrl: "https://relay.link/bridge/ink"
1687
+ },
1688
+ "59144": {
1689
+ bridgeUrl: "https://relay.link/bridge/linea"
1690
+ },
1691
+ "60808": {
1692
+ bridgeUrl: "https://relay.link/bridge/bob"
1693
+ },
1694
+ "70700": {
1695
+ bridgeUrl: "https://relay.link/bridge/apex"
1696
+ },
1697
+ "70701": {
1698
+ bridgeUrl: "https://relay.link/bridge/boss"
1699
+ },
1700
+ "70800": {
1701
+ bridgeUrl: "https://testnets.relay.link/bridge/apex-testnet"
1702
+ },
1703
+ "70805": {
1704
+ bridgeUrl: "https://testnets.relay.link/bridge/cloud"
1705
+ },
1706
+ "80002": {
1707
+ bridgeUrl: "https://testnets.relay.link/bridge/amoy"
1708
+ },
1709
+ "81457": {
1710
+ bridgeUrl: "https://relay.link/bridge/blast"
1711
+ },
1712
+ "84532": {
1713
+ bridgeUrl: "https://testnets.relay.link/bridge/base-sepolia"
1714
+ },
1715
+ "167009": {
1716
+ bridgeUrl: "https://testnets.relay.link/bridge/hekla"
1717
+ },
1718
+ "421614": {
1719
+ bridgeUrl: "https://testnets.relay.link/bridge/arbitrum-sepolia"
1720
+ },
1721
+ "534352": {
1722
+ bridgeUrl: "https://relay.link/bridge/scroll"
1723
+ },
1724
+ "543210": {
1725
+ bridgeUrl: "https://relay.link/bridge/zero-network"
1726
+ },
1727
+ "660279": {
1728
+ bridgeUrl: "https://relay.link/bridge/xai"
1729
+ },
1730
+ "911867": {
1731
+ bridgeUrl: "https://testnets.relay.link/bridge/odyssey"
1732
+ },
1733
+ "984122": {
1734
+ bridgeUrl: "https://relay.link/bridge/forma"
1735
+ },
1736
+ "1118190": {
1737
+ bridgeUrl: "https://testnets.relay.link/bridge/eclipse-testnet"
1738
+ },
1739
+ "3397901": {
1740
+ bridgeUrl: "https://testnets.relay.link/bridge/funki-testnet"
1741
+ },
1742
+ "4457845": {
1743
+ bridgeUrl: "https://testnets.relay.link/bridge/zero-sepolia"
1744
+ },
1745
+ "7777777": {
1746
+ bridgeUrl: "https://relay.link/bridge/zora"
1747
+ },
1748
+ "8253038": {
1749
+ bridgeUrl: "https://relay.link/bridge/bitcoin"
1750
+ },
1751
+ "9092725": {
1752
+ bridgeUrl: "https://testnets.relay.link/bridge/bitcoin-testnet4"
1753
+ },
1754
+ "9286185": {
1755
+ bridgeUrl: "https://relay.link/bridge/eclipse"
1756
+ },
1757
+ "11155111": {
1758
+ bridgeUrl: "https://testnets.relay.link/bridge/sepolia"
1759
+ },
1760
+ "11155420": {
1761
+ bridgeUrl: "https://testnets.relay.link/bridge/op-sepolia"
1762
+ },
1763
+ "666666666": {
1764
+ bridgeUrl: "https://relay.link/bridge/degen"
1765
+ },
1766
+ "792703809": {
1767
+ bridgeUrl: "https://relay.link/bridge/solana"
1768
+ },
1769
+ "888888888": {
1770
+ bridgeUrl: "https://relay.link/bridge/ancient8"
1771
+ },
1772
+ "999999999": {
1773
+ bridgeUrl: "https://testnets.relay.link/bridge/zora-sepolia"
1774
+ },
1775
+ "1380012617": {
1776
+ bridgeUrl: "https://relay.link/bridge/rari"
1777
+ },
1778
+ "1936682084": {
1779
+ bridgeUrl: "https://testnets.relay.link/bridge/solana-devnet"
1780
+ },
1781
+ "88153591557": {
1782
+ bridgeUrl: "https://testnets.relay.link/bridge/arbitrum-blueberry"
1201
1783
  }
1202
- }
1203
-
1204
- .after\\:select-none::after {
1205
- content: var(--tw-content);
1206
- -webkit-user-select: none;
1207
- user-select: none;
1208
- }
1209
-
1210
- .after\\:content-\\[\\'\\2026\\'\\]::after {
1211
- --tw-content: '\u2026';
1212
- content: var(--tw-content);
1213
- }
1214
-
1215
- .hover\\:bg-neutral-200:hover {
1216
- --tw-bg-opacity: 1;
1217
- background-color: rgb(229 229 229 / var(--tw-bg-opacity));
1218
- }
1219
-
1220
- .hover\\:bg-orange-400:hover {
1221
- --tw-bg-opacity: 1;
1222
- background-color: rgb(251 146 60 / var(--tw-bg-opacity));
1223
- }
1224
-
1225
- .hover\\:text-neutral-500:hover {
1226
- --tw-text-opacity: 1;
1227
- color: rgb(115 115 115 / var(--tw-text-opacity));
1228
- }
1229
-
1230
- .hover\\:text-white:hover {
1231
- --tw-text-opacity: 1;
1232
- color: rgb(255 255 255 / var(--tw-text-opacity));
1233
- }
1234
-
1235
- .hover\\:brightness-125:hover {
1236
- --tw-brightness: brightness(1.25);
1237
- filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
1238
- }
1239
-
1240
- .focus\\:border-orange-500:focus {
1241
- --tw-border-opacity: 1;
1242
- border-color: rgb(249 115 22 / var(--tw-border-opacity));
1243
- }
1244
-
1245
- .focus\\:border-yellow-400:focus {
1246
- --tw-border-opacity: 1;
1247
- border-color: rgb(250 204 21 / var(--tw-border-opacity));
1248
- }
1249
-
1250
- .active\\:bg-orange-600:active {
1251
- --tw-bg-opacity: 1;
1252
- background-color: rgb(234 88 12 / var(--tw-bg-opacity));
1253
- }
1254
-
1255
- .active\\:brightness-150:active {
1256
- --tw-brightness: brightness(1.5);
1257
- filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
1258
- }
1259
-
1260
- .group:hover .group-hover\\:rotate-90 {
1261
- --tw-rotate: 90deg;
1262
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1263
- }
1264
-
1265
- .group:hover .group-hover\\:text-black {
1266
- --tw-text-opacity: 1;
1267
- color: rgb(0 0 0 / var(--tw-text-opacity));
1268
- }
1269
-
1270
- .aria-busy\\:pointer-events-none[aria-busy="true"] {
1271
- pointer-events: none;
1272
- }
1273
-
1274
- .aria-disabled\\:pointer-events-none[aria-disabled="true"] {
1275
- pointer-events: none;
1276
- }
1277
-
1278
- .aria-disabled\\:opacity-50[aria-disabled="true"] {
1279
- opacity: 0.5;
1280
- }
1281
-
1282
- .group\\/button[aria-busy="true"] .group-aria-busy\\/button\\:translate-x-0 {
1283
- --tw-translate-x: 0px;
1284
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1285
- }
1286
-
1287
- .group[aria-busy="true"] .group-aria-busy\\:scale-100 {
1288
- --tw-scale-x: 1;
1289
- --tw-scale-y: 1;
1290
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1291
- }
1292
-
1293
- .group[aria-busy="true"] .group-aria-busy\\:scale-125 {
1294
- --tw-scale-x: 1.25;
1295
- --tw-scale-y: 1.25;
1296
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1297
- }
1298
-
1299
- .group\\/button[aria-busy="true"] .group-aria-busy\\/button\\:opacity-100 {
1300
- opacity: 1;
1301
- }
1302
-
1303
- .group[aria-busy="true"] .group-aria-busy\\:opacity-0 {
1304
- opacity: 0;
1305
- }
1306
-
1307
- .group[aria-busy="true"] .group-aria-busy\\:opacity-100 {
1308
- opacity: 1;
1309
- }
1310
-
1311
- .group\\/button[aria-busy="true"] .group-aria-busy\\/button\\:duration-300 {
1312
- transition-duration: 300ms;
1313
- }
1314
-
1315
- .data-\\[highlighted\\]\\:bg-neutral-200[data-highlighted] {
1316
- --tw-bg-opacity: 1;
1317
- background-color: rgb(229 229 229 / var(--tw-bg-opacity));
1318
- }
1319
-
1320
- .links\\:font-medium a[href]:not(.links-unset) {
1321
- font-weight: 500;
1322
- }
1323
-
1324
- .links\\:text-white a[href]:not(.links-unset) {
1325
- --tw-text-opacity: 1;
1326
- color: rgb(255 255 255 / var(--tw-text-opacity));
1327
- }
1328
-
1329
- .links\\:underline a[href]:not(.links-unset) {
1330
- text-decoration-line: underline;
1331
- }
1332
-
1333
- .links\\:decoration-neutral-500 a[href]:not(.links-unset) {
1334
- text-decoration-color: #737373;
1335
- }
1336
-
1337
- .links\\:underline-offset-4 a[href]:not(.links-unset) {
1338
- text-underline-offset: 4px;
1339
- }
1340
-
1341
- .hover\\:links\\:decoration-orange-500 a[href]:not(.links-unset):hover {
1342
- text-decoration-color: #f97316;
1343
- }
1344
-
1345
- @media (min-width: 640px) {
1346
-
1347
- .sm\\:items-center {
1348
- align-items: center;
1784
+ };
1785
+
1786
+ // src/onboarding/useSetBalance.ts
1787
+ import { useQueryClient as useQueryClient5, useMutation as useMutation3 } from "@tanstack/react-query";
1788
+ import { setBalance as setBalance2 } from "viem/actions";
1789
+ import { useClient as useClient9 } from "wagmi";
1790
+ function useSetBalance() {
1791
+ const queryClient = useQueryClient5();
1792
+ const { chainId } = useEntryKitConfig();
1793
+ const client = useClient9({ chainId });
1794
+ return useMutation3({
1795
+ retry: 0,
1796
+ mutationKey: ["setBalance", chainId],
1797
+ mutationFn: async (params) => {
1798
+ if (!client) return null;
1799
+ await setBalance2({ ...client, mode: "anvil" }, params);
1800
+ await Promise.all([
1801
+ queryClient.invalidateQueries({ queryKey: ["balance"] }),
1802
+ queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] })
1803
+ ]);
1804
+ return null;
1805
+ }
1806
+ });
1807
+ }
1808
+
1809
+ // src/onboarding/GasBalance.tsx
1810
+ import { Fragment, jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
1811
+ function GasBalance({ isActive, isExpanded, sessionAddress }) {
1812
+ const { chain } = useEntryKitConfig();
1813
+ const balance = useShowQueryError(useBalance({ chainId: chain.id, address: sessionAddress }));
1814
+ useWatchBlockNumber({ onBlockNumber: () => balance.refetch() });
1815
+ const setBalance3 = useShowMutationError(useSetBalance());
1816
+ const relayChain = relayChains_default[chain.id];
1817
+ return /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-4", children: [
1818
+ /* @__PURE__ */ jsxs14("div", { className: "flex justify-between gap-4", children: [
1819
+ /* @__PURE__ */ jsxs14("div", { children: [
1820
+ /* @__PURE__ */ jsx16("div", { children: "Gas balance" }),
1821
+ /* @__PURE__ */ jsx16("div", { className: "font-mono text-white", children: balance.data != null ? /* @__PURE__ */ jsx16(Balance, { wei: balance.data.value }) : /* @__PURE__ */ jsx16(PendingIcon, { className: "text-sm" }) })
1822
+ ] }),
1823
+ chain.id === 31337 ? /* @__PURE__ */ jsx16(
1824
+ Button,
1825
+ {
1826
+ variant: isActive ? "primary" : "tertiary",
1827
+ className: "flex-shrink-0 text-sm p-1 w-28",
1828
+ autoFocus: isActive || isExpanded,
1829
+ pending: balance.status === "pending" || setBalance3.status === "pending",
1830
+ onClick: () => setBalance3.mutate({
1831
+ address: sessionAddress,
1832
+ value: minGasBalance + (balance.data?.value ?? 0n)
1833
+ }),
1834
+ children: "Top up"
1835
+ }
1836
+ ) : relayChain != null ? (
1837
+ // TODO: convert this to a <ButtonLink>
1838
+ /* @__PURE__ */ jsx16(
1839
+ "a",
1840
+ {
1841
+ href: `${relayChain.bridgeUrl}?${new URLSearchParams({ toAddress: sessionAddress })}`,
1842
+ target: "_blank",
1843
+ rel: "noopener noreferrer",
1844
+ children: /* @__PURE__ */ jsx16(
1845
+ Button,
1846
+ {
1847
+ variant: isActive ? "primary" : "tertiary",
1848
+ className: "flex-shrink-0 text-sm p-1 w-28",
1849
+ autoFocus: isActive || isExpanded,
1850
+ pending: balance.status === "pending",
1851
+ children: "Top up"
1852
+ }
1853
+ )
1854
+ }
1855
+ )
1856
+ ) : null
1857
+ ] }),
1858
+ isExpanded ? /* @__PURE__ */ jsxs14(Fragment, { children: [
1859
+ /* @__PURE__ */ jsx16("p", { className: "text-sm", children: "Your session's gas balance is used to pay for onchain computation." }),
1860
+ /* @__PURE__ */ jsxs14("p", { className: "text-sm", children: [
1861
+ "Send funds to",
1862
+ " ",
1863
+ /* @__PURE__ */ jsx16("span", { className: "font-mono text-white", children: /* @__PURE__ */ jsx16(TruncatedHex, { hex: sessionAddress }) }),
1864
+ " ",
1865
+ "on ",
1866
+ chain.name,
1867
+ " to top up your session balance."
1868
+ ] })
1869
+ ] }) : null
1870
+ ] });
1871
+ }
1872
+
1873
+ // src/onboarding/ConnectedSteps.tsx
1874
+ import { jsx as jsx17 } from "react/jsx-runtime";
1875
+ function ConnectedSteps({ userClient, initialUserAddress }) {
1876
+ const { chain } = useEntryKitConfig();
1877
+ const paymaster = getPaymaster(chain);
1878
+ const userAddress = userClient.account.address;
1879
+ const { data: prerequisites, error: prerequisitesError } = usePrerequisites(userAddress);
1880
+ useEffect7(() => {
1881
+ if (prerequisitesError) {
1882
+ console.error("Could not get prerequisites", prerequisitesError);
1883
+ }
1884
+ }, [prerequisitesError]);
1885
+ const { closeAccountModal } = useAccountModal();
1886
+ const isNewConnection = userAddress !== initialUserAddress;
1887
+ const initialPrerequisites = useRef2(prerequisites);
1888
+ useEffect7(() => {
1889
+ if (prerequisites == null) return;
1890
+ if (initialPrerequisites.current == null) {
1891
+ initialPrerequisites.current = prerequisites;
1892
+ }
1893
+ if (prerequisites.complete) {
1894
+ if (isNewConnection || !initialPrerequisites.current.complete) {
1895
+ closeAccountModal();
1896
+ }
1897
+ }
1898
+ }, [closeAccountModal, isNewConnection, prerequisites]);
1899
+ const { sessionAddress, hasAllowance, isSpender, hasDelegation, hasGasBalance } = prerequisites ?? {};
1900
+ const steps = useMemo2(() => {
1901
+ if (!userAddress) {
1902
+ return [
1903
+ {
1904
+ id: "wallet",
1905
+ isComplete: false,
1906
+ content: () => null
1907
+ }
1908
+ ];
1909
+ }
1910
+ const steps2 = [
1911
+ {
1912
+ id: "wallet",
1913
+ isComplete: true,
1914
+ content: (props) => /* @__PURE__ */ jsx17(Wallet, { ...props, userAddress })
1915
+ }
1916
+ ];
1917
+ if (!paymaster) {
1918
+ if (sessionAddress != null) {
1919
+ steps2.push({
1920
+ id: "gasBalance",
1921
+ isComplete: !!hasGasBalance,
1922
+ content: (props) => /* @__PURE__ */ jsx17(GasBalance, { ...props, sessionAddress })
1923
+ });
1924
+ }
1925
+ } else if (paymaster.type === "quarry") {
1926
+ steps2.push({
1927
+ id: "allowance",
1928
+ isComplete: !!hasAllowance,
1929
+ content: (props) => /* @__PURE__ */ jsx17(Allowance, { ...props, userAddress })
1930
+ });
1931
+ }
1932
+ steps2.push({
1933
+ id: "session",
1934
+ isComplete: !!isSpender && !!hasDelegation,
1935
+ content: (props) => /* @__PURE__ */ jsx17(Session, { ...props, userClient, registerSpender: !isSpender, registerDelegation: !hasDelegation })
1936
+ });
1937
+ return steps2;
1938
+ }, [hasAllowance, hasDelegation, hasGasBalance, isSpender, paymaster, sessionAddress, userAddress, userClient]);
1939
+ const [selectedStepId] = useState3(null);
1940
+ const nextStep = steps.find((step) => step.content != null && !step.isComplete);
1941
+ const completedSteps = steps.filter((step) => step.isComplete);
1942
+ const activeStep = (selectedStepId != null ? steps.find((step) => step.id === selectedStepId) : null) ?? nextStep ?? (completedSteps.length < steps.length ? completedSteps.at(-1) : null);
1943
+ const activeStepIndex = activeStep ? steps.indexOf(activeStep) : -1;
1944
+ return /* @__PURE__ */ jsx17(
1945
+ "div",
1946
+ {
1947
+ className: twMerge7(
1948
+ // steps.length === 2 ? "min-h-[22rem]" : "min-h-[26rem]",
1949
+ "px-8 flex flex-col divide-y divide-neutral-800",
1950
+ "animate-in animate-duration-300 fade-in slide-in-from-bottom-8"
1951
+ ),
1952
+ children: steps.map((step, i) => {
1953
+ const isActive = step === activeStep;
1954
+ const isExpanded = isActive || completedSteps.length === steps.length;
1955
+ const isDisabled = !step.isComplete && activeStepIndex !== -1 && i > activeStepIndex;
1956
+ return /* @__PURE__ */ jsx17("div", { className: twMerge7("py-8 flex flex-col justify-center", isActive ? "flex-grow" : null), children: /* @__PURE__ */ jsx17("div", { className: twMerge7("flex flex-col", isDisabled ? "opacity-30 pointer-events-none" : null), children: step.content({ isActive, isExpanded }) }) }, step.id);
1957
+ })
1958
+ }
1959
+ );
1960
+ }
1961
+
1962
+ // src/AccountModalContent.tsx
1963
+ import { useRef as useRef3 } from "react";
1964
+ import { jsx as jsx18 } from "react/jsx-runtime";
1965
+ function AccountModalContent() {
1966
+ const { chainId } = useEntryKitConfig();
1967
+ const userClient = useConnectorClient({ chainId });
1968
+ const { address: userAddress } = useAccount2();
1969
+ const initialUserAddress = useRef3(userAddress);
1970
+ if (userClient.status !== "success") {
1971
+ return /* @__PURE__ */ jsx18(ConnectWallet, {});
1349
1972
  }
1350
- }
1351
-
1352
- .dark\\:border-neutral-700:where([data-theme="dark"], [data-theme="dark"] *) {
1353
- --tw-border-opacity: 1;
1354
- border-color: rgb(64 64 64 / var(--tw-border-opacity));
1355
- }
1356
-
1357
- .dark\\:bg-neutral-800:where([data-theme="dark"], [data-theme="dark"] *) {
1358
- --tw-bg-opacity: 1;
1359
- background-color: rgb(38 38 38 / var(--tw-bg-opacity));
1360
- }
1361
-
1362
- .dark\\:bg-red-900:where([data-theme="dark"], [data-theme="dark"] *) {
1363
- --tw-bg-opacity: 1;
1364
- background-color: rgb(127 29 29 / var(--tw-bg-opacity));
1365
- }
1366
-
1367
- .dark\\:bg-white\\/10:where([data-theme="dark"], [data-theme="dark"] *) {
1368
- background-color: rgb(255 255 255 / 0.1);
1369
- }
1370
-
1371
- .dark\\:text-neutral-400:where([data-theme="dark"], [data-theme="dark"] *) {
1372
- --tw-text-opacity: 1;
1373
- color: rgb(163 163 163 / var(--tw-text-opacity));
1374
- }
1375
-
1376
- .dark\\:text-red-50:where([data-theme="dark"], [data-theme="dark"] *) {
1377
- --tw-text-opacity: 1;
1378
- color: rgb(254 242 242 / var(--tw-text-opacity));
1379
- }
1380
-
1381
- .dark\\:text-white:where([data-theme="dark"], [data-theme="dark"] *) {
1382
- --tw-text-opacity: 1;
1383
- color: rgb(255 255 255 / var(--tw-text-opacity));
1384
- }
1385
-
1386
- .dark\\:hover\\:bg-neutral-700:hover:where([data-theme="dark"], [data-theme="dark"] *) {
1387
- --tw-bg-opacity: 1;
1388
- background-color: rgb(64 64 64 / var(--tw-bg-opacity));
1389
- }
1390
-
1391
- .group:hover .dark\\:group-hover\\:text-white:where([data-theme="dark"], [data-theme="dark"] *) {
1392
- --tw-text-opacity: 1;
1393
- color: rgb(255 255 255 / var(--tw-text-opacity));
1394
- }
1395
- `;import{useResizeObserver as or}from"usehooks-ts";import{mergeRefs as nr}from"react-merge-refs";import{createContext as _t,useContext as Yt}from"react";import{jsx as Xt}from"react/jsx-runtime";var ke=_t(null);function Se({frame:e,children:t}){if(Yt(ke))throw new Error("`FrameProvider` can only be used once.");return Xt(ke.Provider,{value:{frame:e},children:t})}import{useMediaQuery as Jt}from"usehooks-ts";import"@rainbow-me/rainbowkit/styles.css";import{createContext as jt,useContext as Ne}from"react";import{RainbowKitProvider as $t,lightTheme as Ae,midnightTheme as Pe}from"@rainbow-me/rainbowkit";import{useChains as Zt}from"wagmi";import{jsx as Ue}from"react/jsx-runtime";var ae=jt(null);function Ee({config:e,children:t}){if(Ne(ae))throw new Error("`EntryKitProvider` can only be used once.");let n=Zt().find(({id:a})=>a===e.chainId);if(!n)throw new Error(`Could not find configured chain for chain ID ${e.chainId}.`);return Ue($t,{initialChain:0,appInfo:{appName:e.appName},theme:e.theme==="light"?Ae({borderRadius:"none"}):e.theme==="dark"?Pe({borderRadius:"none"}):{lightMode:Ae({borderRadius:"none"}),darkMode:Pe({borderRadius:"none"})},children:Ue(ae.Provider,{value:{...e,chain:n},children:t})})}function l(){let e=Ne(ae);if(!e)throw new Error("`useEntryKitConfig` can only be used within a `EntryKitProvider`.");return e}function Re(){let{theme:e}=l(),t=Jt("(prefers-color-scheme: dark)");return e??(t?"dark":"light")}import{jsx as O,jsxs as ir}from"react/jsx-runtime";function ar({onSize:e,...t}){let r=Me(null);return or({ref:r,onResize:e}),O("div",{ref:r,...t,style:{...t.style,display:"inline-grid"}})}var Q=er(function({mode:t,children:r},o){let n=Me(null),[a,i]=Te(!1),s=a?n.current:null,[c,g]=Te({width:void 0,height:void 0}),m=s?.contentDocument,d=Re();tr(()=>{m&&m.body.setAttribute("data-theme",d)},[m,d]);let p=t==="modal"?{all:"unset",display:"block",position:"fixed",inset:"0",width:"100%",height:"100%",zIndex:"2147483646"}:c.width&&c.height?{all:"unset",display:"inline-grid",width:`${c.width}px`,height:`${c.height}px`}:{all:"unset",display:"block",position:"fixed",inset:"0",width:"100%",height:"100%",opacity:0,pointerEvents:"none"};return O("iframe",{ref:nr([o,n]),style:p,onLoad:()=>i(!0),srcDoc:"<!doctype html><title>\u2026</title>",children:m?rr.createPortal(ir(Se,{frame:s,children:[O("div",{children:t==="modal"?r:O(ar,{onSize:g,children:r})}),O("style",{dangerouslySetInnerHTML:{__html:Ce}})]}),m.body):null})});import{twMerge as Ie}from"tailwind-merge";import{jsx as E,jsxs as cr}from"react/jsx-runtime";function He({open:e,onOpenChange:t,children:r}){return E(sr,{open:e,onOpenChange:t,children:E(lr,{children:cr(Q,{mode:"modal",children:[E("div",{className:Ie("fixed inset-0","bg-neutral-800/85","animate-in animate-duration-300 fade-in")}),E("div",{className:Ie("fixed inset-0","grid items-end sm:items-center","animate-in animate-duration-300 fade-in slide-in-from-bottom-16"),children:E("div",{children:E(dr,{className:"outline-none w-full max-w-[26rem] mx-auto","aria-describedby":void 0,onOpenAutoFocus:o=>{o.preventDefault()},children:r})})})]})})})}import{useCallback as ie,useMemo as pr}from"react";import{useStore as mr}from"zustand";import{createStore as ur}from"zustand/vanilla";var V=ur(()=>({open:!1}));function v(){let e=mr(V,n=>n.open),t=ie(()=>{V.setState({open:!0})},[]),r=ie(()=>{V.setState({open:!1})},[]),o=ie(n=>{V.setState({open:n})},[]);return pr(()=>({accountModalOpen:e,openAccountModal:t,closeAccountModal:r,toggleAccountModal:o}),[e,t,r,o])}import{twMerge as Ot}from"tailwind-merge";import{useAccount as Rn,useConnectorClient as Tn}from"wagmi";import{useAccount as Cr}from"wagmi";import{twMerge as q}from"tailwind-merge";import{twMerge as gr}from"tailwind-merge";import{jsx as Oe,jsxs as fr}from"react/jsx-runtime";function b({className:e,...t}){return fr("svg",{className:gr("-my-[0.125em] h-[1.25em] w-[1.25em] animate-spin",e),xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",...t,children:[Oe("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),Oe("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]})}import{jsx as z,jsxs as yr}from"react/jsx-runtime";var hr=({variant:e="secondary"}={})=>q("group/button self-center leading-none outline-none border-4 border-transparent","transition hover:brightness-125 active:brightness-150","focus:border-orange-500","aria-disabled:pointer-events-none aria-busy:pointer-events-none","aria-disabled:opacity-50","p-[.75em] font-medium",{primary:q("bg-orange-600 text-white focus:border-yellow-400"),secondary:q("bg-neutral-700 text-white focus:border-orange-500"),tertiary:q("bg-neutral-800 text-white focus:border-orange-500")}[e]),y=({pending:e,variant:t,type:r,className:o,children:n,disabled:a,...i})=>z("button",{type:r||"button",className:q(hr({variant:t,pending:e}),o),"aria-busy":e,"aria-disabled":a,disabled:a||e,...i,children:yr("span",{className:"grid grid-cols-[1fr_auto_1fr] gap-2",children:[z("span",{className:"flex items-center justify-end text-[.75em]",children:z("span",{className:"transition opacity-0 translate-x-2 group-aria-busy/button:opacity-100 group-aria-busy/button:translate-x-0 duration-100 group-aria-busy/button:duration-300",children:z(b,{})})}),z("span",{children:n})]})});import{useConnectModal as kr}from"@rainbow-me/rainbowkit";import{twMerge as br}from"tailwind-merge";import{jsx as se,jsxs as wr}from"react/jsx-runtime";function S({className:e,...t}){return wr("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 8 8",fill:"currentColor",shapeRendering:"crispEdges",className:br("-my-[0.125em] h-[1.25em] w-[1.25em]",e),...t,children:[se("path",{d:"M0 0h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm0 1h1v1H0zm1 0h1v1H1zm1 0h1v1H2zm1 0h1v1H3zm1 0h1v1H4zm1 0h1v1H5zm2-1h1v1H7zm0 1h1v1H7zM6 7h1v1H6zm1-2h1v1H7zm0-1h1v1H7zm0-1h1v1H7z"}),se("path",{d:"M2 2h1v1H2zm0 1h1v1H2zm0 1h1v1H2zm0 1h1v1H2zm1-3h1v1H3zm1 0h1v1H4zm1 0h1v1H5zm0 1h1v1H5zm0 1h1v1H5zm0 1h1v1H5zM4 5h1v1H4zM3 5h1v1H3z",opacity:".5"}),se("path",{d:"M7 2h1v1H7zm0-1h1v1H7zM1 0h1v1H1zm1 0h1v1H2zm1 0h1v1H3zm1 0h1v1H4zm1 0h1v1H5zm1 0h1v1H6zm1 0h1v1H7z"})]})}import{useQuery as xr}from"@tanstack/react-query";function W(e){return xr({enabled:!!e,retry:!1,retryOnMount:!1,refetchOnMount:!1,refetchOnWindowFocus:!1,queryKey:["preloadImage",e],queryFn:()=>new Promise((t,r)=>{if(!e)throw new Error("usePreloadImage: Must provide `url` to preload image.");let o=new Image;o.onload=()=>t(o),o.onerror=()=>r(new Error(`usePreloadImage: Could not load image.
1396
-
1397
- URL: ${e}`)),o.src=e})})}import{jsx as _,jsxs as vr}from"react/jsx-runtime";function ze(){let{appName:e,appIcon:t}=l(),{data:r,isLoading:o}=W(t);return vr("div",{className:"flex-grow flex flex-col items-center justify-center gap-2",children:[_("div",{className:"w-16 h-16 m-2",children:o?null:r?_("img",{src:t,className:"w-full h-full object-cover"}):_(S,{className:"w-full h-full text-orange-500 dark:bg-neutral-800"})}),_("div",{className:"text-2xl text-white text-center",children:e})]})}import{twMerge as Sr}from"tailwind-merge";import{useEffect as Ar,useState as Pr}from"react";import{jsx as Y,jsxs as Ur}from"react/jsx-runtime";function qe(){let e=Cr(),{openConnectModal:t,connectModalOpen:r}=kr(),[o,n]=Pr(!1);return Ar(()=>{!r&&!o&&(t?.(),n(!0))},[r,o,t]),Ur("div",{className:Sr("flex flex-col gap-6 p-6","animate-in animate-duration-300 fade-in slide-in-from-bottom-8"),children:[Y("div",{className:"p-4",children:Y(ze,{})}),Y("div",{className:"self-center flex flex-col gap-2 w-60",children:Y(y,{variant:"secondary",className:"self-auto flex justify-center",disabled:e.status==="connecting",onClick:t,autoFocus:!0,children:"Connect wallet"},"create")})]})}import{useEffect as St,useMemo as Un,useRef as Nn,useState as En}from"react";import{twMerge as be}from"tailwind-merge";import{parseEther as Nr}from"viem";var P=Nr("0.01");import{useClient as qr}from"wagmi";import{queryOptions as Br,useQuery as Lr}from"@tanstack/react-query";import{numberToHex as Mr}from"viem";import{defineStore as Er}from"@latticexyz/store";import{parseAbi as Rr}from"viem";var le=Rr(["error SpenderSystem_AlreadyRegistered(address spender, address user)","error SpenderSystem_HasOwnBalance(address spender)","function registerSpender(address spender)"]),Tr=Er({namespaces:{root:{namespace:"",tables:{Allowance:{schema:{user:"address",allowance:"uint256"},key:["user"]},Grantor:{schema:{grantor:"address",allowance:"uint256"},key:["grantor"]},PassHolder:{schema:{user:"address",passId:"bytes32",lastRenewed:"uint256",lastClaimed:"uint256"},key:["user","passId"]},PassConfig:{schema:{passId:"bytes32",claimAmount:"uint256",claimInterval:"uint256",validityPeriod:"uint256",grantor:"address"},key:["passId"]},Spender:{schema:{spender:"address",user:"address"},key:["spender"]},SystemConfig:{schema:{entryPoint:"address"},key:[]}}}}}),R=Tr.namespaces.root.tables;import{getRecord as Ir,getStaticDataLocation as Hr}from"@latticexyz/store/internal";import{getKeyTuple as Or}from"@latticexyz/protocol-parser/internal";import{setStorageAt as zr}from"viem/actions";function h(e){let t=e.contracts??{};if("quarryPaymaster"in t&&t.quarryPaymaster!=null&&"address"in t.quarryPaymaster)return{type:"quarry",address:t.quarryPaymaster.address};if("paymaster"in t&&t.paymaster!=null&&"address"in t.paymaster)return{type:"simple",address:t.paymaster.address}}async function Be({client:e,userAddress:t}){let r=h(e.chain);return r?.type!=="quarry"?null:(await Ir(e,{address:r.address,table:R.Allowance,key:{user:t},blockTag:"pending"})).allowance}async function Le({client:e,userAddress:t,allowance:r}){let o=h(e.chain);if(o?.type!=="quarry")return;let n=Hr(R.Allowance.tableId,Or(R.Allowance,{user:t}));await zr(e.extend(()=>({mode:"anvil"})),{address:o.address,index:n,value:Mr(r,{size:32})})}function de({client:e,userAddress:t}){let r=["getAllowance",e?.chain.id,t];return Br(e&&t?{queryKey:r,queryFn:()=>Be({client:e,userAddress:t})}:{queryKey:r,enabled:!1})}function Fe(e){let{chainId:t}=l(),r=qr({chainId:t});return Lr(de({client:r,userAddress:e}))}import{useClient as Gi}from"wagmi";import{queryOptions as Kr,useQuery as Vi}from"@tanstack/react-query";import{getRecord as Fr}from"@latticexyz/store/internal";async function Ke({client:e,userAddress:t,sessionAddress:r}){let o=h(e.chain);return o?.type!=="quarry"?null:(await Fr(e,{address:o.address,table:R.Spender,key:{spender:r},blockTag:"pending"})).user.toLowerCase()===t.toLowerCase()}function De({client:e,userAddress:t,sessionAddress:r}){let o=["getSpender",e?.chain.id,t,r];return Kr(e&&t&&r?{queryKey:o,queryFn:()=>Ke({client:e,userAddress:t,sessionAddress:r})}:{queryKey:o,enabled:!1})}import{useClient as ds}from"wagmi";import{queryOptions as Wr,useQuery as ps}from"@tanstack/react-query";import{getRecord as Vr}from"@latticexyz/store/internal";import{resourceToHex as Dr}from"@latticexyz/common";import{parseAbi as Gr}from"viem";import Qr from"@latticexyz/world/mud.config";var Ge={pollingInterval:250},B=Dr({type:"system",namespace:"",name:"unlimited"}),Qe=Qr.namespaces.world.tables,Ve=Gr(["function registerDelegation(address delegatee, bytes32 delegationControlId, bytes initCallData)"]);async function We({client:e,worldAddress:t,userAddress:r,sessionAddress:o}){return(await Vr(e,{address:t,table:Qe.UserDelegationControl,key:{delegator:r,delegatee:o},blockTag:"pending"})).delegationControlId===B}function _e({client:e,worldAddress:t,userAddress:r,sessionAddress:o}){let n=["getDelegation",e?.chain.id,t,r,o];return Wr(e&&r&&o?{queryKey:n,queryFn:()=>We({client:e,worldAddress:t,userAddress:r,sessionAddress:o})}:{queryKey:n,enabled:!1})}import{queryOptions as oo,useQuery as no,useQueryClient as ao}from"@tanstack/react-query";import{useClient as io,useConfig as so}from"wagmi";import{useClient as eo}from"wagmi";import{queryOptions as to,useQuery as ro}from"@tanstack/react-query";import{toSimpleSmartAccount as Jr}from"permissionless/accounts";import{isHex as jr}from"viem";import{createStore as _r}from"zustand/vanilla";import{persist as Yr}from"zustand/middleware";var L=_r(Yr(()=>({signers:{}}),{name:"mud:entrykit",partialize:({signers:e})=>({signers:e})}));function Xr(e){e.key===L.persist.getOptions().name&&L.persist.rehydrate()}window.addEventListener("storage",Xr);import{generatePrivateKey as $r,privateKeyToAccount as Zr}from"viem/accounts";function Ye(e){let t=e.toLowerCase(),r=L.getState().signers[t]??(()=>{let o=localStorage.getItem(`mud:appSigner:privateKey:${e.toLowerCase()}`)?.replace(/^"(.*)"$/,"$1"),n=jr(o)?o:$r();return L.setState(a=>({signers:{...a.signers,[t]:n}})),n})();return Zr(r)}async function Xe({client:e,userAddress:t}){let r=Ye(t);return await Jr({client:e,owner:r})}function ce({client:e,userAddress:t}){let r=["getSessionAccount",e?.chain.id,t];return to(e&&t?{queryKey:r,queryFn:()=>Xe({client:e,userAddress:t}),staleTime:1/0}:{queryKey:r,enabled:!1})}function je(e){let{chainId:t}=l(),r=eo({chainId:t});return ro(ce({userAddress:e,client:r}))}import{getBalanceQueryOptions as lo}from"wagmi/query";function co({queryClient:e,config:t,client:r,userAddress:o,worldAddress:n}){let a=["getPrerequisites",r?.chain.id,o];return oo(r&&o?{queryKey:a,queryFn:async()=>{let i=h(r.chain),{address:s}=await e.fetchQuery(ce({client:r,userAddress:o})),[c,g,m,d]=await Promise.all([i?null:e.fetchQuery(lo(t,{chainId:r.chain.id,address:s})),i?.type==="quarry"?e.fetchQuery(de({client:r,userAddress:o})):null,i?.type==="quarry"?e.fetchQuery(De({client:r,userAddress:o,sessionAddress:s})):null,e.fetchQuery(_e({client:r,worldAddress:n,userAddress:o,sessionAddress:s}))]),p=g==null||g>=P,f=m??!0,G=c==null||c.value>=P;return{sessionAddress:s,hasAllowance:p,isSpender:f,hasGasBalance:G,hasDelegation:d,complete:p&&f&&d}}}:{queryKey:a,enabled:!1})}function T(e){let t=ao(),{chainId:r,worldAddress:o}=l(),n=so(),a=io({chainId:r});return no(co({config:n,queryClient:t,client:a,userAddress:e,worldAddress:o}),t)}import{useDisconnect as uo}from"wagmi";import{useQuery as po}from"@tanstack/react-query";function X(e){let t=e?.toLowerCase();return po({enabled:!!t,queryKey:["ens",t],queryFn:async()=>{let r=await fetch(`https://api.ensideas.com/ens/resolve/${t}`).then(o=>o.json());return{address:r.address??void 0,name:r.name??void 0,displayName:r.displayName??void 0,avatar:r.avatar??void 0}}})}import{jsx as pe,jsxs as mo}from"react/jsx-runtime";function M({hex:e}){return e.length<=10?pe("span",{title:e,children:e}):mo("span",{title:e,children:[pe("span",{className:"after:select-none after:content-['\u2026']",children:e.slice(0,6)}),pe("span",{className:"tracking-[-1ch] text-transparent",children:e.slice(6,-4)}),e.slice(-4)]})}import{useEffect as go}from"react";import{jsx as F,jsxs as me}from"react/jsx-runtime";function $e({isActive:e,isExpanded:t,userAddress:r}){let{data:o,error:n}=X(r);go(()=>{n&&console.log("Could not get ENS",n)},[n]);let{disconnect:a,isPending:i}=uo(),{closeAccountModal:s}=v();return me("div",{className:"flex flex-col gap-4",children:[me("div",{className:"flex justify-between gap-4",children:[me("div",{children:[F("div",{children:"Account"}),F("div",{className:"font-mono text-white",children:o?.name??F(M,{hex:r})})]}),F(y,{variant:e?"primary":"tertiary",className:"flex-shrink-0 text-sm p-1 w-28",autoFocus:e,pending:i,onClick:()=>{s(),a()},children:"Sign out"})]}),t?F("p",{className:"text-sm",children:"Each of your onchain actions in this app is associated with your account."}):null]})}import{parseEther as yo}from"viem";import{useMutation as bo,useQueryClient as wo}from"@tanstack/react-query";import{http as fo}from"viem";function Ze(){return({chain:e})=>{if(!e)throw new Error("No chain provided to issuer transport.");let t="quarryPassIssuer"in e.rpcUrls?e.rpcUrls.quarryPassIssuer.http[0]:void 0;if(!t)throw new Error(`No \`quarryPassIssuer\` RPC URL found for chain ${e.id}.`);return fo(t)({chain:e,retryCount:0})}}import Je from"debug";var ue=Je("mud:entrykit"),ho=Je("mud:entrykit");ue.log=console.debug.bind(console);ho.log=console.error.bind(console);var I=ue.extend("quarry");async function et({chain:e,userAddress:t}){let r=Ze()({chain:e});I("Issuing gas pass to",t),await r.request({method:"quarry_issuePass",params:["0x01",t]}),I("Claiming gas allowance for",t),await r.request({method:"quarry_claimAllowance",params:["0x01",t]})}import{useClient as xo}from"wagmi";function tt(){let e=wo(),{chain:t}=l(),r=xo({chainId:t.id}),o=["claimGasPass",t.id];return bo({mutationKey:o,onError:n=>console.error(n),mutationFn:async n=>{if(t.id===31337){if(!r)throw new Error("No client?");await Le({client:r,userAddress:n,allowance:yo("1")})}else await et({chain:t,userAddress:n});await Promise.all([e.invalidateQueries({queryKey:["getAllowance"]}),e.invalidateQueries({queryKey:["getPrerequisites"]})])},retry:0})}import{twMerge as vo}from"tailwind-merge";import{jsx as j,jsxs as Co}from"react/jsx-runtime";function rt({className:e,...t}){return Co("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 263 428",fill:"currentColor",className:vo("w-[0.6em] h-[1em]",e),...t,children:[j("path",{d:"M132 321V428L263 243L132 321Z"}),j("path",{d:"M0 243L132 321V428",fillOpacity:"0.5"}),j("path",{d:"M132 0V296L263 218"}),j("path",{d:"M0 218L132 296V0L0 218Z",fillOpacity:"0.5"})]})}import{formatEther as ko}from"viem";function ot(e){let t=ko(e),r=Math.floor(parseFloat(t)).toString().length;return parseFloat(t).toLocaleString("en-US",{maximumFractionDigits:Math.max(0,6-r)})}import{formatEther as So}from"viem";import{jsx as Ao,jsxs as Po}from"react/jsx-runtime";function $({wei:e}){return Po("span",{className:"inline-flex items-center gap-1",title:So(e),children:[ot(e)," ",Ao(rt,{})]})}import{useEffect as Uo}from"react";import{jsx as H,jsxs as ge}from"react/jsx-runtime";function nt({isActive:e,isExpanded:t,userAddress:r}){let o=Fe(r),n=tt();return Uo(()=>{let a=setTimeout(()=>{e&&n.status==="idle"&&o.isSuccess&&o.data!=null&&o.data<P&&n.mutate(r)});return()=>clearTimeout(a)},[o.data,o.isSuccess,n,e,r]),ge("div",{className:"flex flex-col gap-4",children:[ge("div",{className:"flex justify-between gap-4",children:[ge("div",{children:[H("div",{children:"Allowance"}),H("div",{className:"font-mono text-white",children:o.data!=null?H($,{wei:o.data}):H(b,{className:"text-sm"})})]}),H(y,{variant:e?"primary":"tertiary",className:"flex-shrink-0 text-sm p-1 w-28",autoFocus:e||t,pending:o.status==="pending"||n.status==="pending",onClick:()=>n.mutate(r),children:"Top up"})]}),t?H("p",{className:"text-sm",children:"Your allowance is used to pay for onchain computation."}):null]})}import{encodeFunctionData as it}from"viem";import{useMutation as Bo,useQueryClient as Lo}from"@tanstack/react-query";import{getAction as he}from"viem/utils";import{sendUserOperation as Fo,waitForUserOperationReceipt as Ko}from"viem/account-abstraction";import{waitForTransactionReceipt as Do}from"viem/actions";import{useClient as Go}from"wagmi";import{resourceToHex as st}from"@latticexyz/common";import Qo from"@latticexyz/world/out/IBaseWorld.sol/IBaseWorld.abi.json";import{writeContract as Oo}from"viem/actions";import{getAction as zo}from"viem/utils";import{toHex as No}from"viem";import{signTypedData as Eo}from"viem/actions";import{callWithSignatureTypes as Ro}from"@latticexyz/world-module-callwithsignature/internal";import{getRecord as To}from"@latticexyz/store/internal";import Mo from"@latticexyz/world-module-callwithsignature/mud.config";import{hexToResource as Io}from"@latticexyz/common";import{getAction as Ho}from"viem/utils";async function at({userClient:e,worldAddress:t,systemId:r,callData:o,nonce:n,client:a}){let i=n??(a?(await To(a,{address:t,table:Mo.tables.CallWithSignatureNonces,key:{signer:e.account.address},blockTag:"pending"})).nonce:0n),{namespace:s,name:c}=Io(r);return await Ho(e,Eo,"signTypedData")({account:e.account,domain:{verifyingContract:t,salt:No(e.chain.id,{size:32})},types:Ro,primaryType:"Call",message:{signer:e.account.address,systemNamespace:s,systemName:c,callData:o,nonce:i}})}import qo from"@latticexyz/world-module-callwithsignature/out/CallWithSignatureSystem.sol/CallWithSignatureSystem.abi.json";async function fe({sessionClient:e,...t}){let r=await at(t);return zo(e,Oo,"writeContract")({address:t.worldAddress,abi:qo,functionName:"callWithSignature",args:[t.userClient.account.address,t.systemId,t.callData,r]})}function lt({userClient:e}){let t=Lo(),{chainId:r,worldAddress:o}=l(),n=Go({chainId:r}),a=["setupSession",n?.chain.id,e.account.address];return Bo({mutationKey:a,onError:i=>console.error(i),mutationFn:async({sessionClient:i,registerSpender:s,registerDelegation:c})=>{if(!n)throw new Error("Client not ready.");let g=h(n.chain),m=i.account.address;if(console.log("setting up session"),e.account.type==="smart"){let d=[];if(s&&g?.type==="quarry"&&(console.log("registering spender"),d.push({to:g.address,abi:le,functionName:"registerSpender",args:[m]})),c&&(console.log("registering delegation"),d.push({to:o,abi:Ve,functionName:"registerDelegation",args:[m,B,"0x"]})),!d.length)return;console.log("setting up account with",d,e);let p=await he(e,Fo,"sendUserOperation")({calls:d});console.log("got user op hash",p);let f=await he(e,Ko,"waitForUserOperationReceipt")({hash:p});console.log("got user op receipt",f),f.success||console.error("not successful?",f)}else{let d=[];if(s&&g?.type==="quarry"){console.log("registering spender");let p=await fe({client:n,userClient:e,sessionClient:i,worldAddress:g.address,systemId:st({type:"system",namespace:"",name:"SpenderSystem"}),callData:it({abi:le,functionName:"registerSpender",args:[m]})});console.log("got spender tx",p),d.push(p)}if(c){console.log("registering delegation");let p=await fe({client:n,userClient:e,sessionClient:i,worldAddress:o,systemId:st({type:"system",namespace:"",name:"Registration"}),callData:it({abi:Qo,functionName:"registerDelegation",args:[m,B,"0x"]})});console.log("got delegation tx",p),d.push(p)}if(!d.length)return;console.log("waiting for",d.length,"receipts");for(let p of d){let f=await he(n,Do,"waitForTransactionReceipt")({hash:p});console.log("got tx receipt",f),f.status==="reverted"&&console.error("tx reverted?",f)}}await Promise.all([t.invalidateQueries({queryKey:["getSpender"]}),t.invalidateQueries({queryKey:["getDelegation"]}),t.invalidateQueries({queryKey:["getPrerequisites"]})])},retry:0})}import{useEffect as wn}from"react";import{useClient as gn}from"wagmi";import{queryOptions as fn,useQuery as hn}from"@tanstack/react-query";import{smartAccountActions as mn}from"permissionless";import{callFrom as un}from"@latticexyz/world/internal";import{createBundlerClient as Vo}from"viem/account-abstraction";var Wo=new Set([31337,17420,17069,690]);function dt(e){let t=e.chain??e.client?.chain,r=t?h(t):void 0;return Vo({...Ge,paymaster:r?{getPaymasterData:async()=>({paymaster:r.address,paymasterData:"0x"})}:void 0,userOperation:{estimateFeesPerGas:t&&Wo.has(t.id)?async()=>({maxFeePerGas:100000n,maxPriorityFeePerGas:0n}):void 0},...e})}import{transactionQueue as nn}from"@latticexyz/common/actions";import{createClient as an,fallback as sn,http as yt,keccak256 as ln,stringToHex as dn,webSocket as cn}from"viem";import{privateKeyToAccount as pn}from"viem/accounts";import{createTransport as en,numberToHex as tn,parseEther as rn}from"viem";import{entryPoint07Address as ft}from"viem/account-abstraction";import{formatUserOperationRequest as _o}from"viem/account-abstraction";async function ct(e){return _o({callGasLimit:20000000n,preVerificationGas:200000n,verificationGasLimit:2000000n,paymasterVerificationGasLimit:200000n,paymasterPostOpGasLimit:200000n})}import{parseEventLogs as Yo}from"viem";import{formatUserOperation as Xo,toPackedUserOperation as jo,getUserOperationHash as $o,entryPoint07Address as pt,entryPoint07Abi as mt}from"viem/account-abstraction";import{waitForTransactionReceipt as Zo,writeContract as Jo}from"viem/actions";import{getAction as ut}from"viem/utils";async function gt({executor:e,rpcUserOp:t}){let r=Xo(t),o=jo(r),n=$o({userOperation:r,chainId:e.chain.id,entryPointVersion:"0.7",entryPointAddress:pt}),a=await ut(e,Jo,"writeContract")({abi:mt,address:pt,functionName:"handleOps",args:[[o],e.account.address],chain:e.chain,account:e.account}),i=await ut(e,Zo,"waitForTransactionReceipt")({hash:a});return{success:Yo({logs:i.logs,abi:mt,eventName:"UserOperationEvent"})[0].args.success,userOpHash:n,receipt:i}}import{setBalance as on}from"viem/actions";function ht({executor:e}){return()=>{I("using a local user op executor",e.account.address),e.chain.id===31337&&(I("setting executor balance"),on(e.extend(()=>({mode:"anvil"})),{address:e.account.address,value:rn("100")}));let t=new Map;return en({key:"userOpExecutor",type:"userOpExecutor",name:"User Operation Executor Transport",request:async({method:o,params:n})=>{if(o==="eth_chainId")return tn(e.chain.id);if(o==="eth_supportedEntryPoints")return[ft];if(o==="eth_sendUserOperation"){let[a,i]=n;if(i===ft){let s=await gt({executor:e,rpcUserOp:a});return t.set(s.userOpHash,s),s.userOpHash}}if(o==="eth_getUserOperationReceipt"){let[a]=n;return t.get(a)??null}if(o==="eth_estimateUserOperationGas")return await ct(n);throw new Error("Method not implemented.")}})}}function bt(e){let t=e.rpcUrls.bundler?.http[0],r=t?yt(t):e.id===31337?ht({executor:an({chain:e,transport:sn([cn(),yt()]),account:pn(ln(dn("local user op executor"))),pollingInterval:10}).extend(nn())}):null;if(!r)throw new Error(`Chain ${e.id} config did not include a bundler RPC URL.`);return r}async function wt({client:e,userAddress:t,sessionAccount:r,worldAddress:o}){let n=bt(e.chain);return dt({transport:n,client:e,account:r}).extend(mn).extend(un({worldAddress:o,delegatorAddress:t,publicClient:e})).extend(()=>({userAddress:t}))}import{useEffect as yn}from"react";function bn({sessionAccount:e,client:t,userAddress:r,worldAddress:o}){let n=["getSessionClient",t?.uid,r,e?.address,o];return fn(t&&r&&e?{queryKey:n,queryFn:()=>wt({sessionAccount:e,client:t,userAddress:r,worldAddress:o}),staleTime:1/0}:{queryKey:n,enabled:!1})}function Z(e){let{chainId:t,worldAddress:r}=l(),o=gn({chainId:t}),{data:n,error:a}=je(e);return yn(()=>{a&&console.error("Could not get session account",a)},[a]),hn(bn({sessionAccount:n,userAddress:e,client:o,worldAddress:r}))}import{jsx as K,jsxs as ye}from"react/jsx-runtime";function xt({isActive:e,isExpanded:t,userClient:r,registerSpender:o,registerDelegation:n}){let a=Z(r.account.address),i=lt({userClient:r}),s=!n&&!n;return wn(()=>{let c=setTimeout(()=>{e&&i.status==="idle"&&a.data&&!s&&i.mutate({sessionClient:a.data,registerSpender:o,registerDelegation:n})});return()=>clearTimeout(c)},[s,e,n,o,a,i]),ye("div",{className:"flex flex-col gap-4",children:[ye("div",{className:"flex justify-between gap-4",children:[ye("div",{children:[K("div",{children:"Session"}),K("div",{className:"font-mono text-white",children:s?"Enabled":"Set up"})]}),s?K(y,{variant:"tertiary",className:"flex-shrink-0 text-sm p-1 w-28",autoFocus:e,disabled:!0,children:"Enabled"}):K(y,{variant:e?"primary":"tertiary",className:"flex-shrink-0 text-sm p-1 w-28",autoFocus:e,pending:!a.data||i.status==="pending",onClick:a.data?()=>i.mutate({sessionClient:a.data,registerSpender:o,registerDelegation:n}):void 0,children:"Enable"})]}),t?K("p",{className:"text-sm",children:"You can perform actions in this app without interruptions for approvals."}):null]})}import{useBalance as An}from"wagmi";var vt={"1":{bridgeUrl:"https://relay.link/bridge/ethereum"},"10":{bridgeUrl:"https://relay.link/bridge/optimism"},"56":{bridgeUrl:"https://relay.link/bridge/bnb"},"100":{bridgeUrl:"https://relay.link/bridge/gnosis"},"111":{bridgeUrl:"https://testnets.relay.link/bridge/bob"},"137":{bridgeUrl:"https://relay.link/bridge/polygon"},"185":{bridgeUrl:"https://relay.link/bridge/mint"},"288":{bridgeUrl:"https://relay.link/bridge/boba"},"324":{bridgeUrl:"https://relay.link/bridge/zksync"},"360":{bridgeUrl:"https://relay.link/bridge/shape"},"480":{bridgeUrl:"https://relay.link/bridge/world-chain"},"690":{bridgeUrl:"https://relay.link/bridge/redstone"},"919":{bridgeUrl:"https://testnets.relay.link/bridge/mode-testnet"},"1101":{bridgeUrl:"https://relay.link/bridge/polygon-zkevm"},"1135":{bridgeUrl:"https://relay.link/bridge/lisk"},"1301":{bridgeUrl:"https://testnets.relay.link/bridge/unichain-sepolia"},"1329":{bridgeUrl:"https://relay.link/bridge/sei"},"1625":{bridgeUrl:"https://relay.link/bridge/gravity"},"1868":{bridgeUrl:"https://relay.link/bridge/soneium"},"1993":{bridgeUrl:"https://testnets.relay.link/bridge/b3"},"1996":{bridgeUrl:"https://relay.link/bridge/sanko"},"2741":{bridgeUrl:"https://relay.link/bridge/abstract"},"2911":{bridgeUrl:"https://relay.link/bridge/hychain"},"4202":{bridgeUrl:"https://testnets.relay.link/bridge/lisk-sepolia"},"4321":{bridgeUrl:"https://relay.link/bridge/echos"},"5000":{bridgeUrl:"https://relay.link/bridge/mantle"},"5112":{bridgeUrl:"https://relay.link/bridge/ham"},"7560":{bridgeUrl:"https://relay.link/bridge/cyber"},"7865":{bridgeUrl:"https://relay.link/bridge/powerloom"},"7897":{bridgeUrl:"https://relay.link/bridge/arena-z"},"8333":{bridgeUrl:"https://relay.link/bridge/B3"},"8453":{bridgeUrl:"https://relay.link/bridge/base"},"9897":{bridgeUrl:"https://testnets.relay.link/bridge/arena-z-testnet"},"11011":{bridgeUrl:"https://testnets.relay.link/bridge/shape-sepolia"},"11124":{bridgeUrl:"https://testnets.relay.link/bridge/abstract"},"13746":{bridgeUrl:"https://testnets.relay.link/bridge/game7-testnet"},"17000":{bridgeUrl:"https://testnets.relay.link/bridge/holesky"},"17069":{bridgeUrl:"https://testnets.relay.link/bridge/garnet"},"17071":{bridgeUrl:"https://relay.link/bridge/onchain-points"},"33139":{bridgeUrl:"https://relay.link/bridge/apechain"},"33979":{bridgeUrl:"https://relay.link/bridge/funki"},"34443":{bridgeUrl:"https://relay.link/bridge/mode"},"42161":{bridgeUrl:"https://relay.link/bridge/arbitrum"},"42170":{bridgeUrl:"https://relay.link/bridge/arbitrum-nova"},"43114":{bridgeUrl:"https://relay.link/bridge/avalanche"},"55244":{bridgeUrl:"https://relay.link/bridge/superposition"},"57073":{bridgeUrl:"https://relay.link/bridge/ink"},"59144":{bridgeUrl:"https://relay.link/bridge/linea"},"60808":{bridgeUrl:"https://relay.link/bridge/bob"},"70700":{bridgeUrl:"https://relay.link/bridge/apex"},"70701":{bridgeUrl:"https://relay.link/bridge/boss"},"70800":{bridgeUrl:"https://testnets.relay.link/bridge/apex-testnet"},"70805":{bridgeUrl:"https://testnets.relay.link/bridge/cloud"},"80002":{bridgeUrl:"https://testnets.relay.link/bridge/amoy"},"81457":{bridgeUrl:"https://relay.link/bridge/blast"},"84532":{bridgeUrl:"https://testnets.relay.link/bridge/base-sepolia"},"167009":{bridgeUrl:"https://testnets.relay.link/bridge/hekla"},"421614":{bridgeUrl:"https://testnets.relay.link/bridge/arbitrum-sepolia"},"534352":{bridgeUrl:"https://relay.link/bridge/scroll"},"543210":{bridgeUrl:"https://relay.link/bridge/zero-network"},"660279":{bridgeUrl:"https://relay.link/bridge/xai"},"911867":{bridgeUrl:"https://testnets.relay.link/bridge/odyssey"},"984122":{bridgeUrl:"https://relay.link/bridge/forma"},"1118190":{bridgeUrl:"https://testnets.relay.link/bridge/eclipse-testnet"},"3397901":{bridgeUrl:"https://testnets.relay.link/bridge/funki-testnet"},"4457845":{bridgeUrl:"https://testnets.relay.link/bridge/zero-sepolia"},"7777777":{bridgeUrl:"https://relay.link/bridge/zora"},"8253038":{bridgeUrl:"https://relay.link/bridge/bitcoin"},"9092725":{bridgeUrl:"https://testnets.relay.link/bridge/bitcoin-testnet4"},"9286185":{bridgeUrl:"https://relay.link/bridge/eclipse"},"11155111":{bridgeUrl:"https://testnets.relay.link/bridge/sepolia"},"11155420":{bridgeUrl:"https://testnets.relay.link/bridge/op-sepolia"},"666666666":{bridgeUrl:"https://relay.link/bridge/degen"},"792703809":{bridgeUrl:"https://relay.link/bridge/solana"},"888888888":{bridgeUrl:"https://relay.link/bridge/ancient8"},"999999999":{bridgeUrl:"https://testnets.relay.link/bridge/zora-sepolia"},"1380012617":{bridgeUrl:"https://relay.link/bridge/rari"},"1936682084":{bridgeUrl:"https://testnets.relay.link/bridge/solana-devnet"},"88153591557":{bridgeUrl:"https://testnets.relay.link/bridge/arbitrum-blueberry"}};import{useQueryClient as vn,useMutation as Cn}from"@tanstack/react-query";import{setBalance as kn}from"viem/actions";import{useClient as Sn}from"wagmi";function Ct(){let e=vn(),{chainId:t}=l(),r=Sn({chainId:t});return Cn({mutationKey:["setBalance",t],onError:o=>console.error(o),mutationFn:async o=>(r&&(await kn({...r,mode:"anvil"},o),await Promise.all([e.invalidateQueries({queryKey:["balance"]}),e.invalidateQueries({queryKey:["getPrerequisites"]})])),null),retry:0})}import{Fragment as Pn,jsx as w,jsxs as D}from"react/jsx-runtime";function kt({isActive:e,isExpanded:t,sessionAddress:r}){let{chain:o}=l(),n=An({chainId:o.id,address:r,query:{refetchInterval:2e3}}),a=Ct(),i=vt[o.id];return D("div",{className:"flex flex-col gap-4",children:[D("div",{className:"flex justify-between gap-4",children:[D("div",{children:[w("div",{children:"Gas balance"}),w("div",{className:"font-mono text-white",children:n.data!=null?w($,{wei:n.data.value}):w(b,{className:"text-sm"})})]}),o.id===31337?w(y,{variant:e?"primary":"tertiary",className:"flex-shrink-0 text-sm p-1 w-28",autoFocus:e||t,pending:n.status==="pending"||a.status==="pending",onClick:()=>a.mutate({address:r,value:P+(n.data?.value??0n)}),children:"Top up"}):i!=null?w("a",{href:`${i.bridgeUrl}?${new URLSearchParams({toAddress:r})}`,target:"_blank",rel:"noopener noreferrer",children:w(y,{variant:e?"primary":"tertiary",className:"flex-shrink-0 text-sm p-1 w-28",autoFocus:e||t,pending:n.status==="pending",children:"Top up"})}):null]}),t?D(Pn,{children:[w("p",{className:"text-sm",children:"Your session's gas balance is used to pay for onchain computation."}),D("p",{className:"text-sm",children:["Send funds to"," ",w("span",{className:"font-mono text-white",children:w(M,{hex:r})})," ","on ",o.name," to top up your session balance."]})]}):null]})}import{jsx as U}from"react/jsx-runtime";function At({userClient:e,initialUserAddress:t}){let{chain:r}=l(),o=h(r),n=e.account.address,{data:a,error:i}=T(n);St(()=>{i&&console.error("Could not get prerequisites",i)},[i]);let{closeAccountModal:s}=v(),c=n!==t,g=Nn(a);St(()=>{a!=null&&(g.current==null&&(g.current=a),a.complete&&(c||!g.current.complete)&&s())},[s,c,a]);let{sessionAddress:m,hasAllowance:d,isSpender:p,hasDelegation:f,hasGasBalance:G}=a??{},A=Un(()=>{if(!n)return[{id:"wallet",isComplete:!1,content:()=>null}];let u=[{id:"wallet",isComplete:!0,content:x=>U($e,{...x,userAddress:n})}];return o?o.type==="quarry"&&u.push({id:"allowance",isComplete:!!d,content:x=>U(nt,{...x,userAddress:n})}):m!=null&&u.push({id:"gasBalance",isComplete:!!G,content:x=>U(kt,{...x,sessionAddress:m})}),u.push({id:"session",isComplete:!!p&&!!f,content:x=>U(xt,{...x,userClient:e,registerSpender:!p,registerDelegation:!f})}),u},[d,f,G,p,o,m,n,e]),[xe]=En(null),Dt=A.find(u=>u.content!=null&&!u.isComplete),re=A.filter(u=>u.isComplete),oe=(xe!=null?A.find(u=>u.id===xe):null)??Dt??(re.length<A.length?re.at(-1):null),ve=oe?A.indexOf(oe):-1;return U("div",{className:be("px-8 flex flex-col divide-y divide-neutral-800","animate-in animate-duration-300 fade-in slide-in-from-bottom-8"),children:A.map((u,x)=>{let ne=u===oe,Gt=ne||re.length===A.length,Qt=!u.isComplete&&ve!==-1&&x>ve;return U("div",{className:be("py-8 flex flex-col justify-center",ne?"flex-grow":null),children:U("div",{className:be("flex flex-col",Qt?"opacity-30 pointer-events-none":null),children:u.content({isActive:ne,isExpanded:Gt})})},u.id)})})}import{useRef as Mn}from"react";import{jsx as Pt}from"react/jsx-runtime";function Ut(){let{chainId:e}=l(),t=Tn({chainId:e}),{address:r}=Rn(),o=Mn(r);return t.status!=="success"?Pt(qe,{}):Pt(At,{userClient:t.data,initialUserAddress:o.current})}import{useState as qn}from"react";import{ErrorBoundary as Bn}from"react-error-boundary";import{twMerge as In}from"tailwind-merge";import{BaseError as Hn,UserRejectedRequestError as On}from"viem";import{jsx as Nt,jsxs as zn}from"react/jsx-runtime";function Et({title:e,error:t}){if(!t||t instanceof Hn&&t.walk(n=>n instanceof On)!=null)return null;let r=e??"Error",o=typeof t=="string"?t:t instanceof Error?String(t):"Something unexpected happened.";return zn("div",{className:In("text-sm border-l-4 border-red-500","bg-red-100 text-red-900","dark:bg-red-900 dark:text-red-50"),children:[Nt("div",{className:"p-3 font-semibold",children:r}),Nt("div",{className:"px-3 whitespace-break-spaces break-all max-h-32 overflow-y-scroll",children:o})]})}import{wait as Ln}from"@latticexyz/common/utils";import{twMerge as Fn}from"tailwind-merge";import{useIsMounted as Kn}from"usehooks-ts";import{jsx as J,jsxs as Rt}from"react/jsx-runtime";function Tt({children:e}){let t=Kn(),[r,o]=qn(1);return J(Bn,{fallbackRender:({error:n,resetErrorBoundary:a})=>Rt("div",{className:Fn("flex-grow flex flex-col justify-center p-5 gap-2"),children:[J(Et,{error:n instanceof Error?n.stack??n.message:n}),r>0?Rt("button",{type:"button",onClick:async i=>{i.currentTarget.ariaBusy="true",await Ln(1e3),a(),t()&&(o(s=>s-1),i.currentTarget.ariaBusy=null)},className:"group aria-busy:pointer-events-none self-end flex items-center gap-1",children:[J(b,{className:"transition opacity-0 group-aria-busy:opacity-100 text-xs text-neutral-500 dark:text-neutral-400"}),J("span",{className:"text-sm text-neutral-500 dark:text-neutral-400 group-hover:text-black dark:group-hover:text-white",children:"Retry?"})]}):null]}),children:e})}import{DialogClose as Qn,DialogTitle as Vn}from"@radix-ui/react-dialog";import{twMerge as Dn}from"tailwind-merge";import{jsx as Gn}from"react/jsx-runtime";function Mt({className:e,children:t,...r}){return Gn("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:Dn("-my-[0.125em] h-[1.25em] w-[1.25em]",e),...r,children:t})}import{jsx as It}from"react/jsx-runtime";function Ht(e){return It(Mt,{strokeWidth:"2",stroke:"currentColor",...e,children:It("path",{d:"M6 18L18 6M6 6L18 18",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}import{jsx as C,jsxs as we}from"react/jsx-runtime";function zt(){let{accountModalOpen:e,toggleAccountModal:t}=v();return we(He,{open:e,onOpenChange:t,children:[C(Vn,{className:"sr-only",children:"Connect with EntryKit"}),e?we("div",{className:Ot("relative py-2 ring-1","bg-neutral-900 text-neutral-400 ring-neutral-700/50 divide-neutral-700","links:font-medium links:underline links:underline-offset-4","links:text-white","links:decoration-neutral-500 hover:links:decoration-orange-500"),children:[C(Tt,{children:C(Ut,{})}),we("a",{href:"https://mud.dev",target:"_blank",rel:"noreferrer noopener",className:"group self-center p-3 flex items-center justify-center gap-2 links-unset text-sm font-mono transition text-neutral-400 hover:text-white",children:[C("span",{className:"block w-4 h-4",children:C(S,{className:"w-full h-full text-orange-500 group-hover:rotate-90 transition duration-300"})}),C("span",{children:"Powered by MUD"})]}),C("div",{className:"absolute top-0 right-0",children:C(Qn,{className:Ot("pointer-events-auto leading-none p-2 transition","text-neutral-700 hover:text-neutral-500"),title:"Close",children:C(Ht,{className:"m-0"})})})]}):null]})}import{jsx as _n,jsxs as Yn}from"react/jsx-runtime";function Wn({config:e,children:t}){return Yn(Ee,{config:e,children:[t,_n(zt,{})]})}import{useAccount as $n}from"wagmi";import{twMerge as N}from"tailwind-merge";import{twMerge as qt}from"tailwind-merge";import{useEffect as Xn}from"react";import{Fragment as jn,jsx as ee,jsxs as Bt}from"react/jsx-runtime";function Lt({address:e}){let{data:t,error:r}=X(e),o=W(t?.avatar);return Xn(()=>{r&&console.log("Could not get ENS",r)},[r]),Bt(jn,{children:[Bt("span",{className:"flex-shrink-0 w-6 h-6 -my-1 -mx-0.5 grid place-items-center",children:[ee("img",{src:t?.avatar&&o.isSuccess?t.avatar:void 0,className:qt("col-start-1 row-start-1","inline-flex w-full h-full rounded-full bg-black/10 dark:bg-white/10 bg-cover bg-no-repeat bg-center","transtion duration-300",o.isSuccess?"opacity-100":"opacity-0")}),ee(S,{className:qt("col-start-1 row-start-1 text-orange-500","transition duration-300",t&&(!t.avatar||o.isError)?"opacity-100":"opacity-0")})]}),ee("span",{className:"flex-grow",children:t?.name??ee(M,{hex:e})})]})}import{useRef as Zn}from"react";import{jsx as k,jsxs as Kt}from"react/jsx-runtime";var Ft=N("w-48 p-3 inline-flex outline-none transition","border border-transparent","text-base leading-none"),Jn=N("bg-neutral-100 border-neutral-300 text-black","dark:bg-neutral-800 dark:border-neutral-700 dark:text-white"),ea=N("cursor-pointer outline-none hover:bg-neutral-200 data-[highlighted]:bg-neutral-200 dark:hover:bg-neutral-700");function ta(){let{openAccountModal:e,accountModalOpen:t}=v(),{status:r,address:o}=$n(),n=Zn(o),a=T(o),i=r==="connected"||r==="reconnecting"&&o,s=o!==n.current,c=a.isSuccess?a.data.complete:s?!1:i,g=(()=>{if(a.isSuccess){if(!a.data.hasAllowance)return"Top up";if(!a.data.hasDelegation||!a.data.isSpender)return"Set up"}return"Sign in"})();return k(Q,{mode:"child",children:c?k("button",{type:"button",className:N(Ft,Jn,ea),onClick:e,children:k("span",{className:"flex-grow inline-flex gap-2.5 items-center text-left font-medium",children:o?k(Lt,{address:o}):null})},"connected"):Kt("button",{type:"button",className:N(Ft,"group","items-center justify-center gap-2.5","bg-orange-500 text-white font-medium","hover:bg-orange-400","active:bg-orange-600"),"aria-busy":t,onClick:e,children:[Kt("span",{className:"pointer-events-none inline-grid place-items-center -ml-3",children:[k("span",{className:N("col-start-1 row-start-1 leading-none","scale-100 opacity-100 transition duration-300","group-aria-busy:scale-125 group-aria-busy:opacity-0"),children:k(S,{})}),k("span",{"aria-hidden":!0,className:N("col-start-1 row-start-1","scale-50 opacity-0 transition duration-300 delay-50","group-aria-busy:scale-100 group-aria-busy:opacity-100"),children:k(b,{})})]}),k("span",{className:"font-medium",children:g})]},"sign in")})}import{useConnectorClient as ra}from"wagmi";function oa(){let{chainId:e}=l(),t=ra({chainId:e});t.error&&console.error("Error retrieving user client",t.error);let r=t.data?.account.address,o=T(r),n=Z(r);return t.isSuccess?!o.isSuccess||!o.data.complete?{...o,data:void 0}:n:{...t,data:void 0}}import{connectorsForWallets as aa}from"@rainbow-me/rainbowkit";import{createConfig as ia}from"wagmi";import{getDefaultWallets as na}from"@rainbow-me/rainbowkit";function te(e){let{wallets:t}=na();return[...t]}function sa(e){let t=te(e),r=aa(t,{appName:e.appName,projectId:e.walletConnectProjectId});return ia({connectors:r,chains:e.chains,transports:e.transports,pollingInterval:e.pollingInterval})}import{connectorsForWallets as la}from"@rainbow-me/rainbowkit";function Pm({wallets:e,...t}){return la(e??te(t),{appName:t.appName,projectId:t.walletConnectProjectId})}export{ta as AccountButton,Wn as EntryKitProvider,sa as createWagmiConfig,Vt as defineConfig,Pm as getConnectors,te as getWallets,v as useAccountModal,l as useEntryKitConfig,oa as useSessionClient};
1973
+ return /* @__PURE__ */ jsx18(ConnectedSteps, { userClient: userClient.data, initialUserAddress: initialUserAddress.current });
1974
+ }
1975
+
1976
+ // src/AccountModal.tsx
1977
+ import { DialogClose, DialogTitle } from "@radix-ui/react-dialog";
1978
+
1979
+ // src/icons/IconSVG.tsx
1980
+ import { twMerge as twMerge8 } from "tailwind-merge";
1981
+ import { jsx as jsx19 } from "react/jsx-runtime";
1982
+ function IconSVG({ className, children, ...props }) {
1983
+ return /* @__PURE__ */ jsx19(
1984
+ "svg",
1985
+ {
1986
+ xmlns: "http://www.w3.org/2000/svg",
1987
+ viewBox: "0 0 24 24",
1988
+ fill: "currentColor",
1989
+ className: twMerge8("-my-[0.125em] h-[1.25em] w-[1.25em]", className),
1990
+ ...props,
1991
+ children
1992
+ }
1993
+ );
1994
+ }
1995
+
1996
+ // src/icons/CloseIcon.tsx
1997
+ import { jsx as jsx20 } from "react/jsx-runtime";
1998
+ function CloseIcon(props) {
1999
+ return /* @__PURE__ */ jsx20(IconSVG, { strokeWidth: "2", stroke: "currentColor", ...props, children: /* @__PURE__ */ jsx20(
2000
+ "path",
2001
+ {
2002
+ d: "M6 18L18 6M6 6L18 18",
2003
+ fill: "none",
2004
+ stroke: "currentColor",
2005
+ strokeWidth: "2",
2006
+ strokeLinecap: "round",
2007
+ strokeLinejoin: "round"
2008
+ }
2009
+ ) });
2010
+ }
2011
+
2012
+ // src/AccountModal.tsx
2013
+ import { ErrorBoundary } from "react-error-boundary";
2014
+
2015
+ // src/errors/ErrorOverlay.tsx
2016
+ import { wait } from "@latticexyz/common/utils";
2017
+ import { useEffect as useEffect8 } from "react";
2018
+ import { twMerge as twMerge9 } from "tailwind-merge";
2019
+ import { Fragment as Fragment2, jsx as jsx21, jsxs as jsxs15 } from "react/jsx-runtime";
2020
+ function ErrorOverlay({ error: error2, retry, dismiss }) {
2021
+ useEffect8(() => {
2022
+ if (error2) {
2023
+ console.error(error2);
2024
+ }
2025
+ }, [error2]);
2026
+ return /* @__PURE__ */ jsxs15("div", { className: "pointer-events-none absolute inset-0 overflow-clip", children: [
2027
+ /* @__PURE__ */ jsx21(
2028
+ "div",
2029
+ {
2030
+ className: twMerge9(
2031
+ "absolute inset-0 bg-blue-700/60",
2032
+ "transition duration-300",
2033
+ error2 ? "opacity-100 pointer-events-auto" : "opacity-0"
2034
+ )
2035
+ }
2036
+ ),
2037
+ /* @__PURE__ */ jsx21(
2038
+ "div",
2039
+ {
2040
+ className: twMerge9(
2041
+ "absolute inset-0 pb-8",
2042
+ "transition duration-300",
2043
+ error2 ? "translate-y-0 opacity-100 pointer-events-auto" : "-translate-y-4 opacity-0"
2044
+ ),
2045
+ children: error2 ? /* @__PURE__ */ jsx21(Fragment2, { children: /* @__PURE__ */ jsxs15("div", { className: "w-full max-h-full bg-blue-700 text-white/80 overflow-auto", children: [
2046
+ /* @__PURE__ */ jsxs15("div", { className: "space-y-6 px-8 pt-8", children: [
2047
+ /* @__PURE__ */ jsx21("div", { className: "text-white text-lg font-bold", children: "Oops! It broke :(" }),
2048
+ /* @__PURE__ */ jsx21("div", { className: "font-mono text-xs whitespace-pre-wrap", children: error2.message.trim() }),
2049
+ /* @__PURE__ */ jsx21("div", { className: "text-sm", children: "See the console for more info." })
2050
+ ] }),
2051
+ /* @__PURE__ */ jsxs15("div", { className: "pointer-events-none sticky bottom-0 left-0 -mt-2", children: [
2052
+ /* @__PURE__ */ jsx21("div", { className: "w-full h-12 bg-gradient-to-b from-transparent to-blue-700" }),
2053
+ retry ? /* @__PURE__ */ jsx21("div", { className: "bg-blue-700 text-center", children: /* @__PURE__ */ jsxs15(
2054
+ "button",
2055
+ {
2056
+ type: "button",
2057
+ className: twMerge9(
2058
+ "pointer-events-auto group w-24 p-1 -translate-y-2 transition",
2059
+ "bg-blue-600 hover:bg-blue-500 aria-busy:bg-blue-500",
2060
+ "text-white text-sm font-medium",
2061
+ "aria-busy:pointer-events-none"
2062
+ ),
2063
+ onClick: async (event) => {
2064
+ event.currentTarget.ariaBusy = "true";
2065
+ await wait(500);
2066
+ retry();
2067
+ if (event.currentTarget) {
2068
+ event.currentTarget.ariaBusy = null;
2069
+ }
2070
+ },
2071
+ children: [
2072
+ /* @__PURE__ */ jsx21("span", { className: "group-aria-busy:hidden", children: "Retry" }),
2073
+ /* @__PURE__ */ jsx21("span", { className: "hidden group-aria-busy:inline", children: "Retrying\u2026" })
2074
+ ]
2075
+ }
2076
+ ) }) : dismiss ? /* @__PURE__ */ jsx21("div", { className: "bg-blue-700 text-center", children: /* @__PURE__ */ jsx21(
2077
+ "button",
2078
+ {
2079
+ type: "button",
2080
+ className: twMerge9(
2081
+ "pointer-events-auto group w-24 p-1 -translate-y-2 transition",
2082
+ "bg-blue-600 hover:bg-blue-500 aria-busy:bg-blue-500",
2083
+ "text-white text-sm font-medium",
2084
+ "aria-busy:pointer-events-none"
2085
+ ),
2086
+ onClick: dismiss,
2087
+ children: "Dismiss"
2088
+ }
2089
+ ) }) : null
2090
+ ] })
2091
+ ] }) }) : null
2092
+ }
2093
+ )
2094
+ ] });
2095
+ }
2096
+
2097
+ // src/errors/ErrorFallback.tsx
2098
+ import { jsx as jsx22 } from "react/jsx-runtime";
2099
+ function ErrorFallback({ error: error2, resetErrorBoundary }) {
2100
+ return /* @__PURE__ */ jsx22("div", { className: "h-64", children: /* @__PURE__ */ jsx22(ErrorOverlay, { error: error2, retry: resetErrorBoundary }) });
2101
+ }
2102
+
2103
+ // src/errors/ErrorsOverlay.tsx
2104
+ import { useStore as useStore2 } from "zustand";
2105
+ import { jsx as jsx23 } from "react/jsx-runtime";
2106
+ function ErrorsOverlay() {
2107
+ const error2 = useStore2(store3, (state) => state.errors.at(0));
2108
+ return /* @__PURE__ */ jsx23(ErrorOverlay, { error: error2?.error, retry: error2?.retry, dismiss: error2?.dismiss });
2109
+ }
2110
+
2111
+ // src/AccountModal.tsx
2112
+ import { jsx as jsx24, jsxs as jsxs16 } from "react/jsx-runtime";
2113
+ function AccountModal() {
2114
+ const { accountModalOpen, toggleAccountModal } = useAccountModal();
2115
+ return /* @__PURE__ */ jsxs16(Modal, { open: accountModalOpen, onOpenChange: toggleAccountModal, children: [
2116
+ /* @__PURE__ */ jsx24(DialogTitle, { className: "sr-only", children: "Connect with EntryKit" }),
2117
+ accountModalOpen ? /* @__PURE__ */ jsxs16(
2118
+ "div",
2119
+ {
2120
+ className: twMerge10(
2121
+ "relative py-2 ring-1",
2122
+ "bg-neutral-900 text-neutral-400 ring-neutral-700/50",
2123
+ "links:font-medium links:underline links:underline-offset-4",
2124
+ "links:text-white",
2125
+ "links:decoration-neutral-500 hover:links:decoration-orange-500"
2126
+ ),
2127
+ children: [
2128
+ /* @__PURE__ */ jsx24("div", { className: "absolute top-0 right-0", children: /* @__PURE__ */ jsx24(
2129
+ DialogClose,
2130
+ {
2131
+ className: twMerge10(
2132
+ "pointer-events-auto leading-none p-2 transition",
2133
+ "text-white/20 hover:text-white/40"
2134
+ ),
2135
+ title: "Close",
2136
+ children: /* @__PURE__ */ jsx24(CloseIcon, { className: "m-0" })
2137
+ }
2138
+ ) }),
2139
+ /* @__PURE__ */ jsxs16(ErrorBoundary, { FallbackComponent: ErrorFallback, children: [
2140
+ /* @__PURE__ */ jsx24(AccountModalContent, {}),
2141
+ /* @__PURE__ */ jsx24(ErrorsOverlay, {})
2142
+ ] }),
2143
+ /* @__PURE__ */ jsxs16(
2144
+ "a",
2145
+ {
2146
+ href: "https://mud.dev",
2147
+ target: "_blank",
2148
+ rel: "noreferrer noopener",
2149
+ className: "group self-center p-3 flex items-center justify-center gap-2 links-unset text-sm font-mono transition text-neutral-400 hover:text-white",
2150
+ children: [
2151
+ /* @__PURE__ */ jsx24("span", { className: "block w-4 h-4", children: /* @__PURE__ */ jsx24(Logo, { className: "w-full h-full text-orange-500 group-hover:rotate-90 transition duration-300" }) }),
2152
+ /* @__PURE__ */ jsx24("span", { children: "Powered by MUD" })
2153
+ ]
2154
+ }
2155
+ )
2156
+ ]
2157
+ }
2158
+ ) : null
2159
+ ] });
2160
+ }
2161
+
2162
+ // src/EntryKitProvider.tsx
2163
+ import { jsx as jsx25, jsxs as jsxs17 } from "react/jsx-runtime";
2164
+ function EntryKitProvider({ config, children }) {
2165
+ return /* @__PURE__ */ jsxs17(EntryKitConfigProvider, { config, children: [
2166
+ children,
2167
+ /* @__PURE__ */ jsx25(AccountModal, {})
2168
+ ] });
2169
+ }
2170
+
2171
+ // src/AccountButton.tsx
2172
+ import { useAccount as useAccount3 } from "wagmi";
2173
+ import { twMerge as twMerge12 } from "tailwind-merge";
2174
+
2175
+ // src/AccountName.tsx
2176
+ import { twMerge as twMerge11 } from "tailwind-merge";
2177
+ import { Fragment as Fragment3, jsx as jsx26, jsxs as jsxs18 } from "react/jsx-runtime";
2178
+ function AccountName({ address }) {
2179
+ const { data: ens } = useENS(address);
2180
+ const avatar = usePreloadImage(ens?.avatar);
2181
+ return /* @__PURE__ */ jsxs18(Fragment3, { children: [
2182
+ /* @__PURE__ */ jsxs18("span", { className: "flex-shrink-0 w-6 h-6 -my-1 -mx-0.5 grid place-items-center", children: [
2183
+ /* @__PURE__ */ jsx26(
2184
+ "img",
2185
+ {
2186
+ src: ens?.avatar && avatar.isSuccess ? ens.avatar : void 0,
2187
+ className: twMerge11(
2188
+ "col-start-1 row-start-1",
2189
+ "inline-flex w-full h-full rounded-full bg-black/10 dark:bg-white/10 bg-cover bg-no-repeat bg-center",
2190
+ "transtion duration-300",
2191
+ avatar.isSuccess ? "opacity-100" : "opacity-0"
2192
+ )
2193
+ }
2194
+ ),
2195
+ /* @__PURE__ */ jsx26(
2196
+ Logo,
2197
+ {
2198
+ className: twMerge11(
2199
+ "col-start-1 row-start-1 text-orange-500",
2200
+ "transition duration-300",
2201
+ ens && (!ens.avatar || avatar.isError) ? "opacity-100" : "opacity-0"
2202
+ )
2203
+ }
2204
+ )
2205
+ ] }),
2206
+ /* @__PURE__ */ jsx26("span", { className: "flex-grow", children: ens?.name ?? /* @__PURE__ */ jsx26(TruncatedHex, { hex: address }) })
2207
+ ] });
2208
+ }
2209
+
2210
+ // src/AccountButton.tsx
2211
+ import { useRef as useRef4 } from "react";
2212
+ import { jsx as jsx27, jsxs as jsxs19 } from "react/jsx-runtime";
2213
+ var containerClassNames = twMerge12(
2214
+ "w-48 p-3 inline-flex outline-none transition",
2215
+ "border border-transparent",
2216
+ "text-base leading-none"
2217
+ );
2218
+ var secondaryClassNames = twMerge12(
2219
+ "bg-neutral-100 border-neutral-300 text-black",
2220
+ "dark:bg-neutral-800 dark:border-neutral-700 dark:text-white"
2221
+ );
2222
+ var secondaryInteractiveClassNames = twMerge12(
2223
+ "cursor-pointer outline-none hover:bg-neutral-200 data-[highlighted]:bg-neutral-200 dark:hover:bg-neutral-700"
2224
+ );
2225
+ function AccountButton() {
2226
+ const { openAccountModal, accountModalOpen } = useAccountModal();
2227
+ const { status, address: userAddress } = useAccount3();
2228
+ const initialUserAddress = useRef4(userAddress);
2229
+ const prereqs = usePrerequisites(userAddress);
2230
+ const isConnected = status === "connected" || status === "reconnecting" && userAddress;
2231
+ const isNewConnection = userAddress !== initialUserAddress.current;
2232
+ const isSignedIn = prereqs.isSuccess ? prereqs.data.complete : isNewConnection ? false : isConnected;
2233
+ const buttonLabel = (() => {
2234
+ if (prereqs.isSuccess) {
2235
+ if (!prereqs.data.hasAllowance) return "Top up";
2236
+ if (!prereqs.data.hasDelegation || !prereqs.data.isSpender) return "Set up";
2237
+ }
2238
+ return "Sign in";
2239
+ })();
2240
+ return /* @__PURE__ */ jsx27(Shadow, { mode: "child", children: isSignedIn ? /* @__PURE__ */ jsx27(
2241
+ "button",
2242
+ {
2243
+ type: "button",
2244
+ className: twMerge12(containerClassNames, secondaryClassNames, secondaryInteractiveClassNames),
2245
+ onClick: openAccountModal,
2246
+ children: /* @__PURE__ */ jsx27("span", { className: "flex-grow inline-flex gap-2.5 items-center text-left font-medium", children: userAddress ? /* @__PURE__ */ jsx27(AccountName, { address: userAddress }) : null })
2247
+ },
2248
+ "connected"
2249
+ ) : /* @__PURE__ */ jsxs19(
2250
+ "button",
2251
+ {
2252
+ type: "button",
2253
+ className: twMerge12(
2254
+ containerClassNames,
2255
+ "group",
2256
+ "items-center justify-center gap-2.5",
2257
+ "bg-orange-500 text-white font-medium",
2258
+ "hover:bg-orange-400",
2259
+ "active:bg-orange-600"
2260
+ ),
2261
+ "aria-busy": accountModalOpen,
2262
+ onClick: openAccountModal,
2263
+ children: [
2264
+ /* @__PURE__ */ jsxs19("span", { className: "pointer-events-none inline-grid place-items-center -ml-3", children: [
2265
+ /* @__PURE__ */ jsx27(
2266
+ "span",
2267
+ {
2268
+ className: twMerge12(
2269
+ "col-start-1 row-start-1 leading-none",
2270
+ "scale-100 opacity-100 transition duration-300",
2271
+ "group-aria-busy:scale-125 group-aria-busy:opacity-0"
2272
+ ),
2273
+ children: /* @__PURE__ */ jsx27(Logo, {})
2274
+ }
2275
+ ),
2276
+ /* @__PURE__ */ jsx27(
2277
+ "span",
2278
+ {
2279
+ "aria-hidden": true,
2280
+ className: twMerge12(
2281
+ "col-start-1 row-start-1",
2282
+ "scale-50 opacity-0 transition duration-300 delay-50",
2283
+ "group-aria-busy:scale-100 group-aria-busy:opacity-100"
2284
+ ),
2285
+ children: /* @__PURE__ */ jsx27(PendingIcon, {})
2286
+ }
2287
+ )
2288
+ ] }),
2289
+ /* @__PURE__ */ jsx27("span", { className: "font-medium", children: buttonLabel })
2290
+ ]
2291
+ },
2292
+ "sign in"
2293
+ ) });
2294
+ }
2295
+
2296
+ // src/useSessionClientReady.ts
2297
+ import { useConnectorClient as useConnectorClient2 } from "wagmi";
2298
+ function useSessionClientReady() {
2299
+ const { chainId } = useEntryKitConfig();
2300
+ const userClient = useConnectorClient2({ chainId });
2301
+ if (userClient.error) console.error("Error retrieving user client", userClient.error);
2302
+ const userAddress = userClient.data?.account.address;
2303
+ const prerequisites = usePrerequisites(userAddress);
2304
+ const sessionClient = useSessionClient(userAddress);
2305
+ if (!userClient.isSuccess) return { ...userClient, data: void 0 };
2306
+ if (!prerequisites.isSuccess || !prerequisites.data.complete) return { ...prerequisites, data: void 0 };
2307
+ return sessionClient;
2308
+ }
2309
+
2310
+ // src/createWagmiConfig.ts
2311
+ import { connectorsForWallets } from "@rainbow-me/rainbowkit";
2312
+ import { createConfig } from "wagmi";
2313
+
2314
+ // src/getWallets.ts
2315
+ import { getDefaultWallets } from "@rainbow-me/rainbowkit";
2316
+ function getWallets(_config) {
2317
+ const { wallets: defaultWallets } = getDefaultWallets();
2318
+ return [
2319
+ // TODO: passkey wallet
2320
+ ...defaultWallets
2321
+ ];
2322
+ }
2323
+
2324
+ // src/createWagmiConfig.ts
2325
+ function createWagmiConfig(config) {
2326
+ const wallets = getWallets(config);
2327
+ const connectors = connectorsForWallets(wallets, {
2328
+ appName: config.appName,
2329
+ projectId: config.walletConnectProjectId
2330
+ });
2331
+ return createConfig({
2332
+ connectors,
2333
+ chains: config.chains,
2334
+ transports: config.transports,
2335
+ pollingInterval: config.pollingInterval
2336
+ });
2337
+ }
2338
+
2339
+ // src/getConnectors.ts
2340
+ import { connectorsForWallets as connectorsForWallets2 } from "@rainbow-me/rainbowkit";
2341
+ function getConnectors({
2342
+ wallets,
2343
+ ...config
2344
+ }) {
2345
+ return connectorsForWallets2(wallets ?? getWallets(config), {
2346
+ appName: config.appName,
2347
+ projectId: config.walletConnectProjectId
2348
+ });
2349
+ }
2350
+ export {
2351
+ AccountButton,
2352
+ EntryKitProvider,
2353
+ createWagmiConfig,
2354
+ defineConfig,
2355
+ getConnectors,
2356
+ getWallets,
2357
+ useAccountModal,
2358
+ useEntryKitConfig,
2359
+ useSessionClientReady as useSessionClient
2360
+ };
1398
2361
  //# sourceMappingURL=internal.js.map