@latticexyz/entrykit 2.2.23-122945eb02d5d8b6475aec2e88f72340ea81f2d6 → 2.2.23-5ebd3d31b6ab3fbbfa8994fefcbf46d4e44c6ec2
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.
|
@@ -22,7 +22,7 @@ import { forwardRef, useEffect, useRef, useState } from "react";
|
|
|
22
22
|
import ReactDOM from "react-dom";
|
|
23
23
|
|
|
24
24
|
// ../../node_modules/.pnpm/tailwindcss@3.4.13/node_modules/tailwindcss/tailwind.css?inline
|
|
25
|
-
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.-mr-1 {\n margin-right: -0.25rem;\n}\n\n.-mt-2 {\n margin-top: -0.5rem;\n}\n\n.mt-1 {\n margin-top: 0.25rem;\n}\n\n.mt-4 {\n margin-top: 1rem;\n}\n\n.block {\n display: block;\n}\n\n.inline-block {\n display: inline-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.aspect-square {\n aspect-ratio: 1 / 1;\n}\n\n.h-10 {\n height: 2.5rem;\n}\n\n.h-12 {\n height: 3rem;\n}\n\n.h-16 {\n height: 4rem;\n}\n\n.h-3 {\n height: 0.75rem;\n}\n\n.h-3\\.5 {\n height: 0.875rem;\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-\\[2px\\] {\n height: 2px;\n}\n\n.h-full {\n height: 100%;\n}\n\n.max-h-\\[230px\\] {\n max-height: 230px;\n}\n\n.max-h-full {\n max-height: 100%;\n}\n\n.w-10 {\n width: 2.5rem;\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-3 {\n width: 0.75rem;\n}\n\n.w-3\\.5 {\n width: 0.875rem;\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-8 {\n width: 2rem;\n}\n\n.w-\\[0\\.6em\\] {\n width: 0.6em;\n}\n\n.w-\\[1\\.25em\\] {\n width: 1.25em;\n}\n\n.w-\\[352px\\] {\n width: 352px;\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.transform {\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.cursor-text {\n cursor: text;\n}\n\n.grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\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-5 {\n gap: 1.25rem;\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-700 > :not([hidden]) ~ :not([hidden]) {\n --tw-divide-opacity: 1;\n border-color: rgb(64 64 64 / var(--tw-divide-opacity));\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.overflow-y-auto {\n overflow-y: auto;\n}\n\n.whitespace-nowrap {\n white-space: nowrap;\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-2 {\n border-width: 2px;\n}\n\n.border-4 {\n border-width: 4px;\n}\n\n.border-dashed {\n border-style: dashed;\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-neutral-700 {\n --tw-border-opacity: 1;\n border-color: rgb(64 64 64 / var(--tw-border-opacity));\n}\n\n.border-transparent {\n border-color: transparent;\n}\n\n.border-white\\/50 {\n border-color: rgb(255 255 255 / 0.5);\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-green-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(22 163 74 / var(--tw-bg-opacity));\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-red-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(220 38 38 / var(--tw-bg-opacity));\n}\n\n.bg-transparent {\n background-color: transparent;\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-2\\.5 {\n padding: 0.625rem;\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-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\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-2 {\n padding-bottom: 0.5rem;\n}\n\n.pb-8 {\n padding-bottom: 2rem;\n}\n\n.pt-10 {\n padding-top: 2.5rem;\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-loose {\n line-height: 2;\n}\n\n.leading-none {\n line-height: 1;\n}\n\n.tracking-\\[-1ch\\] {\n letter-spacing: -1ch;\n}\n\n.text-amber-500 {\n --tw-text-opacity: 1;\n color: rgb(245 158 11 / var(--tw-text-opacity));\n}\n\n.text-black {\n --tw-text-opacity: 1;\n color: rgb(0 0 0 / var(--tw-text-opacity));\n}\n\n.text-gray-400 {\n --tw-text-opacity: 1;\n color: rgb(156 163 175 / var(--tw-text-opacity));\n}\n\n.text-green-600 {\n --tw-text-opacity: 1;\n color: rgb(22 163 74 / var(--tw-text-opacity));\n}\n\n.text-neutral-300 {\n --tw-text-opacity: 1;\n color: rgb(212 212 212 / 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-neutral-500 {\n --tw-text-opacity: 1;\n color: rgb(115 115 115 / 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\\/50 {\n color: rgb(255 255 255 / 0.5);\n}\n\n.text-white\\/80 {\n color: rgb(255 255 255 / 0.8);\n}\n\n.underline {\n text-decoration-line: underline;\n}\n\n.decoration-neutral-500 {\n text-decoration-color: #737373;\n}\n\n.underline-offset-4 {\n text-underline-offset: 4px;\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-50 {\n opacity: 0.5;\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-2 {\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(2px + 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.ring-transparent {\n --tw-ring-color: transparent;\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.transition-colors {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\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.ease-linear {\n transition-timing-function: linear;\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.animate-out {\n animation-name: exit;\n animation-duration: 150ms;\n --tw-exit-opacity: initial;\n --tw-exit-scale: initial;\n --tw-exit-rotate: initial;\n --tw-exit-translate-x: initial;\n --tw-exit-translate-y: initial;\n}\n\n.fade-in {\n --tw-enter-opacity: 0;\n}\n\n.fade-out {\n --tw-exit-opacity: 0;\n}\n\n.slide-in-from-bottom-16 {\n --tw-enter-translate-y: 4rem;\n}\n\n.slide-in-from-bottom-2 {\n --tw-enter-translate-y: 0.5rem;\n}\n\n.slide-in-from-bottom-8 {\n --tw-enter-translate-y: 2rem;\n}\n\n.slide-in-from-top-2 {\n --tw-enter-translate-y: -0.5rem;\n}\n\n.animate-duration-300 {\n animation-duration: 300ms;\n}\n\n.ease-linear {\n animation-timing-function: linear;\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.placeholder\\:text-neutral-500::placeholder {\n --tw-text-opacity: 1;\n color: rgb(115 115 115 / var(--tw-text-opacity));\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.focus-within\\:border-transparent:focus-within {\n border-color: transparent;\n}\n\n.focus-within\\:ring-orange-500:focus-within {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(249 115 22 / var(--tw-ring-opacity));\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\\:text-white\\/80:hover {\n color: rgb(255 255 255 / 0.8);\n}\n\n.hover\\:decoration-orange-500:hover {\n text-decoration-color: #f97316;\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.focus\\:bg-neutral-700:focus {\n --tw-bg-opacity: 1;\n background-color: rgb(64 64 64 / var(--tw-bg-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\\:pointer-events-none {\n pointer-events: none;\n}\n\n.group:hover .group-hover\\:pointer-events-auto {\n pointer-events: auto;\n}\n\n.group:hover .group-hover\\:inline-block {\n display: inline-block;\n}\n\n.group:hover .group-hover\\:hidden {\n display: none;\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.group:hover .group-hover\\:opacity-0 {\n opacity: 0;\n}\n\n.group:hover .group-hover\\:opacity-100 {\n opacity: 1;\n}\n\n.peer:placeholder-shown ~ .peer-placeholder-shown\\:text-neutral-500 {\n --tw-text-opacity: 1;\n color: rgb(115 115 115 / var(--tw-text-opacity));\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.group[aria-expanded="true"] .group-aria-expanded\\:inline {\n display: inline;\n}\n\n.group[aria-expanded="true"] .group-aria-expanded\\:hidden {\n display: none;\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.data-\\[state\\=checked\\]\\:bg-neutral-900[data-state="checked"] {\n --tw-bg-opacity: 1;\n background-color: rgb(23 23 23 / 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\n.\\[\\&_\\>_\\:is\\(dt\\2c dd\\)\\]\\:px-1 > :is(dt,dd) {\n padding-left: 0.25rem;\n padding-right: 0.25rem;\n}\n\n.\\[\\&_\\>_dd\\]\\:text-right > dd {\n text-align: right;\n}\n';
|
|
25
|
+
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.-mr-1 {\n margin-right: -0.25rem;\n}\n\n.-mt-2 {\n margin-top: -0.5rem;\n}\n\n.mt-1 {\n margin-top: 0.25rem;\n}\n\n.mt-4 {\n margin-top: 1rem;\n}\n\n.block {\n display: block;\n}\n\n.inline-block {\n display: inline-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.aspect-square {\n aspect-ratio: 1 / 1;\n}\n\n.h-10 {\n height: 2.5rem;\n}\n\n.h-12 {\n height: 3rem;\n}\n\n.h-16 {\n height: 4rem;\n}\n\n.h-3 {\n height: 0.75rem;\n}\n\n.h-3\\.5 {\n height: 0.875rem;\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-\\[2px\\] {\n height: 2px;\n}\n\n.h-full {\n height: 100%;\n}\n\n.max-h-\\[230px\\] {\n max-height: 230px;\n}\n\n.max-h-full {\n max-height: 100%;\n}\n\n.w-10 {\n width: 2.5rem;\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-3 {\n width: 0.75rem;\n}\n\n.w-3\\.5 {\n width: 0.875rem;\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-8 {\n width: 2rem;\n}\n\n.w-\\[0\\.6em\\] {\n width: 0.6em;\n}\n\n.w-\\[1\\.25em\\] {\n width: 1.25em;\n}\n\n.w-\\[352px\\] {\n width: 352px;\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.transform {\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.cursor-text {\n cursor: text;\n}\n\n.grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\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-5 {\n gap: 1.25rem;\n}\n\n.gap-6 {\n gap: 1.5rem;\n}\n\n.space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\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-700 > :not([hidden]) ~ :not([hidden]) {\n --tw-divide-opacity: 1;\n border-color: rgb(64 64 64 / var(--tw-divide-opacity));\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.overflow-y-auto {\n overflow-y: auto;\n}\n\n.whitespace-nowrap {\n white-space: nowrap;\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-2 {\n border-width: 2px;\n}\n\n.border-4 {\n border-width: 4px;\n}\n\n.border-dashed {\n border-style: dashed;\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-neutral-700 {\n --tw-border-opacity: 1;\n border-color: rgb(64 64 64 / var(--tw-border-opacity));\n}\n\n.border-transparent {\n border-color: transparent;\n}\n\n.border-white\\/50 {\n border-color: rgb(255 255 255 / 0.5);\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-green-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(22 163 74 / var(--tw-bg-opacity));\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-red-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(220 38 38 / var(--tw-bg-opacity));\n}\n\n.bg-transparent {\n background-color: transparent;\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-2\\.5 {\n padding: 0.625rem;\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-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\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-2 {\n padding-bottom: 0.5rem;\n}\n\n.pb-8 {\n padding-bottom: 2rem;\n}\n\n.pt-10 {\n padding-top: 2.5rem;\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-loose {\n line-height: 2;\n}\n\n.leading-none {\n line-height: 1;\n}\n\n.tracking-\\[-1ch\\] {\n letter-spacing: -1ch;\n}\n\n.text-amber-500 {\n --tw-text-opacity: 1;\n color: rgb(245 158 11 / var(--tw-text-opacity));\n}\n\n.text-black {\n --tw-text-opacity: 1;\n color: rgb(0 0 0 / var(--tw-text-opacity));\n}\n\n.text-gray-400 {\n --tw-text-opacity: 1;\n color: rgb(156 163 175 / var(--tw-text-opacity));\n}\n\n.text-green-600 {\n --tw-text-opacity: 1;\n color: rgb(22 163 74 / var(--tw-text-opacity));\n}\n\n.text-neutral-300 {\n --tw-text-opacity: 1;\n color: rgb(212 212 212 / 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-neutral-500 {\n --tw-text-opacity: 1;\n color: rgb(115 115 115 / 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\\/50 {\n color: rgb(255 255 255 / 0.5);\n}\n\n.text-white\\/80 {\n color: rgb(255 255 255 / 0.8);\n}\n\n.underline {\n text-decoration-line: underline;\n}\n\n.decoration-neutral-500 {\n text-decoration-color: #737373;\n}\n\n.underline-offset-4 {\n text-underline-offset: 4px;\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-50 {\n opacity: 0.5;\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-2 {\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(2px + 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.ring-transparent {\n --tw-ring-color: transparent;\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.transition-colors {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\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.ease-linear {\n transition-timing-function: linear;\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.animate-out {\n animation-name: exit;\n animation-duration: 150ms;\n --tw-exit-opacity: initial;\n --tw-exit-scale: initial;\n --tw-exit-rotate: initial;\n --tw-exit-translate-x: initial;\n --tw-exit-translate-y: initial;\n}\n\n.fade-in {\n --tw-enter-opacity: 0;\n}\n\n.fade-out {\n --tw-exit-opacity: 0;\n}\n\n.slide-in-from-bottom-16 {\n --tw-enter-translate-y: 4rem;\n}\n\n.slide-in-from-bottom-2 {\n --tw-enter-translate-y: 0.5rem;\n}\n\n.slide-in-from-bottom-8 {\n --tw-enter-translate-y: 2rem;\n}\n\n.slide-in-from-top-2 {\n --tw-enter-translate-y: -0.5rem;\n}\n\n.animate-duration-300 {\n animation-duration: 300ms;\n}\n\n.ease-linear {\n animation-timing-function: linear;\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.placeholder\\:text-neutral-500::placeholder {\n --tw-text-opacity: 1;\n color: rgb(115 115 115 / var(--tw-text-opacity));\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.focus-within\\:border-transparent:focus-within {\n border-color: transparent;\n}\n\n.focus-within\\:ring-orange-500:focus-within {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(249 115 22 / var(--tw-ring-opacity));\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\\:text-white\\/80:hover {\n color: rgb(255 255 255 / 0.8);\n}\n\n.hover\\:decoration-orange-500:hover {\n text-decoration-color: #f97316;\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.focus\\:bg-neutral-700:focus {\n --tw-bg-opacity: 1;\n background-color: rgb(64 64 64 / var(--tw-bg-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\\:pointer-events-none {\n pointer-events: none;\n}\n\n.group:hover .group-hover\\:pointer-events-auto {\n pointer-events: auto;\n}\n\n.group:hover .group-hover\\:inline-block {\n display: inline-block;\n}\n\n.group:hover .group-hover\\:hidden {\n display: none;\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.group:hover .group-hover\\:opacity-0 {\n opacity: 0;\n}\n\n.group:hover .group-hover\\:opacity-100 {\n opacity: 1;\n}\n\n.peer:placeholder-shown ~ .peer-placeholder-shown\\:text-neutral-500 {\n --tw-text-opacity: 1;\n color: rgb(115 115 115 / var(--tw-text-opacity));\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.group[aria-expanded="true"] .group-aria-expanded\\:inline {\n display: inline;\n}\n\n.group[aria-expanded="true"] .group-aria-expanded\\:hidden {\n display: none;\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.data-\\[state\\=checked\\]\\:bg-neutral-900[data-state="checked"] {\n --tw-bg-opacity: 1;\n background-color: rgb(23 23 23 / 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\n.\\[\\&_\\>_\\:is\\(dt\\2c dd\\)\\]\\:px-1 > :is(dt,dd) {\n padding-left: 0.25rem;\n padding-right: 0.25rem;\n}\n\n.\\[\\&_\\>_dd\\]\\:text-right > dd {\n text-align: right;\n}\n';
|
|
26
26
|
|
|
27
27
|
// src/ui/Shadow.tsx
|
|
28
28
|
import { useResizeObserver } from "usehooks-ts";
|
|
@@ -58,10 +58,16 @@ import { privateKeyToAccount } from "viem/accounts";
|
|
|
58
58
|
// src/quarry/transports/userOpExecutor.ts
|
|
59
59
|
import {
|
|
60
60
|
createTransport,
|
|
61
|
+
getAbiItem,
|
|
61
62
|
numberToHex,
|
|
62
63
|
parseEther
|
|
63
64
|
} from "viem";
|
|
64
|
-
import {
|
|
65
|
+
import {
|
|
66
|
+
entryPoint06Abi,
|
|
67
|
+
entryPoint06Address,
|
|
68
|
+
entryPoint07Address as entryPoint07Address2,
|
|
69
|
+
entryPoint08Address
|
|
70
|
+
} from "viem/account-abstraction";
|
|
65
71
|
|
|
66
72
|
// src/quarry/transports/methods/estimateUserOperationGas.ts
|
|
67
73
|
import { formatUserOperationRequest } from "viem/account-abstraction";
|
|
@@ -138,7 +144,8 @@ error.log = console.error.bind(console);
|
|
|
138
144
|
var debug2 = debug.extend("quarry");
|
|
139
145
|
|
|
140
146
|
// src/quarry/transports/userOpExecutor.ts
|
|
141
|
-
import { setBalance } from "viem/actions";
|
|
147
|
+
import { getLogs, getTransactionReceipt, setBalance } from "viem/actions";
|
|
148
|
+
import { getUserOperationReceipt } from "@latticexyz/common/internal";
|
|
142
149
|
function userOpExecutor({
|
|
143
150
|
executor,
|
|
144
151
|
fallbackDefaultTransport
|
|
@@ -172,8 +179,38 @@ function userOpExecutor({
|
|
|
172
179
|
}
|
|
173
180
|
}
|
|
174
181
|
if (method === "eth_getUserOperationReceipt") {
|
|
175
|
-
const [
|
|
176
|
-
return receipts.get(
|
|
182
|
+
const [userOpHash] = params;
|
|
183
|
+
if (receipts.has(userOpHash)) return receipts.get(userOpHash);
|
|
184
|
+
const event = getAbiItem({
|
|
185
|
+
abi: entryPoint06Abi,
|
|
186
|
+
name: "UserOperationEvent"
|
|
187
|
+
});
|
|
188
|
+
const log = (await getLogs(executor, {
|
|
189
|
+
address: [entryPoint06Address, entryPoint07Address2, entryPoint08Address],
|
|
190
|
+
event,
|
|
191
|
+
args: { userOpHash }
|
|
192
|
+
})).at(0);
|
|
193
|
+
if (!log) return null;
|
|
194
|
+
const hash = log.transactionHash;
|
|
195
|
+
const receipt = await getTransactionReceipt(executor, { hash });
|
|
196
|
+
const userOpReceipt = getUserOperationReceipt(userOpHash, {
|
|
197
|
+
...receipt,
|
|
198
|
+
blobGasPrice: receipt.blobGasPrice ? numberToHex(receipt.blobGasPrice) : void 0,
|
|
199
|
+
blobGasUsed: receipt.blobGasUsed ? numberToHex(receipt.blobGasUsed) : void 0,
|
|
200
|
+
blockNumber: numberToHex(receipt.blockNumber),
|
|
201
|
+
cumulativeGasUsed: numberToHex(receipt.cumulativeGasUsed),
|
|
202
|
+
effectiveGasPrice: numberToHex(receipt.effectiveGasPrice),
|
|
203
|
+
gasUsed: numberToHex(receipt.gasUsed),
|
|
204
|
+
logs: receipt.logs.map((log2) => ({
|
|
205
|
+
...log2,
|
|
206
|
+
blockNumber: numberToHex(log2.blockNumber),
|
|
207
|
+
logIndex: numberToHex(log2.logIndex),
|
|
208
|
+
transactionIndex: numberToHex(log2.transactionIndex)
|
|
209
|
+
})),
|
|
210
|
+
status: receipt.status,
|
|
211
|
+
transactionIndex: numberToHex(receipt.transactionIndex)
|
|
212
|
+
});
|
|
213
|
+
return userOpReceipt;
|
|
177
214
|
}
|
|
178
215
|
if (method === "eth_estimateUserOperationGas") {
|
|
179
216
|
return await estimateUserOperationGas(params);
|
|
@@ -525,40 +562,76 @@ function AppInfo() {
|
|
|
525
562
|
// src/ConnectWallet.tsx
|
|
526
563
|
import { twMerge as twMerge5 } from "tailwind-merge";
|
|
527
564
|
import { useEffect as useEffect3, useRef as useRef2 } from "react";
|
|
528
|
-
import {
|
|
565
|
+
import { useConnect, useConnectors } from "wagmi";
|
|
566
|
+
import { isIdPlaceConnector } from "@latticexyz/id.place/internal";
|
|
567
|
+
import { Fragment, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
529
568
|
function ConnectWallet() {
|
|
530
|
-
const
|
|
531
|
-
const
|
|
532
|
-
useEffect3(() => {
|
|
533
|
-
if (!open && !hasAutoOpenedRef.current) {
|
|
534
|
-
setOpen(true);
|
|
535
|
-
hasAutoOpenedRef.current = true;
|
|
536
|
-
}
|
|
537
|
-
}, [open, setOpen]);
|
|
569
|
+
const connectors = useConnectors();
|
|
570
|
+
const porto = connectors.find(isIdPlaceConnector);
|
|
538
571
|
return /* @__PURE__ */ jsxs7(
|
|
539
572
|
"div",
|
|
540
573
|
{
|
|
541
574
|
className: twMerge5("flex flex-col gap-6 p-6", "animate-in animate-duration-300 fade-in slide-in-from-bottom-8"),
|
|
542
575
|
children: [
|
|
543
576
|
/* @__PURE__ */ jsx9("div", { className: "p-4", children: /* @__PURE__ */ jsx9(AppInfo, {}) }),
|
|
544
|
-
/* @__PURE__ */ jsx9("div", { className: "self-center flex flex-col gap-2 w-60", children: /* @__PURE__ */ jsx9(
|
|
545
|
-
Button,
|
|
546
|
-
{
|
|
547
|
-
variant: "secondary",
|
|
548
|
-
className: "self-auto flex justify-center",
|
|
549
|
-
onClick: () => setOpen(true),
|
|
550
|
-
autoFocus: true,
|
|
551
|
-
children: "Connect wallet"
|
|
552
|
-
},
|
|
553
|
-
"create"
|
|
554
|
-
) })
|
|
577
|
+
/* @__PURE__ */ jsx9("div", { className: "self-center flex flex-col gap-2 w-60", children: porto ? /* @__PURE__ */ jsx9(AccountButton, { connector: porto }) : /* @__PURE__ */ jsx9(WalletButton, {}) })
|
|
555
578
|
]
|
|
556
579
|
}
|
|
557
580
|
);
|
|
558
581
|
}
|
|
582
|
+
function AccountButton({ connector }) {
|
|
583
|
+
const { setOpen } = useModal();
|
|
584
|
+
const { connect, isPending, error: error2 } = useConnect();
|
|
585
|
+
if (error2) {
|
|
586
|
+
console.error("connect error", error2);
|
|
587
|
+
}
|
|
588
|
+
return /* @__PURE__ */ jsxs7(Fragment, { children: [
|
|
589
|
+
/* @__PURE__ */ jsx9(
|
|
590
|
+
Button,
|
|
591
|
+
{
|
|
592
|
+
variant: "secondary",
|
|
593
|
+
className: "self-auto flex justify-center",
|
|
594
|
+
pending: isPending,
|
|
595
|
+
onClick: () => connect({ connector }),
|
|
596
|
+
autoFocus: true,
|
|
597
|
+
children: "Sign in"
|
|
598
|
+
},
|
|
599
|
+
"signin"
|
|
600
|
+
),
|
|
601
|
+
/* @__PURE__ */ jsx9(
|
|
602
|
+
"button",
|
|
603
|
+
{
|
|
604
|
+
className: "text-sm self-center transition text-neutral-500 hover:text-white p-2",
|
|
605
|
+
onClick: () => setOpen(true),
|
|
606
|
+
children: "Already have a wallet?"
|
|
607
|
+
}
|
|
608
|
+
)
|
|
609
|
+
] });
|
|
610
|
+
}
|
|
611
|
+
function WalletButton() {
|
|
612
|
+
const { open, setOpen } = useModal();
|
|
613
|
+
const hasAutoOpenedRef = useRef2(false);
|
|
614
|
+
useEffect3(() => {
|
|
615
|
+
if (!open && !hasAutoOpenedRef.current) {
|
|
616
|
+
setOpen(true);
|
|
617
|
+
hasAutoOpenedRef.current = true;
|
|
618
|
+
}
|
|
619
|
+
}, [open, setOpen]);
|
|
620
|
+
return /* @__PURE__ */ jsx9(Fragment, { children: /* @__PURE__ */ jsx9(
|
|
621
|
+
Button,
|
|
622
|
+
{
|
|
623
|
+
variant: "secondary",
|
|
624
|
+
className: "self-auto flex justify-center",
|
|
625
|
+
onClick: () => setOpen(true),
|
|
626
|
+
autoFocus: true,
|
|
627
|
+
children: "Connect wallet"
|
|
628
|
+
},
|
|
629
|
+
"create"
|
|
630
|
+
) });
|
|
631
|
+
}
|
|
559
632
|
|
|
560
633
|
// src/onboarding/ConnectedSteps.tsx
|
|
561
|
-
import { useEffect as
|
|
634
|
+
import { useEffect as useEffect14, useMemo as useMemo4, useRef as useRef5, useState as useState5 } from "react";
|
|
562
635
|
import { twMerge as twMerge18 } from "tailwind-merge";
|
|
563
636
|
|
|
564
637
|
// src/onboarding/usePrerequisites.ts
|
|
@@ -573,26 +646,35 @@ import { queryOptions, skipToken, useQuery as useQuery2 } from "@tanstack/react-
|
|
|
573
646
|
import { defineStore } from "@latticexyz/store";
|
|
574
647
|
import { parseAbi } from "viem";
|
|
575
648
|
var paymasterAbi = parseAbi([
|
|
649
|
+
// AllowanceSystem
|
|
650
|
+
"error AllowanceSystem_InsufficientAllowance(uint256 allowance, uint256 required)",
|
|
651
|
+
"error AllowanceSystem_NotAuthorized(address caller, address sponsor, address user)",
|
|
652
|
+
"error AllowanceSystem_NotFound(address user, address sponsor)",
|
|
653
|
+
"function removeAllowance(address user, address sponsor)",
|
|
654
|
+
"function getAllowance(address user) view returns (uint256)",
|
|
655
|
+
// GrantSystem
|
|
656
|
+
"error GrantSystem_AllowanceBelowMinimum(uint256 allowance, uint256 min)",
|
|
657
|
+
"error GrantSystem_AllowancesLimitReached(uint256 length, uint256 max)",
|
|
658
|
+
"error GrantSystem_InsufficientBalance(uint256 balance, uint256 required)",
|
|
659
|
+
"function grantAllowance(address user, uint256 allowance) payable",
|
|
660
|
+
// BalanceSystem
|
|
661
|
+
"error BalanceSystem_InsufficientBalance(address user, uint256 amount, uint256 balance)",
|
|
662
|
+
"function depositTo(address to) payable",
|
|
663
|
+
"function withdrawTo(address to, uint256 amount)",
|
|
664
|
+
// SpenderSystem
|
|
576
665
|
"error SpenderSystem_AlreadyRegistered(address spender, address user)",
|
|
577
666
|
"error SpenderSystem_HasOwnBalance(address spender)",
|
|
578
|
-
"error BalanceSystem_BalanceTooHigh(address user, uint256 balance, uint256 max)",
|
|
579
|
-
"error BalanceSystem_InsufficientBalance(address user, uint256 amount, uint256 balance)",
|
|
580
667
|
"function registerSpender(address spender)",
|
|
581
|
-
|
|
582
|
-
"
|
|
668
|
+
// PaymasterSystem
|
|
669
|
+
"error PaymasterSystem_InsufficientFunds(address user, uint256 maxCost, uint256 availableAllowance, uint256 availableBalance)",
|
|
670
|
+
"error PaymasterSystem_OnlyEntryPoint()"
|
|
583
671
|
]);
|
|
584
672
|
var paymasterConfig = defineStore({
|
|
585
673
|
namespaces: {
|
|
586
674
|
root: {
|
|
587
675
|
namespace: "",
|
|
588
676
|
tables: {
|
|
589
|
-
|
|
590
|
-
schema: {
|
|
591
|
-
user: "address",
|
|
592
|
-
allowance: "uint256"
|
|
593
|
-
},
|
|
594
|
-
key: ["user"]
|
|
595
|
-
},
|
|
677
|
+
// Balance gets deposited and is withdrawable
|
|
596
678
|
Balance: {
|
|
597
679
|
schema: {
|
|
598
680
|
user: "address",
|
|
@@ -600,31 +682,26 @@ var paymasterConfig = defineStore({
|
|
|
600
682
|
},
|
|
601
683
|
key: ["user"]
|
|
602
684
|
},
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
},
|
|
608
|
-
key: ["grantor"]
|
|
609
|
-
},
|
|
610
|
-
PassHolder: {
|
|
685
|
+
// Allowance gets granted and is not withdrawable
|
|
686
|
+
// Allowance is organized as a linked list and gets spent from smallest to largest
|
|
687
|
+
Allowance: {
|
|
688
|
+
name: "AllowanceV2",
|
|
611
689
|
schema: {
|
|
612
690
|
user: "address",
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
691
|
+
sponsor: "address",
|
|
692
|
+
allowance: "uint256",
|
|
693
|
+
next: "address",
|
|
694
|
+
previous: "address"
|
|
616
695
|
},
|
|
617
|
-
key: ["user", "
|
|
696
|
+
key: ["user", "sponsor"]
|
|
618
697
|
},
|
|
619
|
-
|
|
698
|
+
AllowanceList: {
|
|
620
699
|
schema: {
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
validityPeriod: "uint256",
|
|
625
|
-
grantor: "address"
|
|
700
|
+
user: "address",
|
|
701
|
+
first: "address",
|
|
702
|
+
length: "uint256"
|
|
626
703
|
},
|
|
627
|
-
key: ["
|
|
704
|
+
key: ["user"]
|
|
628
705
|
},
|
|
629
706
|
Spender: {
|
|
630
707
|
schema: {
|
|
@@ -656,7 +733,7 @@ function getPaymaster(chain) {
|
|
|
656
733
|
return {
|
|
657
734
|
type: "quarry",
|
|
658
735
|
address: contracts.quarryPaymaster.address,
|
|
659
|
-
|
|
736
|
+
canSponsor: !!chain.rpcUrls.quarrySponsor?.http?.[0]
|
|
660
737
|
};
|
|
661
738
|
}
|
|
662
739
|
}
|
|
@@ -831,36 +908,21 @@ import { useClient as useClient4 } from "wagmi";
|
|
|
831
908
|
import { queryOptions as queryOptions4, skipToken as skipToken4, useQuery as useQuery5 } from "@tanstack/react-query";
|
|
832
909
|
|
|
833
910
|
// src/quarry/getAllowance.ts
|
|
834
|
-
import {
|
|
835
|
-
import {
|
|
836
|
-
import { getKeyTuple } from "@latticexyz/protocol-parser/internal";
|
|
837
|
-
import { setStorageAt } from "viem/actions";
|
|
911
|
+
import { readContract } from "viem/actions";
|
|
912
|
+
import { getAction as getAction2 } from "viem/utils";
|
|
838
913
|
async function getAllowance({ client, userAddress }) {
|
|
839
914
|
const paymaster = getPaymaster(client.chain);
|
|
840
915
|
if (paymaster?.type !== "quarry") return null;
|
|
841
|
-
|
|
916
|
+
return await getAction2(
|
|
917
|
+
client,
|
|
918
|
+
readContract,
|
|
919
|
+
"readContract"
|
|
920
|
+
)({
|
|
842
921
|
address: paymaster.address,
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
922
|
+
abi: paymasterAbi,
|
|
923
|
+
functionName: "getAllowance",
|
|
924
|
+
args: [userAddress]
|
|
846
925
|
});
|
|
847
|
-
return record.allowance;
|
|
848
|
-
}
|
|
849
|
-
async function setAllowanceSlot({ client, userAddress, allowance }) {
|
|
850
|
-
const paymaster = getPaymaster(client.chain);
|
|
851
|
-
if (paymaster?.type !== "quarry") return;
|
|
852
|
-
const slot = getStaticDataLocation(
|
|
853
|
-
paymasterTables.Allowance.tableId,
|
|
854
|
-
getKeyTuple(paymasterTables.Allowance, { user: userAddress })
|
|
855
|
-
);
|
|
856
|
-
await setStorageAt(
|
|
857
|
-
client.extend(() => ({ mode: "anvil" })),
|
|
858
|
-
{
|
|
859
|
-
address: paymaster.address,
|
|
860
|
-
index: slot,
|
|
861
|
-
value: numberToHex2(allowance, { size: 32 })
|
|
862
|
-
}
|
|
863
|
-
);
|
|
864
926
|
}
|
|
865
927
|
|
|
866
928
|
// src/onboarding/quarry/useAllowance.ts
|
|
@@ -884,11 +946,11 @@ import { useClient as useClient5 } from "wagmi";
|
|
|
884
946
|
import { queryOptions as queryOptions5, skipToken as skipToken5, useQuery as useQuery6 } from "@tanstack/react-query";
|
|
885
947
|
|
|
886
948
|
// src/quarry/getBalance.ts
|
|
887
|
-
import { getRecord as
|
|
949
|
+
import { getRecord as getRecord3 } from "@latticexyz/store/internal";
|
|
888
950
|
async function getBalance({ client, userAddress }) {
|
|
889
951
|
const paymaster = getPaymaster(client.chain);
|
|
890
952
|
if (paymaster?.type !== "quarry") return null;
|
|
891
|
-
const record = await
|
|
953
|
+
const record = await getRecord3(client, {
|
|
892
954
|
address: paymaster.address,
|
|
893
955
|
table: paymasterTables.Balance,
|
|
894
956
|
key: { user: userAddress },
|
|
@@ -1133,169 +1195,15 @@ function Wallet({ isActive, isExpanded, userAddress }) {
|
|
|
1133
1195
|
] });
|
|
1134
1196
|
}
|
|
1135
1197
|
|
|
1136
|
-
// src/onboarding/quarry/Allowance.tsx
|
|
1137
|
-
import { parseEther as parseEther3 } from "viem";
|
|
1138
|
-
|
|
1139
|
-
// src/onboarding/quarry/useClaimGasPass.ts
|
|
1140
|
-
import { parseEther as parseEther2 } from "viem";
|
|
1141
|
-
import { useMutation, useQueryClient as useQueryClient3 } from "@tanstack/react-query";
|
|
1142
|
-
|
|
1143
|
-
// src/quarry/transports/quarryPassIssuer.ts
|
|
1144
|
-
import { http as http2 } from "viem";
|
|
1145
|
-
function quarryPassIssuer() {
|
|
1146
|
-
return ({ chain }) => {
|
|
1147
|
-
if (!chain) throw new Error("No chain provided to issuer transport.");
|
|
1148
|
-
const url = "quarryPassIssuer" in chain.rpcUrls ? chain.rpcUrls.quarryPassIssuer.http[0] : void 0;
|
|
1149
|
-
if (!url) throw new Error(`No \`quarryPassIssuer\` RPC URL found for chain ${chain.id}.`);
|
|
1150
|
-
return http2(url)({ chain, retryCount: 0 });
|
|
1151
|
-
};
|
|
1152
|
-
}
|
|
1153
|
-
|
|
1154
|
-
// src/quarry/claimGasPass.ts
|
|
1155
|
-
async function claimGasPass({ chain, userAddress }) {
|
|
1156
|
-
const transport = quarryPassIssuer()({ chain });
|
|
1157
|
-
debug2("Issuing gas pass to", userAddress);
|
|
1158
|
-
await transport.request({
|
|
1159
|
-
method: "quarry_issuePass",
|
|
1160
|
-
params: ["0x01", userAddress]
|
|
1161
|
-
});
|
|
1162
|
-
debug2("Claiming gas allowance for", userAddress);
|
|
1163
|
-
await transport.request({
|
|
1164
|
-
method: "quarry_claimAllowance",
|
|
1165
|
-
params: ["0x01", userAddress]
|
|
1166
|
-
});
|
|
1167
|
-
}
|
|
1168
|
-
|
|
1169
|
-
// src/onboarding/quarry/useClaimGasPass.ts
|
|
1170
|
-
import { useClient as useClient8 } from "wagmi";
|
|
1171
|
-
function useClaimGasPass() {
|
|
1172
|
-
const queryClient = useQueryClient3();
|
|
1173
|
-
const { chain } = useEntryKitConfig();
|
|
1174
|
-
const client = useClient8({ chainId: chain.id });
|
|
1175
|
-
const mutationKey = ["claimGasPass", chain.id];
|
|
1176
|
-
return useMutation({
|
|
1177
|
-
retry: 0,
|
|
1178
|
-
mutationKey,
|
|
1179
|
-
mutationFn: async (userAddress) => {
|
|
1180
|
-
if (chain.id === 31337) {
|
|
1181
|
-
if (!client) throw new Error("No client?");
|
|
1182
|
-
await setAllowanceSlot({ client, userAddress, allowance: parseEther2("1") });
|
|
1183
|
-
} else {
|
|
1184
|
-
await claimGasPass({ chain, userAddress });
|
|
1185
|
-
}
|
|
1186
|
-
await Promise.all([
|
|
1187
|
-
queryClient.invalidateQueries({ queryKey: ["getAllowance"] }),
|
|
1188
|
-
queryClient.invalidateQueries({ queryKey: ["getFunds"] }),
|
|
1189
|
-
queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] })
|
|
1190
|
-
]);
|
|
1191
|
-
}
|
|
1192
|
-
});
|
|
1193
|
-
}
|
|
1194
|
-
|
|
1195
|
-
// src/icons/EthIcon.tsx
|
|
1196
|
-
import { twMerge as twMerge6 } from "tailwind-merge";
|
|
1197
|
-
import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1198
|
-
function EthIcon({ className, ...props }) {
|
|
1199
|
-
return /* @__PURE__ */ jsxs10(
|
|
1200
|
-
"svg",
|
|
1201
|
-
{
|
|
1202
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
1203
|
-
viewBox: "0 0 263 428",
|
|
1204
|
-
fill: "currentColor",
|
|
1205
|
-
className: twMerge6("w-[0.6em] h-[1em]", className),
|
|
1206
|
-
...props,
|
|
1207
|
-
children: [
|
|
1208
|
-
/* @__PURE__ */ jsx12("path", { d: "M132 321V428L263 243L132 321Z" }),
|
|
1209
|
-
/* @__PURE__ */ jsx12("path", { d: "M0 243L132 321V428", fillOpacity: "0.5" }),
|
|
1210
|
-
/* @__PURE__ */ jsx12("path", { d: "M132 0V296L263 218" }),
|
|
1211
|
-
/* @__PURE__ */ jsx12("path", { d: "M0 218L132 296V0L0 218Z", fillOpacity: "0.5" })
|
|
1212
|
-
]
|
|
1213
|
-
}
|
|
1214
|
-
);
|
|
1215
|
-
}
|
|
1216
|
-
|
|
1217
|
-
// src/formatBalance.ts
|
|
1218
|
-
import { formatEther } from "viem";
|
|
1219
|
-
function formatBalance(wei) {
|
|
1220
|
-
const formatted = formatEther(wei);
|
|
1221
|
-
const parsed = parseFloat(formatted);
|
|
1222
|
-
if (parsed > 0 && parsed < 1e-5) {
|
|
1223
|
-
return "<0.00001";
|
|
1224
|
-
}
|
|
1225
|
-
const magnitude = Math.floor(parsed).toString().length;
|
|
1226
|
-
return parsed.toLocaleString("en-US", { maximumFractionDigits: Math.max(0, 6 - magnitude) });
|
|
1227
|
-
}
|
|
1228
|
-
|
|
1229
|
-
// src/ui/Balance.tsx
|
|
1230
|
-
import { formatEther as formatEther2 } from "viem";
|
|
1231
|
-
import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1232
|
-
function Balance({ wei }) {
|
|
1233
|
-
return /* @__PURE__ */ jsxs11("span", { className: "inline-flex items-center gap-1", title: formatEther2(wei), children: [
|
|
1234
|
-
formatBalance(wei),
|
|
1235
|
-
" ",
|
|
1236
|
-
/* @__PURE__ */ jsx13(EthIcon, {})
|
|
1237
|
-
] });
|
|
1238
|
-
}
|
|
1239
|
-
|
|
1240
|
-
// src/onboarding/quarry/Allowance.tsx
|
|
1241
|
-
import { useEffect as useEffect6 } from "react";
|
|
1242
|
-
|
|
1243
|
-
// src/errors/useShowQueryError.ts
|
|
1244
|
-
import { useEffect as useEffect5 } from "react";
|
|
1245
|
-
function useShowQueryError(result) {
|
|
1246
|
-
const { error: error2, refetch } = result;
|
|
1247
|
-
useEffect5(() => {
|
|
1248
|
-
if (!error2) return;
|
|
1249
|
-
return addError({ error: error2, retry: refetch, dismiss: () => {
|
|
1250
|
-
} });
|
|
1251
|
-
}, [error2, refetch]);
|
|
1252
|
-
return result;
|
|
1253
|
-
}
|
|
1254
|
-
|
|
1255
|
-
// src/onboarding/quarry/Allowance.tsx
|
|
1256
|
-
import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1257
|
-
function Allowance({ isActive, isExpanded, userAddress }) {
|
|
1258
|
-
const allowance = useShowQueryError(useAllowance(userAddress));
|
|
1259
|
-
const claimGasPass2 = useShowMutationError(useClaimGasPass());
|
|
1260
|
-
useEffect6(() => {
|
|
1261
|
-
const timer = setTimeout(() => {
|
|
1262
|
-
if (isActive && claimGasPass2.status === "idle" && allowance.isSuccess && allowance.data != null && allowance.data < parseEther3("0.01")) {
|
|
1263
|
-
claimGasPass2.mutate(userAddress);
|
|
1264
|
-
}
|
|
1265
|
-
});
|
|
1266
|
-
return () => clearTimeout(timer);
|
|
1267
|
-
}, [allowance.data, allowance.isSuccess, claimGasPass2, isActive, userAddress]);
|
|
1268
|
-
return /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-4", children: [
|
|
1269
|
-
/* @__PURE__ */ jsxs12("div", { className: "flex justify-between gap-4", children: [
|
|
1270
|
-
/* @__PURE__ */ jsxs12("div", { children: [
|
|
1271
|
-
/* @__PURE__ */ jsx14("div", { children: "Allowance" }),
|
|
1272
|
-
/* @__PURE__ */ jsx14("div", { className: "font-mono text-white", children: allowance.data != null ? /* @__PURE__ */ jsx14(Balance, { wei: allowance.data }) : /* @__PURE__ */ jsx14(PendingIcon, { className: "text-sm" }) })
|
|
1273
|
-
] }),
|
|
1274
|
-
/* @__PURE__ */ jsx14(
|
|
1275
|
-
Button,
|
|
1276
|
-
{
|
|
1277
|
-
variant: isActive ? "primary" : "tertiary",
|
|
1278
|
-
className: "flex-shrink-0 text-sm p-1 w-28",
|
|
1279
|
-
autoFocus: isActive || isExpanded,
|
|
1280
|
-
pending: allowance.status === "pending" || claimGasPass2.status === "pending",
|
|
1281
|
-
onClick: () => claimGasPass2.mutate(userAddress),
|
|
1282
|
-
children: "Top up"
|
|
1283
|
-
}
|
|
1284
|
-
)
|
|
1285
|
-
] }),
|
|
1286
|
-
isExpanded ? /* @__PURE__ */ jsx14("p", { className: "text-sm", children: "Your allowance is used to pay for onchain computation." }) : null
|
|
1287
|
-
] });
|
|
1288
|
-
}
|
|
1289
|
-
|
|
1290
1198
|
// src/onboarding/Session.tsx
|
|
1291
|
-
import { useEffect as
|
|
1199
|
+
import { useEffect as useEffect6 } from "react";
|
|
1292
1200
|
|
|
1293
1201
|
// src/onboarding/useSetupSession.ts
|
|
1294
|
-
import { encodeFunctionData } from "viem";
|
|
1295
|
-
import { useMutation
|
|
1296
|
-
import { getAction as
|
|
1297
|
-
import { sendUserOperation as sendUserOperation2, waitForUserOperationReceipt } from "viem/account-abstraction";
|
|
1298
|
-
import { waitForTransactionReceipt as waitForTransactionReceipt2 } from "viem/actions";
|
|
1202
|
+
import { encodeFunctionData, parseEventLogs as parseEventLogs2, zeroAddress } from "viem";
|
|
1203
|
+
import { useMutation, useQueryClient as useQueryClient3 } from "@tanstack/react-query";
|
|
1204
|
+
import { getAction as getAction5 } from "viem/utils";
|
|
1205
|
+
import { entryPoint07Abi as entryPoint07Abi2, sendUserOperation as sendUserOperation2, waitForUserOperationReceipt } from "viem/account-abstraction";
|
|
1206
|
+
import { sendCalls, waitForTransactionReceipt as waitForTransactionReceipt2 } from "viem/actions";
|
|
1299
1207
|
|
|
1300
1208
|
// src/utils/defineCall.ts
|
|
1301
1209
|
function defineCall(call) {
|
|
@@ -1303,23 +1211,23 @@ function defineCall(call) {
|
|
|
1303
1211
|
}
|
|
1304
1212
|
|
|
1305
1213
|
// src/onboarding/useSetupSession.ts
|
|
1306
|
-
import { useClient as
|
|
1214
|
+
import { useClient as useClient8 } from "wagmi";
|
|
1307
1215
|
import { resourceToHex as resourceToHex2 } from "@latticexyz/common";
|
|
1308
1216
|
import IBaseWorldAbi from "@latticexyz/world/out/IBaseWorld.sol/IBaseWorld.abi.json";
|
|
1309
1217
|
|
|
1310
1218
|
// src/utils/callWithSignature.ts
|
|
1311
1219
|
import { parseErc6492Signature } from "viem";
|
|
1312
1220
|
import { writeContract as viem_writeContract } from "viem/actions";
|
|
1313
|
-
import { getAction as
|
|
1221
|
+
import { getAction as getAction4 } from "viem/utils";
|
|
1314
1222
|
|
|
1315
1223
|
// src/utils/signCall.ts
|
|
1316
1224
|
import { toHex } from "viem";
|
|
1317
1225
|
import { signTypedData } from "viem/actions";
|
|
1318
1226
|
import { callWithSignatureTypes } from "@latticexyz/world-module-callwithsignature/internal";
|
|
1319
|
-
import { getRecord as
|
|
1227
|
+
import { getRecord as getRecord4 } from "@latticexyz/store/internal";
|
|
1320
1228
|
import moduleConfig from "@latticexyz/world-module-callwithsignature/mud.config";
|
|
1321
1229
|
import { hexToResource } from "@latticexyz/common";
|
|
1322
|
-
import { getAction as
|
|
1230
|
+
import { getAction as getAction3 } from "viem/utils";
|
|
1323
1231
|
async function signCall({
|
|
1324
1232
|
userClient,
|
|
1325
1233
|
worldAddress,
|
|
@@ -1328,14 +1236,14 @@ async function signCall({
|
|
|
1328
1236
|
nonce: initialNonce,
|
|
1329
1237
|
client
|
|
1330
1238
|
}) {
|
|
1331
|
-
const nonce = initialNonce ?? (client ? (await
|
|
1239
|
+
const nonce = initialNonce ?? (client ? (await getRecord4(client, {
|
|
1332
1240
|
address: worldAddress,
|
|
1333
1241
|
table: moduleConfig.tables.CallWithSignatureNonces,
|
|
1334
1242
|
key: { signer: userClient.account.address },
|
|
1335
1243
|
blockTag: "pending"
|
|
1336
1244
|
})).nonce : 0n);
|
|
1337
1245
|
const { namespace: systemNamespace, name: systemName } = hexToResource(systemId);
|
|
1338
|
-
return await
|
|
1246
|
+
return await getAction3(
|
|
1339
1247
|
userClient,
|
|
1340
1248
|
signTypedData,
|
|
1341
1249
|
"signTypedData"
|
|
@@ -1370,7 +1278,7 @@ async function callWithSignature({
|
|
|
1370
1278
|
"ERC-6492 signatures, like from Coinbase Smart Wallet, are not yet supported. Try using a different wallet?"
|
|
1371
1279
|
);
|
|
1372
1280
|
}
|
|
1373
|
-
return
|
|
1281
|
+
return getAction4(
|
|
1374
1282
|
sessionClient,
|
|
1375
1283
|
viem_writeContract,
|
|
1376
1284
|
"writeContract"
|
|
@@ -1384,12 +1292,67 @@ async function callWithSignature({
|
|
|
1384
1292
|
|
|
1385
1293
|
// src/onboarding/useSetupSession.ts
|
|
1386
1294
|
import { systemsConfig as worldSystemsConfig } from "@latticexyz/world/mud.config";
|
|
1387
|
-
|
|
1388
|
-
|
|
1295
|
+
|
|
1296
|
+
// src/createBundlerClient.ts
|
|
1297
|
+
import {
|
|
1298
|
+
createBundlerClient as viem_createBundlerClient
|
|
1299
|
+
} from "viem/account-abstraction";
|
|
1300
|
+
|
|
1301
|
+
// src/actions/cachedFeesPerGas.ts
|
|
1302
|
+
import { estimateFeesPerGas } from "viem/actions";
|
|
1303
|
+
function cachedFeesPerGas(client, options = { refreshInterval: 1e4 }) {
|
|
1304
|
+
let fees = null;
|
|
1305
|
+
async function refreshFees() {
|
|
1306
|
+
fees = await estimateFeesPerGas(client);
|
|
1307
|
+
}
|
|
1308
|
+
refreshFees();
|
|
1309
|
+
setInterval(refreshFees, options.refreshInterval);
|
|
1310
|
+
return async () => {
|
|
1311
|
+
if (fees) return fees;
|
|
1312
|
+
fees = await estimateFeesPerGas(client);
|
|
1313
|
+
return fees;
|
|
1314
|
+
};
|
|
1315
|
+
}
|
|
1316
|
+
|
|
1317
|
+
// src/createBundlerClient.ts
|
|
1318
|
+
function createBundlerClient(config) {
|
|
1319
|
+
const client = config.client;
|
|
1320
|
+
if (!client) throw new Error("No `client` provided to `createBundlerClient`.");
|
|
1321
|
+
const chain = config.chain ?? client.chain;
|
|
1322
|
+
const paymaster = chain ? getPaymaster(chain) : void 0;
|
|
1323
|
+
return viem_createBundlerClient({
|
|
1324
|
+
...defaultClientConfig,
|
|
1325
|
+
paymaster: paymaster ? {
|
|
1326
|
+
getPaymasterData: async () => ({
|
|
1327
|
+
paymaster: paymaster.address,
|
|
1328
|
+
paymasterData: "0x"
|
|
1329
|
+
})
|
|
1330
|
+
} : void 0,
|
|
1331
|
+
userOperation: {
|
|
1332
|
+
estimateFeesPerGas: createFeeEstimator(client)
|
|
1333
|
+
},
|
|
1334
|
+
...config
|
|
1335
|
+
});
|
|
1336
|
+
}
|
|
1337
|
+
function createFeeEstimator(client) {
|
|
1338
|
+
if (!client.chain) return;
|
|
1339
|
+
if (client.chain.id === 31337) {
|
|
1340
|
+
return async () => ({ maxFeePerGas: 100000n, maxPriorityFeePerGas: 0n });
|
|
1341
|
+
}
|
|
1342
|
+
if ([690, 17069, 695569].includes(client.chain.id)) {
|
|
1343
|
+
return cachedFeesPerGas(client);
|
|
1344
|
+
}
|
|
1345
|
+
}
|
|
1346
|
+
|
|
1347
|
+
// src/onboarding/useSetupSession.ts
|
|
1348
|
+
import { isIdPlaceConnector as isIdPlaceConnector2 } from "@latticexyz/id.place/internal";
|
|
1349
|
+
import { storeEventsAbi } from "@latticexyz/store";
|
|
1350
|
+
function useSetupSession({ connector, userClient }) {
|
|
1351
|
+
const queryClient = useQueryClient3();
|
|
1389
1352
|
const { chainId, worldAddress } = useEntryKitConfig();
|
|
1390
|
-
const client =
|
|
1353
|
+
const client = useClient8({ chainId });
|
|
1391
1354
|
const mutationKey = ["setupSession", client?.chain.id, userClient.account.address];
|
|
1392
|
-
return
|
|
1355
|
+
return useMutation({
|
|
1393
1356
|
retry: 0,
|
|
1394
1357
|
mutationKey,
|
|
1395
1358
|
mutationFn: async ({
|
|
@@ -1400,8 +1363,69 @@ function useSetupSession({ userClient }) {
|
|
|
1400
1363
|
if (!client) throw new Error("Client not ready.");
|
|
1401
1364
|
const paymaster = getPaymaster(client.chain);
|
|
1402
1365
|
const sessionAddress = sessionClient.account.address;
|
|
1403
|
-
console.log("setting up session");
|
|
1404
|
-
if (
|
|
1366
|
+
console.log("setting up session", userClient);
|
|
1367
|
+
if (isIdPlaceConnector2(connector)) {
|
|
1368
|
+
const calls = [];
|
|
1369
|
+
if (registerSpender && paymaster?.type === "quarry") {
|
|
1370
|
+
console.log("registering spender");
|
|
1371
|
+
calls.push(
|
|
1372
|
+
defineCall({
|
|
1373
|
+
to: paymaster.address,
|
|
1374
|
+
abi: paymasterAbi,
|
|
1375
|
+
functionName: "registerSpender",
|
|
1376
|
+
args: [sessionAddress]
|
|
1377
|
+
})
|
|
1378
|
+
);
|
|
1379
|
+
}
|
|
1380
|
+
if (registerDelegation) {
|
|
1381
|
+
console.log("registering delegation");
|
|
1382
|
+
calls.push(
|
|
1383
|
+
defineCall({
|
|
1384
|
+
to: worldAddress,
|
|
1385
|
+
abi: worldAbi,
|
|
1386
|
+
functionName: "registerDelegation",
|
|
1387
|
+
args: [sessionAddress, unlimitedDelegationControlId, "0x"]
|
|
1388
|
+
})
|
|
1389
|
+
);
|
|
1390
|
+
}
|
|
1391
|
+
if (!calls.length) return;
|
|
1392
|
+
console.log("setting up account with", calls, userClient.account.address, sessionAddress);
|
|
1393
|
+
const { id } = await getAction5(
|
|
1394
|
+
userClient,
|
|
1395
|
+
sendCalls,
|
|
1396
|
+
"sendCalls"
|
|
1397
|
+
)({
|
|
1398
|
+
account: userClient.account,
|
|
1399
|
+
calls
|
|
1400
|
+
});
|
|
1401
|
+
console.log("got send calls ID", id);
|
|
1402
|
+
const bundlerClient = createBundlerClient({
|
|
1403
|
+
transport: getBundlerTransport(client.chain),
|
|
1404
|
+
client
|
|
1405
|
+
});
|
|
1406
|
+
console.log("waiting for receipt");
|
|
1407
|
+
const receipt = await getAction5(
|
|
1408
|
+
bundlerClient,
|
|
1409
|
+
waitForUserOperationReceipt,
|
|
1410
|
+
"waitForUserOperationReceipt"
|
|
1411
|
+
)({ hash: id });
|
|
1412
|
+
console.log("got result", receipt);
|
|
1413
|
+
console.log(
|
|
1414
|
+
"parsed logs",
|
|
1415
|
+
worldAddress,
|
|
1416
|
+
parseEventLogs2({
|
|
1417
|
+
logs: receipt.logs,
|
|
1418
|
+
abi: [
|
|
1419
|
+
...entryPoint07Abi2,
|
|
1420
|
+
// TODO: export account abi from id package
|
|
1421
|
+
// ...abi,
|
|
1422
|
+
...worldAbi,
|
|
1423
|
+
...storeEventsAbi,
|
|
1424
|
+
...calls.flatMap((call) => call.abi)
|
|
1425
|
+
]
|
|
1426
|
+
})
|
|
1427
|
+
);
|
|
1428
|
+
} else if (userClient.account.type === "smart") {
|
|
1405
1429
|
const calls = [];
|
|
1406
1430
|
if (registerSpender && paymaster?.type === "quarry") {
|
|
1407
1431
|
console.log("registering spender");
|
|
@@ -1427,9 +1451,9 @@ function useSetupSession({ userClient }) {
|
|
|
1427
1451
|
}
|
|
1428
1452
|
if (!calls.length) return;
|
|
1429
1453
|
console.log("setting up account with", calls, userClient);
|
|
1430
|
-
const hash = await
|
|
1454
|
+
const hash = await getAction5(userClient, sendUserOperation2, "sendUserOperation")({ calls });
|
|
1431
1455
|
console.log("got user op hash", hash);
|
|
1432
|
-
const receipt = await
|
|
1456
|
+
const receipt = await getAction5(
|
|
1433
1457
|
userClient,
|
|
1434
1458
|
waitForUserOperationReceipt,
|
|
1435
1459
|
"waitForUserOperationReceipt"
|
|
@@ -1468,95 +1492,59 @@ function useSetupSession({ userClient }) {
|
|
|
1468
1492
|
callData: encodeFunctionData({
|
|
1469
1493
|
abi: IBaseWorldAbi,
|
|
1470
1494
|
functionName: "registerDelegation",
|
|
1471
|
-
args: [sessionAddress, unlimitedDelegationControlId, "0x"]
|
|
1472
|
-
})
|
|
1473
|
-
});
|
|
1474
|
-
console.log("got delegation tx", tx);
|
|
1475
|
-
txs.push(tx);
|
|
1476
|
-
}
|
|
1477
|
-
if (!txs.length) return;
|
|
1478
|
-
console.log("waiting for", txs.length, "receipts");
|
|
1479
|
-
for (const hash of txs) {
|
|
1480
|
-
const receipt = await
|
|
1481
|
-
console.log("got tx receipt", receipt);
|
|
1482
|
-
if (receipt.status === "reverted") {
|
|
1483
|
-
console.error("tx reverted?", receipt);
|
|
1484
|
-
}
|
|
1485
|
-
}
|
|
1486
|
-
}
|
|
1487
|
-
await
|
|
1488
|
-
|
|
1489
|
-
|
|
1490
|
-
|
|
1491
|
-
|
|
1492
|
-
|
|
1493
|
-
|
|
1494
|
-
|
|
1495
|
-
|
|
1496
|
-
|
|
1497
|
-
|
|
1498
|
-
|
|
1499
|
-
|
|
1500
|
-
|
|
1501
|
-
|
|
1502
|
-
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
|
|
1507
|
-
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
createBundlerClient as viem_createBundlerClient
|
|
1511
|
-
} from "viem/account-abstraction";
|
|
1512
|
-
|
|
1513
|
-
// src/actions/cachedFeesPerGas.ts
|
|
1514
|
-
import { estimateFeesPerGas } from "viem/actions";
|
|
1515
|
-
function cachedFeesPerGas(client, options = { refreshInterval: 1e4 }) {
|
|
1516
|
-
let fees = null;
|
|
1517
|
-
async function refreshFees() {
|
|
1518
|
-
fees = await estimateFeesPerGas(client);
|
|
1519
|
-
}
|
|
1520
|
-
refreshFees();
|
|
1521
|
-
setInterval(refreshFees, options.refreshInterval);
|
|
1522
|
-
return async () => {
|
|
1523
|
-
if (fees) return fees;
|
|
1524
|
-
fees = await estimateFeesPerGas(client);
|
|
1525
|
-
return fees;
|
|
1526
|
-
};
|
|
1527
|
-
}
|
|
1528
|
-
|
|
1529
|
-
// src/createBundlerClient.ts
|
|
1530
|
-
function createBundlerClient(config) {
|
|
1531
|
-
const client = config.client;
|
|
1532
|
-
if (!client) throw new Error("No `client` provided to `createBundlerClient`.");
|
|
1533
|
-
const chain = config.chain ?? client.chain;
|
|
1534
|
-
const paymaster = chain ? getPaymaster(chain) : void 0;
|
|
1535
|
-
return viem_createBundlerClient({
|
|
1536
|
-
...defaultClientConfig,
|
|
1537
|
-
paymaster: paymaster ? {
|
|
1538
|
-
getPaymasterData: async () => ({
|
|
1539
|
-
paymaster: paymaster.address,
|
|
1540
|
-
paymasterData: "0x"
|
|
1541
|
-
})
|
|
1542
|
-
} : void 0,
|
|
1543
|
-
userOperation: {
|
|
1544
|
-
estimateFeesPerGas: createFeeEstimator(client)
|
|
1545
|
-
},
|
|
1546
|
-
...config
|
|
1495
|
+
args: [sessionAddress, unlimitedDelegationControlId, "0x"]
|
|
1496
|
+
})
|
|
1497
|
+
});
|
|
1498
|
+
console.log("got delegation tx", tx);
|
|
1499
|
+
txs.push(tx);
|
|
1500
|
+
}
|
|
1501
|
+
if (!txs.length) return;
|
|
1502
|
+
console.log("waiting for", txs.length, "receipts");
|
|
1503
|
+
for (const hash of txs) {
|
|
1504
|
+
const receipt = await getAction5(client, waitForTransactionReceipt2, "waitForTransactionReceipt")({ hash });
|
|
1505
|
+
console.log("got tx receipt", receipt);
|
|
1506
|
+
if (receipt.status === "reverted") {
|
|
1507
|
+
console.error("tx reverted?", receipt);
|
|
1508
|
+
}
|
|
1509
|
+
}
|
|
1510
|
+
}
|
|
1511
|
+
await (async () => {
|
|
1512
|
+
if (await sessionClient.account.isDeployed?.()) return;
|
|
1513
|
+
console.log("creating session account by sending empty user op");
|
|
1514
|
+
const hash = await getAction5(
|
|
1515
|
+
sessionClient,
|
|
1516
|
+
sendUserOperation2,
|
|
1517
|
+
"sendUserOperation"
|
|
1518
|
+
)({
|
|
1519
|
+
calls: [{ to: zeroAddress }]
|
|
1520
|
+
});
|
|
1521
|
+
const receipt = await getAction5(
|
|
1522
|
+
sessionClient,
|
|
1523
|
+
waitForUserOperationReceipt,
|
|
1524
|
+
"waitForUserOperationReceipt"
|
|
1525
|
+
)({ hash });
|
|
1526
|
+
console.log("got user op receipt", receipt);
|
|
1527
|
+
})();
|
|
1528
|
+
await Promise.all([
|
|
1529
|
+
queryClient.invalidateQueries({ queryKey: ["getSpender"] }),
|
|
1530
|
+
queryClient.invalidateQueries({ queryKey: ["getDelegation"] }),
|
|
1531
|
+
queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] })
|
|
1532
|
+
]);
|
|
1533
|
+
}
|
|
1547
1534
|
});
|
|
1548
1535
|
}
|
|
1549
|
-
|
|
1550
|
-
|
|
1551
|
-
|
|
1552
|
-
|
|
1553
|
-
|
|
1554
|
-
|
|
1555
|
-
|
|
1556
|
-
|
|
1557
|
-
}
|
|
1536
|
+
|
|
1537
|
+
// src/useSessionClient.ts
|
|
1538
|
+
import { useClient as useClient9 } from "wagmi";
|
|
1539
|
+
import {
|
|
1540
|
+
queryOptions as queryOptions8,
|
|
1541
|
+
useQuery as useQuery10,
|
|
1542
|
+
useQueryClient as useQueryClient4
|
|
1543
|
+
} from "@tanstack/react-query";
|
|
1558
1544
|
|
|
1559
1545
|
// src/getSessionClient.ts
|
|
1546
|
+
import { smartAccountActions } from "permissionless";
|
|
1547
|
+
import { callFrom, sendUserOperationFrom } from "@latticexyz/world/internal";
|
|
1560
1548
|
async function getSessionClient({
|
|
1561
1549
|
userAddress,
|
|
1562
1550
|
sessionAccount,
|
|
@@ -1618,9 +1606,9 @@ function getSessionClientQueryOptions({
|
|
|
1618
1606
|
});
|
|
1619
1607
|
}
|
|
1620
1608
|
function useSessionClient(userAddress) {
|
|
1621
|
-
const queryClient =
|
|
1609
|
+
const queryClient = useQueryClient4();
|
|
1622
1610
|
const { chainId, worldAddress } = useEntryKitConfig();
|
|
1623
|
-
const client =
|
|
1611
|
+
const client = useClient9({ chainId });
|
|
1624
1612
|
return useQuery10(
|
|
1625
1613
|
getSessionClientQueryOptions({
|
|
1626
1614
|
queryClient,
|
|
@@ -1631,22 +1619,29 @@ function useSessionClient(userAddress) {
|
|
|
1631
1619
|
);
|
|
1632
1620
|
}
|
|
1633
1621
|
|
|
1622
|
+
// src/errors/useShowQueryError.ts
|
|
1623
|
+
import { useEffect as useEffect5 } from "react";
|
|
1624
|
+
function useShowQueryError(result) {
|
|
1625
|
+
const { error: error2, refetch } = result;
|
|
1626
|
+
useEffect5(() => {
|
|
1627
|
+
if (!error2) return;
|
|
1628
|
+
return addError({ error: error2, retry: refetch, dismiss: () => {
|
|
1629
|
+
} });
|
|
1630
|
+
}, [error2, refetch]);
|
|
1631
|
+
return result;
|
|
1632
|
+
}
|
|
1633
|
+
|
|
1634
1634
|
// src/onboarding/Session.tsx
|
|
1635
|
-
import { jsx as
|
|
1636
|
-
function Session({ isActive, isExpanded, userClient, registerSpender, registerDelegation }) {
|
|
1635
|
+
import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1636
|
+
function Session({ isActive, isExpanded, connector, userClient, registerSpender, registerDelegation }) {
|
|
1637
1637
|
const sessionClient = useShowQueryError(useSessionClient(userClient.account.address));
|
|
1638
|
-
const setup = useShowMutationError(useSetupSession({ userClient }));
|
|
1638
|
+
const setup = useShowMutationError(useSetupSession({ userClient, connector }));
|
|
1639
1639
|
const hasSession = !registerDelegation && !registerDelegation;
|
|
1640
1640
|
const { data: prerequisites } = usePrerequisites(userClient.account.address);
|
|
1641
1641
|
const { hasAllowance, hasGasBalance, hasQuarryGasBalance } = prerequisites ?? {};
|
|
1642
|
-
|
|
1642
|
+
useEffect6(() => {
|
|
1643
1643
|
const timer = setTimeout(() => {
|
|
1644
1644
|
if (isActive && setup.status === "idle" && sessionClient.data && !hasSession && (hasAllowance || hasGasBalance || hasQuarryGasBalance)) {
|
|
1645
|
-
setup.mutate({
|
|
1646
|
-
sessionClient: sessionClient.data,
|
|
1647
|
-
registerSpender,
|
|
1648
|
-
registerDelegation
|
|
1649
|
-
});
|
|
1650
1645
|
}
|
|
1651
1646
|
});
|
|
1652
1647
|
return () => clearTimeout(timer);
|
|
@@ -1661,13 +1656,13 @@ function Session({ isActive, isExpanded, userClient, registerSpender, registerDe
|
|
|
1661
1656
|
hasGasBalance,
|
|
1662
1657
|
hasQuarryGasBalance
|
|
1663
1658
|
]);
|
|
1664
|
-
return /* @__PURE__ */
|
|
1665
|
-
/* @__PURE__ */
|
|
1666
|
-
/* @__PURE__ */
|
|
1667
|
-
/* @__PURE__ */
|
|
1668
|
-
/* @__PURE__ */
|
|
1659
|
+
return /* @__PURE__ */ jsxs10("div", { className: "flex flex-col gap-4", children: [
|
|
1660
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex justify-between gap-4", children: [
|
|
1661
|
+
/* @__PURE__ */ jsxs10("div", { children: [
|
|
1662
|
+
/* @__PURE__ */ jsx12("div", { children: "Session" }),
|
|
1663
|
+
/* @__PURE__ */ jsx12("div", { className: "font-mono text-white", children: hasSession ? "Enabled" : "Set up" })
|
|
1669
1664
|
] }),
|
|
1670
|
-
hasSession ? /* @__PURE__ */
|
|
1665
|
+
hasSession ? /* @__PURE__ */ jsx12(Button, { variant: "tertiary", className: "flex-shrink-0 text-sm p-1 w-28", autoFocus: isActive, disabled: true, children: "Enabled" }) : /* @__PURE__ */ jsx12(
|
|
1671
1666
|
Button,
|
|
1672
1667
|
{
|
|
1673
1668
|
variant: isActive ? "primary" : "tertiary",
|
|
@@ -1683,14 +1678,61 @@ function Session({ isActive, isExpanded, userClient, registerSpender, registerDe
|
|
|
1683
1678
|
}
|
|
1684
1679
|
)
|
|
1685
1680
|
] }),
|
|
1686
|
-
isExpanded ? /* @__PURE__ */
|
|
1681
|
+
isExpanded ? /* @__PURE__ */ jsx12("p", { className: "text-sm", children: "You can perform actions in this app without interruptions for approvals." }) : null
|
|
1682
|
+
] });
|
|
1683
|
+
}
|
|
1684
|
+
|
|
1685
|
+
// src/onboarding/GasBalance.tsx
|
|
1686
|
+
import { useEffect as useEffect8, useState as useState2 } from "react";
|
|
1687
|
+
import { parseEther as parseEther2 } from "viem";
|
|
1688
|
+
import { useQueryClient as useQueryClient6 } from "@tanstack/react-query";
|
|
1689
|
+
|
|
1690
|
+
// src/icons/EthIcon.tsx
|
|
1691
|
+
import { twMerge as twMerge6 } from "tailwind-merge";
|
|
1692
|
+
import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1693
|
+
function EthIcon({ className, ...props }) {
|
|
1694
|
+
return /* @__PURE__ */ jsxs11(
|
|
1695
|
+
"svg",
|
|
1696
|
+
{
|
|
1697
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1698
|
+
viewBox: "0 0 263 428",
|
|
1699
|
+
fill: "currentColor",
|
|
1700
|
+
className: twMerge6("w-[0.6em] h-[1em]", className),
|
|
1701
|
+
...props,
|
|
1702
|
+
children: [
|
|
1703
|
+
/* @__PURE__ */ jsx13("path", { d: "M132 321V428L263 243L132 321Z" }),
|
|
1704
|
+
/* @__PURE__ */ jsx13("path", { d: "M0 243L132 321V428", fillOpacity: "0.5" }),
|
|
1705
|
+
/* @__PURE__ */ jsx13("path", { d: "M132 0V296L263 218" }),
|
|
1706
|
+
/* @__PURE__ */ jsx13("path", { d: "M0 218L132 296V0L0 218Z", fillOpacity: "0.5" })
|
|
1707
|
+
]
|
|
1708
|
+
}
|
|
1709
|
+
);
|
|
1710
|
+
}
|
|
1711
|
+
|
|
1712
|
+
// src/formatBalance.ts
|
|
1713
|
+
import { formatEther } from "viem";
|
|
1714
|
+
function formatBalance(wei) {
|
|
1715
|
+
const formatted = formatEther(wei);
|
|
1716
|
+
const parsed = parseFloat(formatted);
|
|
1717
|
+
if (parsed > 0 && parsed < 1e-5) {
|
|
1718
|
+
return "<0.00001";
|
|
1719
|
+
}
|
|
1720
|
+
const magnitude = Math.floor(parsed).toString().length;
|
|
1721
|
+
return parsed.toLocaleString("en-US", { maximumFractionDigits: Math.max(0, 6 - magnitude) });
|
|
1722
|
+
}
|
|
1723
|
+
|
|
1724
|
+
// src/ui/Balance.tsx
|
|
1725
|
+
import { formatEther as formatEther2 } from "viem";
|
|
1726
|
+
import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1727
|
+
function Balance({ wei }) {
|
|
1728
|
+
return /* @__PURE__ */ jsxs12("span", { className: "inline-flex items-center gap-1", title: formatEther2(wei), children: [
|
|
1729
|
+
formatBalance(wei),
|
|
1730
|
+
" ",
|
|
1731
|
+
/* @__PURE__ */ jsx14(EthIcon, {})
|
|
1687
1732
|
] });
|
|
1688
1733
|
}
|
|
1689
1734
|
|
|
1690
1735
|
// src/onboarding/GasBalance.tsx
|
|
1691
|
-
import { useEffect as useEffect9, useState as useState2 } from "react";
|
|
1692
|
-
import { parseEther as parseEther4 } from "viem";
|
|
1693
|
-
import { useQueryClient as useQueryClient7 } from "@tanstack/react-query";
|
|
1694
1736
|
import { useBalance as useBalance2, useWatchBlockNumber } from "wagmi";
|
|
1695
1737
|
|
|
1696
1738
|
// src/data/relayChains.json
|
|
@@ -1974,14 +2016,14 @@ var relayChains_default = {
|
|
|
1974
2016
|
};
|
|
1975
2017
|
|
|
1976
2018
|
// src/onboarding/useSetBalance.ts
|
|
1977
|
-
import { useQueryClient as
|
|
2019
|
+
import { useQueryClient as useQueryClient5, useMutation as useMutation2 } from "@tanstack/react-query";
|
|
1978
2020
|
import { setBalance as setBalance2 } from "viem/actions";
|
|
1979
|
-
import { useClient as
|
|
2021
|
+
import { useClient as useClient10 } from "wagmi";
|
|
1980
2022
|
function useSetBalance() {
|
|
1981
|
-
const queryClient =
|
|
2023
|
+
const queryClient = useQueryClient5();
|
|
1982
2024
|
const { chainId } = useEntryKitConfig();
|
|
1983
|
-
const client =
|
|
1984
|
-
return
|
|
2025
|
+
const client = useClient10({ chainId });
|
|
2026
|
+
return useMutation2({
|
|
1985
2027
|
retry: 0,
|
|
1986
2028
|
mutationKey: ["setBalance", chainId],
|
|
1987
2029
|
mutationFn: async (params) => {
|
|
@@ -1998,10 +2040,10 @@ function useSetBalance() {
|
|
|
1998
2040
|
}
|
|
1999
2041
|
|
|
2000
2042
|
// src/errors/usePrevious.ts
|
|
2001
|
-
import { useEffect as
|
|
2043
|
+
import { useEffect as useEffect7, useRef as useRef3 } from "react";
|
|
2002
2044
|
function usePrevious(value, initialValue) {
|
|
2003
2045
|
const ref = useRef3();
|
|
2004
|
-
|
|
2046
|
+
useEffect7(() => {
|
|
2005
2047
|
ref.current = { value };
|
|
2006
2048
|
}, [value]);
|
|
2007
2049
|
return ref.current ? ref.current.value : initialValue;
|
|
@@ -2009,9 +2051,9 @@ function usePrevious(value, initialValue) {
|
|
|
2009
2051
|
|
|
2010
2052
|
// src/icons/IconSVG.tsx
|
|
2011
2053
|
import { twMerge as twMerge7 } from "tailwind-merge";
|
|
2012
|
-
import { jsx as
|
|
2054
|
+
import { jsx as jsx15 } from "react/jsx-runtime";
|
|
2013
2055
|
function IconSVG({ className, children, ...props }) {
|
|
2014
|
-
return /* @__PURE__ */
|
|
2056
|
+
return /* @__PURE__ */ jsx15(
|
|
2015
2057
|
"svg",
|
|
2016
2058
|
{
|
|
2017
2059
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2025,9 +2067,9 @@ function IconSVG({ className, children, ...props }) {
|
|
|
2025
2067
|
}
|
|
2026
2068
|
|
|
2027
2069
|
// src/icons/CopyIcon.tsx
|
|
2028
|
-
import { jsx as
|
|
2070
|
+
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
2029
2071
|
function CopyIcon(props) {
|
|
2030
|
-
return /* @__PURE__ */
|
|
2072
|
+
return /* @__PURE__ */ jsx16(IconSVG, { ...props, children: /* @__PURE__ */ jsx16(
|
|
2031
2073
|
"path",
|
|
2032
2074
|
{
|
|
2033
2075
|
d: "M8 5H6C4.89543 5 4 5.89543 4 7V19C4 20.1046 4.89543 21 6 21H16C17.1046 21 18 20.1046 18 19V18M8 5C8 6.10457 8.89543 7 10 7H12C13.1046 7 14 6.10457 14 5M8 5C8 3.89543 8.89543 3 10 3H12C13.1046 3 14 3.89543 14 5M14 5H16C17.1046 5 18 5.89543 18 7V10M20 14H10M10 14L13 11M10 14L13 17",
|
|
@@ -2041,9 +2083,9 @@ function CopyIcon(props) {
|
|
|
2041
2083
|
}
|
|
2042
2084
|
|
|
2043
2085
|
// src/icons/CheckIcon.tsx
|
|
2044
|
-
import { jsx as
|
|
2086
|
+
import { jsx as jsx17 } from "react/jsx-runtime";
|
|
2045
2087
|
function CheckIcon(props) {
|
|
2046
|
-
return /* @__PURE__ */
|
|
2088
|
+
return /* @__PURE__ */ jsx17(IconSVG, { ...props, children: /* @__PURE__ */ jsx17(
|
|
2047
2089
|
"path",
|
|
2048
2090
|
{
|
|
2049
2091
|
d: "M5 13L9 17L19 7",
|
|
@@ -2057,9 +2099,9 @@ function CheckIcon(props) {
|
|
|
2057
2099
|
}
|
|
2058
2100
|
|
|
2059
2101
|
// src/onboarding/GasBalance.tsx
|
|
2060
|
-
import { Fragment, jsx as
|
|
2102
|
+
import { Fragment as Fragment2, jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
2061
2103
|
function GasBalance({ isActive, isExpanded, sessionAddress }) {
|
|
2062
|
-
const queryClient =
|
|
2104
|
+
const queryClient = useQueryClient6();
|
|
2063
2105
|
const { chain } = useEntryKitConfig();
|
|
2064
2106
|
const [copied, setCopied] = useState2(false);
|
|
2065
2107
|
const balance = useShowQueryError(useBalance2({ chainId: chain.id, address: sessionAddress }));
|
|
@@ -2072,19 +2114,19 @@ function GasBalance({ isActive, isExpanded, sessionAddress }) {
|
|
|
2072
2114
|
setCopied(true);
|
|
2073
2115
|
setTimeout(() => setCopied(false), 2e3);
|
|
2074
2116
|
};
|
|
2075
|
-
|
|
2117
|
+
useEffect8(() => {
|
|
2076
2118
|
if (balance.data != null && prevBalance?.value === 0n && balance.data.value > 0n) {
|
|
2077
2119
|
queryClient.invalidateQueries({ queryKey: ["getFunds"] });
|
|
2078
2120
|
queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] });
|
|
2079
2121
|
}
|
|
2080
2122
|
}, [balance.data, prevBalance, setBalance3, sessionAddress, queryClient]);
|
|
2081
|
-
return /* @__PURE__ */
|
|
2082
|
-
/* @__PURE__ */
|
|
2083
|
-
/* @__PURE__ */
|
|
2084
|
-
/* @__PURE__ */
|
|
2085
|
-
/* @__PURE__ */
|
|
2123
|
+
return /* @__PURE__ */ jsxs13("div", { className: "flex flex-col gap-4", children: [
|
|
2124
|
+
/* @__PURE__ */ jsxs13("div", { className: "flex justify-between gap-4", children: [
|
|
2125
|
+
/* @__PURE__ */ jsxs13("div", { children: [
|
|
2126
|
+
/* @__PURE__ */ jsx18("div", { children: "Gas balance" }),
|
|
2127
|
+
/* @__PURE__ */ jsx18("div", { className: "font-mono text-white", children: balance.data != null ? /* @__PURE__ */ jsx18(Balance, { wei: balance.data.value }) : /* @__PURE__ */ jsx18(PendingIcon, { className: "text-sm" }) })
|
|
2086
2128
|
] }),
|
|
2087
|
-
chain.id === 31337 ? /* @__PURE__ */
|
|
2129
|
+
chain.id === 31337 ? /* @__PURE__ */ jsx18(
|
|
2088
2130
|
Button,
|
|
2089
2131
|
{
|
|
2090
2132
|
variant: isActive ? "primary" : "tertiary",
|
|
@@ -2093,19 +2135,19 @@ function GasBalance({ isActive, isExpanded, sessionAddress }) {
|
|
|
2093
2135
|
pending: balance.status === "pending" || setBalance3.status === "pending",
|
|
2094
2136
|
onClick: () => setBalance3.mutate({
|
|
2095
2137
|
address: sessionAddress,
|
|
2096
|
-
value:
|
|
2138
|
+
value: parseEther2("0.01") + (balance.data?.value ?? 0n)
|
|
2097
2139
|
}),
|
|
2098
2140
|
children: "Top up"
|
|
2099
2141
|
}
|
|
2100
2142
|
) : relayChain != null ? (
|
|
2101
2143
|
// TODO: convert this to a <ButtonLink>
|
|
2102
|
-
/* @__PURE__ */
|
|
2144
|
+
/* @__PURE__ */ jsx18(
|
|
2103
2145
|
"a",
|
|
2104
2146
|
{
|
|
2105
2147
|
href: `${relayChain.bridgeUrl}?${new URLSearchParams({ toAddress: sessionAddress, amount: "0.01" })}`,
|
|
2106
2148
|
target: "_blank",
|
|
2107
2149
|
rel: "noopener noreferrer",
|
|
2108
|
-
children: /* @__PURE__ */
|
|
2150
|
+
children: /* @__PURE__ */ jsx18(
|
|
2109
2151
|
Button,
|
|
2110
2152
|
{
|
|
2111
2153
|
variant: isActive ? "primary" : "tertiary",
|
|
@@ -2119,21 +2161,21 @@ function GasBalance({ isActive, isExpanded, sessionAddress }) {
|
|
|
2119
2161
|
)
|
|
2120
2162
|
) : null
|
|
2121
2163
|
] }),
|
|
2122
|
-
isExpanded ? /* @__PURE__ */
|
|
2123
|
-
/* @__PURE__ */
|
|
2124
|
-
/* @__PURE__ */
|
|
2164
|
+
isExpanded ? /* @__PURE__ */ jsxs13(Fragment2, { children: [
|
|
2165
|
+
/* @__PURE__ */ jsx18("p", { className: "text-sm", children: "Your session's gas balance is used to pay for onchain computation." }),
|
|
2166
|
+
/* @__PURE__ */ jsxs13("p", { className: "text-sm", children: [
|
|
2125
2167
|
"Send funds to",
|
|
2126
2168
|
" ",
|
|
2127
|
-
/* @__PURE__ */
|
|
2169
|
+
/* @__PURE__ */ jsxs13(
|
|
2128
2170
|
"span",
|
|
2129
2171
|
{
|
|
2130
2172
|
className: "inline-flex items-center gap-1 font-mono text-white cursor-pointer hover:text-white/80 transition-colors",
|
|
2131
2173
|
onClick: handleCopy,
|
|
2132
2174
|
title: "Click to copy",
|
|
2133
2175
|
children: [
|
|
2134
|
-
/* @__PURE__ */
|
|
2176
|
+
/* @__PURE__ */ jsx18(TruncatedHex, { hex: sessionAddress }),
|
|
2135
2177
|
" ",
|
|
2136
|
-
copied ? /* @__PURE__ */
|
|
2178
|
+
copied ? /* @__PURE__ */ jsx18(CheckIcon, { className: "w-3.5 h-3.5" }) : /* @__PURE__ */ jsx18(CopyIcon, { className: "w-3.5 h-3.5" })
|
|
2137
2179
|
]
|
|
2138
2180
|
}
|
|
2139
2181
|
),
|
|
@@ -2147,7 +2189,7 @@ function GasBalance({ isActive, isExpanded, sessionAddress }) {
|
|
|
2147
2189
|
}
|
|
2148
2190
|
|
|
2149
2191
|
// src/onboarding/quarry/GasBalance.tsx
|
|
2150
|
-
import { useEffect as
|
|
2192
|
+
import { useEffect as useEffect13 } from "react";
|
|
2151
2193
|
import { useQueryClient as useQueryClient10 } from "@tanstack/react-query";
|
|
2152
2194
|
|
|
2153
2195
|
// src/onboarding/deposit/DepositFormContainer.tsx
|
|
@@ -2157,24 +2199,24 @@ import { useChains as useChains4, useChainId } from "wagmi";
|
|
|
2157
2199
|
// src/onboarding/deposit/DepositViaTransferForm.tsx
|
|
2158
2200
|
import { useAccount as useAccount4, useWriteContract, usePrepareTransactionRequest, usePublicClient } from "wagmi";
|
|
2159
2201
|
import { encodeFunctionData as encodeFunctionData2 } from "viem";
|
|
2160
|
-
import { useMutation as
|
|
2202
|
+
import { useMutation as useMutation3, useQuery as useQuery13 } from "@tanstack/react-query";
|
|
2161
2203
|
|
|
2162
2204
|
// src/onboarding/deposit/DepositForm.tsx
|
|
2163
|
-
import { useEffect as
|
|
2205
|
+
import { useEffect as useEffect10, useRef as useRef4 } from "react";
|
|
2164
2206
|
import { useAccount as useAccount3, useBalance as useBalance4, useWatchBlockNumber as useWatchBlockNumber2 } from "wagmi";
|
|
2165
2207
|
import { useIsMounted } from "usehooks-ts";
|
|
2166
2208
|
import { twMerge as twMerge15 } from "tailwind-merge";
|
|
2167
2209
|
|
|
2168
2210
|
// src/onboarding/deposit/ChainSelect.tsx
|
|
2169
|
-
import { useEffect as
|
|
2211
|
+
import { useEffect as useEffect9, useMemo as useMemo2 } from "react";
|
|
2170
2212
|
import { useSwitchChain } from "wagmi";
|
|
2171
2213
|
import { twMerge as twMerge12 } from "tailwind-merge";
|
|
2172
2214
|
import * as Select from "@radix-ui/react-select";
|
|
2173
2215
|
|
|
2174
2216
|
// src/icons/ChevronUpIcon.tsx
|
|
2175
|
-
import { jsx as
|
|
2217
|
+
import { jsx as jsx19 } from "react/jsx-runtime";
|
|
2176
2218
|
function ChevronUpIcon(props) {
|
|
2177
|
-
return /* @__PURE__ */
|
|
2219
|
+
return /* @__PURE__ */ jsx19(IconSVG, { viewBox: "0 0 20 20", ...props, children: /* @__PURE__ */ jsx19(
|
|
2178
2220
|
"path",
|
|
2179
2221
|
{
|
|
2180
2222
|
d: "M14.7071 12.7071C14.3166 13.0976 13.6834 13.0976 13.2929 12.7071L10 9.41421L6.70711 12.7071C6.31658 13.0976 5.68342 13.0976 5.29289 12.7071C4.90237 12.3166 4.90237 11.6834 5.29289 11.2929L9.29289 7.29289C9.68342 6.90237 10.3166 6.90237 10.7071 7.29289L14.7071 11.2929C15.0976 11.6834 15.0976 12.3166 14.7071 12.7071Z",
|
|
@@ -2185,9 +2227,9 @@ function ChevronUpIcon(props) {
|
|
|
2185
2227
|
}
|
|
2186
2228
|
|
|
2187
2229
|
// src/icons/ChevronDownIcon.tsx
|
|
2188
|
-
import { jsx as
|
|
2230
|
+
import { jsx as jsx20 } from "react/jsx-runtime";
|
|
2189
2231
|
function ChevronDownIcon(props) {
|
|
2190
|
-
return /* @__PURE__ */
|
|
2232
|
+
return /* @__PURE__ */ jsx20(IconSVG, { viewBox: "0 0 20 20", ...props, children: /* @__PURE__ */ jsx20(
|
|
2191
2233
|
"path",
|
|
2192
2234
|
{
|
|
2193
2235
|
d: "M5.29289 7.29289C5.68342 6.90237 6.31658 6.90237 6.70711 7.29289L10 10.5858L13.2929 7.29289C13.6834 6.90237 14.3166 6.90237 14.7071 7.29289C15.0976 7.68342 15.0976 8.31658 14.7071 8.70711L10.7071 12.7071C10.3166 13.0976 9.68342 13.0976 9.29289 12.7071L5.29289 8.70711C4.90237 8.31658 4.90237 7.68342 5.29289 7.29289Z",
|
|
@@ -2223,10 +2265,10 @@ function Slot({
|
|
|
2223
2265
|
|
|
2224
2266
|
// src/ui/Input.tsx
|
|
2225
2267
|
import { twMerge as twMerge9 } from "tailwind-merge";
|
|
2226
|
-
import { jsx as
|
|
2268
|
+
import { jsx as jsx21 } from "react/jsx-runtime";
|
|
2227
2269
|
function Input({ asChild, className, ...props }) {
|
|
2228
2270
|
const Child = asChild ? Slot : "input";
|
|
2229
|
-
return /* @__PURE__ */
|
|
2271
|
+
return /* @__PURE__ */ jsx21(
|
|
2230
2272
|
Child,
|
|
2231
2273
|
{
|
|
2232
2274
|
className: twMerge9(
|
|
@@ -2245,24 +2287,24 @@ import { twMerge as twMerge11 } from "tailwind-merge";
|
|
|
2245
2287
|
|
|
2246
2288
|
// src/onboarding/deposit/PreloadedImage.tsx
|
|
2247
2289
|
import { twMerge as twMerge10 } from "tailwind-merge";
|
|
2248
|
-
import { jsx as
|
|
2290
|
+
import { jsx as jsx22 } from "react/jsx-runtime";
|
|
2249
2291
|
function PreloadedImage({ url, fallback: fallback2, className }) {
|
|
2250
2292
|
const { isSuccess, isLoading } = usePreloadImage(url);
|
|
2251
|
-
return /* @__PURE__ */
|
|
2293
|
+
return /* @__PURE__ */ jsx22("span", { className: twMerge10("inline-flex w-full h-full items-center justify-center overflow-clip", className), children: !isLoading ? isSuccess ? /* @__PURE__ */ jsx22("img", { src: url, className: "w-full h-full object-cover" }) : fallback2 : null });
|
|
2252
2294
|
}
|
|
2253
2295
|
|
|
2254
2296
|
// src/onboarding/deposit/ChainIcon.tsx
|
|
2255
2297
|
import { forwardRef as forwardRef2 } from "react";
|
|
2256
|
-
import { jsx as
|
|
2298
|
+
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
2257
2299
|
var ChainIcon = forwardRef2(function ChainIcon2({ name, url, className }, forwardedRef) {
|
|
2258
|
-
return /* @__PURE__ */
|
|
2300
|
+
return /* @__PURE__ */ jsx23(
|
|
2259
2301
|
"span",
|
|
2260
2302
|
{
|
|
2261
2303
|
ref: forwardedRef,
|
|
2262
2304
|
className: twMerge11("flex-shrink-0 inline-flex w-6 aspect-square rounded-full overflow-clip", className),
|
|
2263
|
-
children: url ? /* @__PURE__ */
|
|
2305
|
+
children: url ? /* @__PURE__ */ jsx23(PreloadedImage, { url }) : (
|
|
2264
2306
|
// TODO: better placeholder
|
|
2265
|
-
/* @__PURE__ */
|
|
2307
|
+
/* @__PURE__ */ jsx23(
|
|
2266
2308
|
"span",
|
|
2267
2309
|
{
|
|
2268
2310
|
className: twMerge11(
|
|
@@ -2337,7 +2379,7 @@ function useChainBalances({ chains }) {
|
|
|
2337
2379
|
}
|
|
2338
2380
|
|
|
2339
2381
|
// src/onboarding/deposit/ChainSelect.tsx
|
|
2340
|
-
import { Fragment as
|
|
2382
|
+
import { Fragment as Fragment3, jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
2341
2383
|
function ChainSelect({ value, onChange }) {
|
|
2342
2384
|
const theme = useTheme();
|
|
2343
2385
|
const { frame } = useFrame();
|
|
@@ -2360,14 +2402,14 @@ function ChainSelect({ value, onChange }) {
|
|
|
2360
2402
|
const chainsWithBalance = chainsBalances.filter(({ balance }) => balance.value > 0n).map(({ chain, balance }) => ({ chain, balance: balance.value }));
|
|
2361
2403
|
return chainsWithBalance.length > 0 ? chainsWithBalance : sourceChains.map((chain) => ({ chain, balance: 0n }));
|
|
2362
2404
|
}, [chainsBalances, sourceChains]);
|
|
2363
|
-
|
|
2405
|
+
useEffect9(() => {
|
|
2364
2406
|
if (renderedChains.length > 0 && (!selectedChain || !renderedChains.find((c) => c.chain.id === selectedChain?.id))) {
|
|
2365
2407
|
const defaultChain = renderedChains[0].chain;
|
|
2366
2408
|
onChange(defaultChain.id);
|
|
2367
2409
|
switchChain({ chainId: defaultChain.id });
|
|
2368
2410
|
}
|
|
2369
2411
|
}, [value, selectedChain, renderedChains, onChange, switchChain]);
|
|
2370
|
-
return /* @__PURE__ */
|
|
2412
|
+
return /* @__PURE__ */ jsxs14(
|
|
2371
2413
|
Select.Root,
|
|
2372
2414
|
{
|
|
2373
2415
|
value: value.toString(),
|
|
@@ -2379,8 +2421,8 @@ function ChainSelect({ value, onChange }) {
|
|
|
2379
2421
|
}
|
|
2380
2422
|
},
|
|
2381
2423
|
children: [
|
|
2382
|
-
/* @__PURE__ */
|
|
2383
|
-
/* @__PURE__ */
|
|
2424
|
+
/* @__PURE__ */ jsx24(Input, { asChild: true, children: /* @__PURE__ */ jsxs14(Select.Trigger, { className: "group inline-flex items-center justify-center", children: [
|
|
2425
|
+
/* @__PURE__ */ jsx24(Select.Value, { asChild: true, children: /* @__PURE__ */ jsx24(
|
|
2384
2426
|
ChainIcon,
|
|
2385
2427
|
{
|
|
2386
2428
|
id: selectedChain?.id,
|
|
@@ -2389,25 +2431,25 @@ function ChainSelect({ value, onChange }) {
|
|
|
2389
2431
|
className: "w-8"
|
|
2390
2432
|
}
|
|
2391
2433
|
) }),
|
|
2392
|
-
/* @__PURE__ */
|
|
2393
|
-
/* @__PURE__ */
|
|
2394
|
-
/* @__PURE__ */
|
|
2434
|
+
/* @__PURE__ */ jsx24(Select.Icon, { asChild: true, children: /* @__PURE__ */ jsxs14(Fragment3, { children: [
|
|
2435
|
+
/* @__PURE__ */ jsx24(ChevronDownIcon, { className: "text-sm -mr-1 group-aria-expanded:hidden" }),
|
|
2436
|
+
/* @__PURE__ */ jsx24(ChevronUpIcon, { className: "text-sm -mr-1 hidden group-aria-expanded:inline" })
|
|
2395
2437
|
] }) })
|
|
2396
2438
|
] }) }),
|
|
2397
|
-
frame.contentDocument ? /* @__PURE__ */
|
|
2439
|
+
frame.contentDocument ? /* @__PURE__ */ jsx24(Select.Portal, { container: frame.contentDocument.body, children: /* @__PURE__ */ jsx24(
|
|
2398
2440
|
Select.Content,
|
|
2399
2441
|
{
|
|
2400
2442
|
position: "popper",
|
|
2401
2443
|
className: "w-[352px] max-h-[230px] overflow-y-auto mt-1 animate-in fade-in slide-in-from-top-2",
|
|
2402
|
-
children: /* @__PURE__ */
|
|
2444
|
+
children: /* @__PURE__ */ jsx24(Select.Viewport, { children: /* @__PURE__ */ jsx24(
|
|
2403
2445
|
Select.Group,
|
|
2404
2446
|
{
|
|
2405
2447
|
className: twMerge12(
|
|
2406
2448
|
"flex flex-col border divide-y",
|
|
2407
2449
|
"bg-neutral-800 text-neutral-300 border-neutral-700 divide-neutral-700"
|
|
2408
2450
|
),
|
|
2409
|
-
children: isLoading ? /* @__PURE__ */
|
|
2410
|
-
return /* @__PURE__ */
|
|
2451
|
+
children: isLoading ? /* @__PURE__ */ jsx24("div", { className: "flex items-center justify-center p-4", children: /* @__PURE__ */ jsx24(PendingIcon, { className: "h-6 w-6 animate-spin text-gray-400" }) }) : renderedChains.map(({ chain, balance }) => {
|
|
2452
|
+
return /* @__PURE__ */ jsxs14(
|
|
2411
2453
|
Select.Item,
|
|
2412
2454
|
{
|
|
2413
2455
|
value: chain.id.toString(),
|
|
@@ -2416,9 +2458,9 @@ function ChainSelect({ value, onChange }) {
|
|
|
2416
2458
|
"text-white focus:bg-neutral-700 data-[state=checked]:bg-neutral-900"
|
|
2417
2459
|
),
|
|
2418
2460
|
children: [
|
|
2419
|
-
/* @__PURE__ */
|
|
2420
|
-
/* @__PURE__ */
|
|
2421
|
-
/* @__PURE__ */
|
|
2461
|
+
/* @__PURE__ */ jsx24(ChainIcon, { id: chain.id, name: chain.name, url: chain.relayChain?.icon?.[theme] }),
|
|
2462
|
+
/* @__PURE__ */ jsx24("span", { className: "flex-grow flex-shrink-0", children: chain.name }),
|
|
2463
|
+
/* @__PURE__ */ jsx24("span", { className: "flex-shrink-0 font-mono text-sm text-neutral-400", children: /* @__PURE__ */ jsx24(Balance, { wei: balance }) })
|
|
2422
2464
|
]
|
|
2423
2465
|
},
|
|
2424
2466
|
chain.id
|
|
@@ -2434,13 +2476,13 @@ function ChainSelect({ value, onChange }) {
|
|
|
2434
2476
|
}
|
|
2435
2477
|
|
|
2436
2478
|
// src/onboarding/deposit/AmountInput.tsx
|
|
2437
|
-
import { formatEther as formatEther3, parseEther as
|
|
2479
|
+
import { formatEther as formatEther3, parseEther as parseEther3 } from "viem";
|
|
2438
2480
|
import { twMerge as twMerge13 } from "tailwind-merge";
|
|
2439
2481
|
import { forwardRef as forwardRef3 } from "react";
|
|
2440
|
-
import { jsx as
|
|
2482
|
+
import { jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
2441
2483
|
var AmountInput = forwardRef3(function AmountInput2({ initialAmount, onChange }, forwardedRef) {
|
|
2442
|
-
return /* @__PURE__ */
|
|
2443
|
-
/* @__PURE__ */
|
|
2484
|
+
return /* @__PURE__ */ jsx25(Input, { asChild: true, className: "w-full cursor-text flex items-center", children: /* @__PURE__ */ jsxs15("label", { children: [
|
|
2485
|
+
/* @__PURE__ */ jsx25(
|
|
2444
2486
|
"input",
|
|
2445
2487
|
{
|
|
2446
2488
|
ref: forwardedRef,
|
|
@@ -2461,19 +2503,19 @@ var AmountInput = forwardRef3(function AmountInput2({ initialAmount, onChange },
|
|
|
2461
2503
|
return input.setCustomValidity("Invalid amount.");
|
|
2462
2504
|
}
|
|
2463
2505
|
input.setCustomValidity("");
|
|
2464
|
-
onChange(
|
|
2506
|
+
onChange(parseEther3(value));
|
|
2465
2507
|
}
|
|
2466
2508
|
}
|
|
2467
2509
|
),
|
|
2468
|
-
/* @__PURE__ */
|
|
2510
|
+
/* @__PURE__ */ jsx25("span", { className: twMerge13("flex-shrink-0 text-2xl", "peer-placeholder-shown:text-neutral-500"), children: /* @__PURE__ */ jsx25(EthIcon, {}) })
|
|
2469
2511
|
] }) });
|
|
2470
2512
|
});
|
|
2471
2513
|
|
|
2472
2514
|
// src/onboarding/deposit/SubmitButton.tsx
|
|
2473
2515
|
import { useAccount as useAccount2, useBalance as useBalance3, useSwitchChain as useSwitchChain2 } from "wagmi";
|
|
2474
2516
|
import { twMerge as twMerge14 } from "tailwind-merge";
|
|
2475
|
-
import { parseEther as
|
|
2476
|
-
import { jsx as
|
|
2517
|
+
import { parseEther as parseEther4 } from "viem";
|
|
2518
|
+
import { jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2477
2519
|
var MAX_DEPOSIT_AMOUNT = "0.1";
|
|
2478
2520
|
function SubmitButton({ amount, chainId, className, ...buttonProps }) {
|
|
2479
2521
|
const { chainId: userChainId, address: userAddress } = useAccount2();
|
|
@@ -2481,7 +2523,7 @@ function SubmitButton({ amount, chainId, className, ...buttonProps }) {
|
|
|
2481
2523
|
const shouldSwitchChain = chainId != null && chainId !== userChainId;
|
|
2482
2524
|
const switchChain = useSwitchChain2();
|
|
2483
2525
|
if (shouldSwitchChain) {
|
|
2484
|
-
return /* @__PURE__ */
|
|
2526
|
+
return /* @__PURE__ */ jsx26(
|
|
2485
2527
|
Button,
|
|
2486
2528
|
{
|
|
2487
2529
|
type: "button",
|
|
@@ -2493,23 +2535,23 @@ function SubmitButton({ amount, chainId, className, ...buttonProps }) {
|
|
|
2493
2535
|
}
|
|
2494
2536
|
);
|
|
2495
2537
|
} else if (amount) {
|
|
2496
|
-
if (amount >
|
|
2497
|
-
return /* @__PURE__ */
|
|
2538
|
+
if (amount > parseEther4(MAX_DEPOSIT_AMOUNT)) {
|
|
2539
|
+
return /* @__PURE__ */ jsxs16(Button, { type: "button", className: twMerge14("w-full", className), disabled: true, children: [
|
|
2498
2540
|
"Max amount is ",
|
|
2499
2541
|
MAX_DEPOSIT_AMOUNT,
|
|
2500
2542
|
" ETH"
|
|
2501
2543
|
] });
|
|
2502
2544
|
} else if (amount > (userBalance?.value ?? 0n)) {
|
|
2503
|
-
return /* @__PURE__ */
|
|
2545
|
+
return /* @__PURE__ */ jsx26(Button, { type: "button", className: twMerge14("w-full", className), disabled: true, children: "Insufficient balance" });
|
|
2504
2546
|
}
|
|
2505
2547
|
}
|
|
2506
|
-
return /* @__PURE__ */
|
|
2548
|
+
return /* @__PURE__ */ jsx26(Button, { type: "submit", className: twMerge14("w-full", className), ...buttonProps });
|
|
2507
2549
|
}
|
|
2508
2550
|
|
|
2509
2551
|
// src/icons/WarningIcon.tsx
|
|
2510
|
-
import { jsx as
|
|
2552
|
+
import { jsx as jsx27 } from "react/jsx-runtime";
|
|
2511
2553
|
function WarningIcon(props) {
|
|
2512
|
-
return /* @__PURE__ */
|
|
2554
|
+
return /* @__PURE__ */ jsx27(IconSVG, { fill: "none", ...props, children: /* @__PURE__ */ jsx27(
|
|
2513
2555
|
"path",
|
|
2514
2556
|
{
|
|
2515
2557
|
d: "M12 9V11M12 15H12.01M5.07183 19H18.9282C20.4678 19 21.4301 17.3333 20.6603 16L13.7321 4C12.9623 2.66667 11.0378 2.66667 10.268 4L3.33978 16C2.56998 17.3333 3.53223 19 5.07183 19Z",
|
|
@@ -2530,7 +2572,7 @@ function formatGas(wei) {
|
|
|
2530
2572
|
}
|
|
2531
2573
|
|
|
2532
2574
|
// src/onboarding/deposit/DepositForm.tsx
|
|
2533
|
-
import { Fragment as
|
|
2575
|
+
import { Fragment as Fragment4, jsx as jsx28, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
2534
2576
|
function DepositForm({
|
|
2535
2577
|
sourceChain,
|
|
2536
2578
|
setSourceChainId,
|
|
@@ -2554,10 +2596,10 @@ function DepositForm({
|
|
|
2554
2596
|
});
|
|
2555
2597
|
const minimumBalance = amount != null ? amount + (estimatedFee?.fee ?? 0n) : void 0;
|
|
2556
2598
|
const hasMinimumBalance = balance.data != null ? balance.data.value > (minimumBalance ?? 0n) : void 0;
|
|
2557
|
-
|
|
2599
|
+
useEffect10(() => {
|
|
2558
2600
|
amountInputRef.current?.focus();
|
|
2559
2601
|
}, [userChainId]);
|
|
2560
|
-
return /* @__PURE__ */
|
|
2602
|
+
return /* @__PURE__ */ jsxs17(
|
|
2561
2603
|
"form",
|
|
2562
2604
|
{
|
|
2563
2605
|
className: "flex flex-col gap-5",
|
|
@@ -2578,11 +2620,11 @@ function DepositForm({
|
|
|
2578
2620
|
}
|
|
2579
2621
|
},
|
|
2580
2622
|
children: [
|
|
2581
|
-
/* @__PURE__ */
|
|
2582
|
-
/* @__PURE__ */
|
|
2583
|
-
/* @__PURE__ */
|
|
2623
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex gap-2", children: [
|
|
2624
|
+
/* @__PURE__ */ jsx28(ChainSelect, { value: sourceChain.id, onChange: setSourceChainId }),
|
|
2625
|
+
/* @__PURE__ */ jsx28(AmountInput, { ref: amountInputRef, initialAmount: amount, onChange: setAmount })
|
|
2584
2626
|
] }),
|
|
2585
|
-
/* @__PURE__ */
|
|
2627
|
+
/* @__PURE__ */ jsxs17(
|
|
2586
2628
|
"dl",
|
|
2587
2629
|
{
|
|
2588
2630
|
className: twMerge15(
|
|
@@ -2590,21 +2632,21 @@ function DepositForm({
|
|
|
2590
2632
|
"divide-neutral-700 text-neutral-400"
|
|
2591
2633
|
),
|
|
2592
2634
|
children: [
|
|
2593
|
-
/* @__PURE__ */
|
|
2594
|
-
/* @__PURE__ */
|
|
2595
|
-
/* @__PURE__ */
|
|
2596
|
-
/* @__PURE__ */
|
|
2597
|
-
/* @__PURE__ */
|
|
2598
|
-
/* @__PURE__ */
|
|
2635
|
+
/* @__PURE__ */ jsx28("dt", { children: "Available to deposit" }),
|
|
2636
|
+
/* @__PURE__ */ jsx28("dd", { children: balance.isSuccess ? /* @__PURE__ */ jsx28(Balance, { wei: balance.data.value }) : balance.isError ? /* @__PURE__ */ jsx28("span", { title: String(balance.error), children: /* @__PURE__ */ jsx28(WarningIcon, { className: "inline-block text-amber-500" }) }) : balance.isLoading ? /* @__PURE__ */ jsx28(PendingIcon, { className: "inline-block text-xs" }) : null }),
|
|
2637
|
+
/* @__PURE__ */ jsx28("dt", { children: "Gas balance after deposit" }),
|
|
2638
|
+
/* @__PURE__ */ jsx28("dd", { children: /* @__PURE__ */ jsx28(Balance, { wei: (quarryBalance.data ?? 0n) + (amount ?? 0n) }) }),
|
|
2639
|
+
/* @__PURE__ */ jsx28("dt", { children: "Estimated fee" }),
|
|
2640
|
+
/* @__PURE__ */ jsx28("dd", { children: estimatedFee.fee ? /* @__PURE__ */ jsxs17(Fragment4, { children: [
|
|
2599
2641
|
formatGas(estimatedFee.fee),
|
|
2600
2642
|
" gwei"
|
|
2601
|
-
] }) : estimatedFee.error ? /* @__PURE__ */
|
|
2602
|
-
/* @__PURE__ */
|
|
2603
|
-
/* @__PURE__ */
|
|
2643
|
+
] }) : estimatedFee.error ? /* @__PURE__ */ jsx28("span", { title: String(estimatedFee.error), children: /* @__PURE__ */ jsx28(WarningIcon, { className: "inline-block text-amber-500" }) }) : estimatedFee.isLoading ? /* @__PURE__ */ jsx28(PendingIcon, { className: "inline-block text-xs" }) : null }),
|
|
2644
|
+
/* @__PURE__ */ jsx28("dt", { children: "Time to deposit" }),
|
|
2645
|
+
/* @__PURE__ */ jsx28("dd", { children: estimatedTime })
|
|
2604
2646
|
]
|
|
2605
2647
|
}
|
|
2606
2648
|
),
|
|
2607
|
-
hasMinimumBalance ? submitButton : /* @__PURE__ */
|
|
2649
|
+
hasMinimumBalance ? submitButton : /* @__PURE__ */ jsx28(SubmitButton, { disabled: true, children: "Not enough funds" })
|
|
2608
2650
|
]
|
|
2609
2651
|
}
|
|
2610
2652
|
);
|
|
@@ -2658,7 +2700,7 @@ function useDeposits() {
|
|
|
2658
2700
|
}
|
|
2659
2701
|
|
|
2660
2702
|
// src/onboarding/deposit/DepositViaTransferForm.tsx
|
|
2661
|
-
import { jsx as
|
|
2703
|
+
import { jsx as jsx29 } from "react/jsx-runtime";
|
|
2662
2704
|
function DepositViaTransferForm({ amount, setAmount, sourceChain, setSourceChainId }) {
|
|
2663
2705
|
const { chain } = useEntryKitConfig();
|
|
2664
2706
|
const paymaster = getPaymaster(chain);
|
|
@@ -2687,7 +2729,7 @@ function DepositViaTransferForm({ amount, setAmount, sourceChain, setSourceChain
|
|
|
2687
2729
|
}),
|
|
2688
2730
|
value: amount
|
|
2689
2731
|
});
|
|
2690
|
-
const deposit =
|
|
2732
|
+
const deposit = useMutation3({
|
|
2691
2733
|
mutationKey: ["depositViaTransfer", amount?.toString()],
|
|
2692
2734
|
mutationFn: async () => {
|
|
2693
2735
|
if (!paymaster) throw new Error("Paymaster not found");
|
|
@@ -2726,7 +2768,7 @@ function DepositViaTransferForm({ amount, setAmount, sourceChain, setSourceChain
|
|
|
2726
2768
|
}
|
|
2727
2769
|
});
|
|
2728
2770
|
const estimatedFee = prepareData?.gas && gasPrice ? prepareData.gas * gasPrice : void 0;
|
|
2729
|
-
return /* @__PURE__ */
|
|
2771
|
+
return /* @__PURE__ */ jsx29(
|
|
2730
2772
|
DepositForm,
|
|
2731
2773
|
{
|
|
2732
2774
|
sourceChain,
|
|
@@ -2742,7 +2784,7 @@ function DepositViaTransferForm({ amount, setAmount, sourceChain, setSourceChain
|
|
|
2742
2784
|
onSubmit: async () => {
|
|
2743
2785
|
await deposit.mutateAsync();
|
|
2744
2786
|
},
|
|
2745
|
-
submitButton: /* @__PURE__ */
|
|
2787
|
+
submitButton: /* @__PURE__ */ jsx29(
|
|
2746
2788
|
SubmitButton,
|
|
2747
2789
|
{
|
|
2748
2790
|
variant: "primary",
|
|
@@ -2760,8 +2802,8 @@ function DepositViaTransferForm({ amount, setAmount, sourceChain, setSourceChain
|
|
|
2760
2802
|
// src/onboarding/deposit/DepositViaRelayForm.tsx
|
|
2761
2803
|
import { encodeFunctionData as encodeFunctionData3 } from "viem";
|
|
2762
2804
|
import { useAccount as useAccount5, useWalletClient } from "wagmi";
|
|
2763
|
-
import { useMutation as
|
|
2764
|
-
import { jsx as
|
|
2805
|
+
import { useMutation as useMutation4, useQuery as useQuery14 } from "@tanstack/react-query";
|
|
2806
|
+
import { jsx as jsx30 } from "react/jsx-runtime";
|
|
2765
2807
|
var ETH_ADDRESS = "0x0000000000000000000000000000000000000000";
|
|
2766
2808
|
function DepositViaRelayForm({ amount, setAmount, sourceChain, setSourceChainId }) {
|
|
2767
2809
|
const { chain, chainId: destinationChainId } = useEntryKitConfig();
|
|
@@ -2806,7 +2848,7 @@ function DepositViaRelayForm({ amount, setAmount, sourceChain, setSourceChainId
|
|
|
2806
2848
|
refetchInterval: 15e3,
|
|
2807
2849
|
enabled: !!amount && !!userAddress && !!relayClient
|
|
2808
2850
|
});
|
|
2809
|
-
const deposit =
|
|
2851
|
+
const deposit = useMutation4({
|
|
2810
2852
|
mutationKey: ["depositViaRelay", sourceChain.id, amount?.toString()],
|
|
2811
2853
|
mutationFn: async ({ quote: quote2, amount: amount2 }) => {
|
|
2812
2854
|
if (!relayClient) throw new Error("No Relay client found.");
|
|
@@ -2847,7 +2889,7 @@ function DepositViaRelayForm({ amount, setAmount, sourceChain, setSourceChainId
|
|
|
2847
2889
|
const gasFee = BigInt(fees?.gas?.amount ?? 0);
|
|
2848
2890
|
const relayerFee = BigInt(fees?.relayer?.amount ?? 0);
|
|
2849
2891
|
const fee = gasFee + relayerFee;
|
|
2850
|
-
return /* @__PURE__ */
|
|
2892
|
+
return /* @__PURE__ */ jsx30(
|
|
2851
2893
|
DepositForm,
|
|
2852
2894
|
{
|
|
2853
2895
|
sourceChain,
|
|
@@ -2864,7 +2906,7 @@ function DepositViaRelayForm({ amount, setAmount, sourceChain, setSourceChainId
|
|
|
2864
2906
|
if (!quote.data || !amount) return;
|
|
2865
2907
|
await deposit.mutateAsync({ quote: quote.data, amount });
|
|
2866
2908
|
},
|
|
2867
|
-
submitButton: /* @__PURE__ */
|
|
2909
|
+
submitButton: /* @__PURE__ */ jsx30(
|
|
2868
2910
|
SubmitButton,
|
|
2869
2911
|
{
|
|
2870
2912
|
variant: "primary",
|
|
@@ -2880,20 +2922,20 @@ function DepositViaRelayForm({ amount, setAmount, sourceChain, setSourceChainId
|
|
|
2880
2922
|
}
|
|
2881
2923
|
|
|
2882
2924
|
// src/onboarding/deposit/Deposits.tsx
|
|
2883
|
-
import { useEffect as
|
|
2884
|
-
import { useQuery as useQuery17, useQueryClient as
|
|
2925
|
+
import { useEffect as useEffect12 } from "react";
|
|
2926
|
+
import { useQuery as useQuery17, useQueryClient as useQueryClient7 } from "@tanstack/react-query";
|
|
2885
2927
|
|
|
2886
2928
|
// src/onboarding/deposit/TransferDepositStatus.tsx
|
|
2887
2929
|
import { useQuery as useQuery15 } from "@tanstack/react-query";
|
|
2888
2930
|
|
|
2889
2931
|
// src/onboarding/deposit/DepositStatus.tsx
|
|
2890
|
-
import { useEffect as
|
|
2932
|
+
import { useEffect as useEffect11, useState as useState3 } from "react";
|
|
2891
2933
|
import { twMerge as twMerge16 } from "tailwind-merge";
|
|
2892
2934
|
|
|
2893
2935
|
// src/icons/CloseIcon.tsx
|
|
2894
|
-
import { jsx as
|
|
2936
|
+
import { jsx as jsx31 } from "react/jsx-runtime";
|
|
2895
2937
|
function CloseIcon(props) {
|
|
2896
|
-
return /* @__PURE__ */
|
|
2938
|
+
return /* @__PURE__ */ jsx31(IconSVG, { strokeWidth: "2", stroke: "currentColor", ...props, children: /* @__PURE__ */ jsx31(
|
|
2897
2939
|
"path",
|
|
2898
2940
|
{
|
|
2899
2941
|
d: "M6 18L18 6M6 6L18 18",
|
|
@@ -2907,18 +2949,18 @@ function CloseIcon(props) {
|
|
|
2907
2949
|
}
|
|
2908
2950
|
|
|
2909
2951
|
// src/onboarding/deposit/DepositStatus.tsx
|
|
2910
|
-
import { jsx as
|
|
2952
|
+
import { jsx as jsx32, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
2911
2953
|
function DepositStatus({ status, progress, children, onDismiss }) {
|
|
2912
2954
|
const [appear, setAppear] = useState3(false);
|
|
2913
|
-
|
|
2955
|
+
useEffect11(() => {
|
|
2914
2956
|
setAppear(true);
|
|
2915
2957
|
}, []);
|
|
2916
|
-
return /* @__PURE__ */
|
|
2917
|
-
/* @__PURE__ */
|
|
2918
|
-
/* @__PURE__ */
|
|
2919
|
-
/* @__PURE__ */
|
|
2920
|
-
/* @__PURE__ */
|
|
2921
|
-
/* @__PURE__ */
|
|
2958
|
+
return /* @__PURE__ */ jsxs18("div", { className: "group bg-neutral-900 flex flex-col animate-in fade-in slide-in-from-bottom-2 animate-out fade-out", children: [
|
|
2959
|
+
/* @__PURE__ */ jsxs18("div", { className: "py-1 text-sm flex items-center gap-2", children: [
|
|
2960
|
+
/* @__PURE__ */ jsx32("div", { className: "flex-grow", children }),
|
|
2961
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex-shrink-0 grid", children: [
|
|
2962
|
+
/* @__PURE__ */ jsx32("span", { className: "col-start-1 row-start-1 transition opacity-100 group-hover:opacity-0 group-hover:pointer-events-none", children: status === "success" ? /* @__PURE__ */ jsx32(CheckIcon, { className: "text-green-600" }) : status === "error" ? /* @__PURE__ */ jsx32(WarningIcon, { className: "text-amber-500" }) : /* @__PURE__ */ jsx32(PendingIcon, { className: "text-neutral-500 transition" }) }),
|
|
2963
|
+
/* @__PURE__ */ jsx32(
|
|
2922
2964
|
"button",
|
|
2923
2965
|
{
|
|
2924
2966
|
type: "button",
|
|
@@ -2930,12 +2972,12 @@ function DepositStatus({ status, progress, children, onDismiss }) {
|
|
|
2930
2972
|
),
|
|
2931
2973
|
title: "Dismiss",
|
|
2932
2974
|
onClick: onDismiss,
|
|
2933
|
-
children: /* @__PURE__ */
|
|
2975
|
+
children: /* @__PURE__ */ jsx32(CloseIcon, {})
|
|
2934
2976
|
}
|
|
2935
2977
|
)
|
|
2936
2978
|
] })
|
|
2937
2979
|
] }),
|
|
2938
|
-
/* @__PURE__ */
|
|
2980
|
+
/* @__PURE__ */ jsx32("div", { className: "w-full h-[2px] -mt-full overflow-clip", children: /* @__PURE__ */ jsx32(
|
|
2939
2981
|
"div",
|
|
2940
2982
|
{
|
|
2941
2983
|
className: twMerge16(
|
|
@@ -2955,7 +2997,7 @@ function DepositStatus({ status, progress, children, onDismiss }) {
|
|
|
2955
2997
|
|
|
2956
2998
|
// src/onboarding/deposit/TransferDepositStatus.tsx
|
|
2957
2999
|
import { useChains as useChains2 } from "wagmi";
|
|
2958
|
-
import { Fragment as
|
|
3000
|
+
import { Fragment as Fragment5, jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
2959
3001
|
function TransferDepositStatus({
|
|
2960
3002
|
amount,
|
|
2961
3003
|
chainL1Id,
|
|
@@ -2971,7 +3013,7 @@ function TransferDepositStatus({
|
|
|
2971
3013
|
queryKey: ["transferDepositStatus", hash],
|
|
2972
3014
|
queryFn: () => receiptPromise
|
|
2973
3015
|
});
|
|
2974
|
-
return /* @__PURE__ */
|
|
3016
|
+
return /* @__PURE__ */ jsx33(
|
|
2975
3017
|
DepositStatus,
|
|
2976
3018
|
{
|
|
2977
3019
|
status: receipt.status,
|
|
@@ -2983,10 +3025,10 @@ function TransferDepositStatus({
|
|
|
2983
3025
|
children: (() => {
|
|
2984
3026
|
const blockExplorer = chain.blockExplorers?.default.url;
|
|
2985
3027
|
if (receipt.status === "pending") {
|
|
2986
|
-
return /* @__PURE__ */
|
|
3028
|
+
return /* @__PURE__ */ jsxs19(Fragment5, { children: [
|
|
2987
3029
|
"Confirming deposit on",
|
|
2988
3030
|
" ",
|
|
2989
|
-
/* @__PURE__ */
|
|
3031
|
+
/* @__PURE__ */ jsx33(
|
|
2990
3032
|
"a",
|
|
2991
3033
|
{
|
|
2992
3034
|
href: blockExplorer ? `${blockExplorer}/tx/${hash}` : void 0,
|
|
@@ -2999,10 +3041,10 @@ function TransferDepositStatus({
|
|
|
2999
3041
|
] });
|
|
3000
3042
|
}
|
|
3001
3043
|
if (receipt.status === "error") {
|
|
3002
|
-
return /* @__PURE__ */
|
|
3044
|
+
return /* @__PURE__ */ jsxs19(Fragment5, { children: [
|
|
3003
3045
|
"Could not find deposit on",
|
|
3004
3046
|
" ",
|
|
3005
|
-
/* @__PURE__ */
|
|
3047
|
+
/* @__PURE__ */ jsx33(
|
|
3006
3048
|
"a",
|
|
3007
3049
|
{
|
|
3008
3050
|
href: blockExplorer ? `${blockExplorer}/tx/${hash}` : void 0,
|
|
@@ -3014,10 +3056,10 @@ function TransferDepositStatus({
|
|
|
3014
3056
|
"."
|
|
3015
3057
|
] });
|
|
3016
3058
|
}
|
|
3017
|
-
return /* @__PURE__ */
|
|
3059
|
+
return /* @__PURE__ */ jsxs19(Fragment5, { children: [
|
|
3018
3060
|
"Successfully",
|
|
3019
3061
|
" ",
|
|
3020
|
-
/* @__PURE__ */
|
|
3062
|
+
/* @__PURE__ */ jsx33(
|
|
3021
3063
|
"a",
|
|
3022
3064
|
{
|
|
3023
3065
|
href: blockExplorer ? `${blockExplorer}/tx/${receipt.data.transactionHash}` : void 0,
|
|
@@ -3027,7 +3069,7 @@ function TransferDepositStatus({
|
|
|
3027
3069
|
}
|
|
3028
3070
|
),
|
|
3029
3071
|
" ",
|
|
3030
|
-
/* @__PURE__ */
|
|
3072
|
+
/* @__PURE__ */ jsx33(Balance, { wei: amount })
|
|
3031
3073
|
] });
|
|
3032
3074
|
})()
|
|
3033
3075
|
}
|
|
@@ -3037,7 +3079,7 @@ function TransferDepositStatus({
|
|
|
3037
3079
|
// src/onboarding/deposit/RelayDepositStatus.tsx
|
|
3038
3080
|
import { useQuery as useQuery16 } from "@tanstack/react-query";
|
|
3039
3081
|
import { useChains as useChains3 } from "wagmi";
|
|
3040
|
-
import { Fragment as
|
|
3082
|
+
import { Fragment as Fragment6, jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
3041
3083
|
function RelayDepositStatus({
|
|
3042
3084
|
amount,
|
|
3043
3085
|
chainL1Id,
|
|
@@ -3054,7 +3096,7 @@ function RelayDepositStatus({
|
|
|
3054
3096
|
queryKey: ["relayDepositPromise", chainL1Id, chainL2Id, amount.toString(), start.toISOString()],
|
|
3055
3097
|
queryFn: () => depositPromise
|
|
3056
3098
|
});
|
|
3057
|
-
return /* @__PURE__ */
|
|
3099
|
+
return /* @__PURE__ */ jsx34(
|
|
3058
3100
|
DepositStatus,
|
|
3059
3101
|
{
|
|
3060
3102
|
status: deposit.status,
|
|
@@ -3065,22 +3107,22 @@ function RelayDepositStatus({
|
|
|
3065
3107
|
onDismiss,
|
|
3066
3108
|
children: (() => {
|
|
3067
3109
|
if (deposit.status === "pending") {
|
|
3068
|
-
return /* @__PURE__ */
|
|
3110
|
+
return /* @__PURE__ */ jsxs20(Fragment6, { children: [
|
|
3069
3111
|
"Relay bridge deposit pending on ",
|
|
3070
3112
|
chainL1.name,
|
|
3071
3113
|
"\u2026"
|
|
3072
3114
|
] });
|
|
3073
3115
|
}
|
|
3074
3116
|
if (deposit.status === "error") {
|
|
3075
|
-
return /* @__PURE__ */
|
|
3117
|
+
return /* @__PURE__ */ jsxs20(Fragment6, { children: [
|
|
3076
3118
|
"Relay bridge deposit to ",
|
|
3077
3119
|
chainL2.name,
|
|
3078
3120
|
" failed."
|
|
3079
3121
|
] });
|
|
3080
3122
|
}
|
|
3081
|
-
return /* @__PURE__ */
|
|
3123
|
+
return /* @__PURE__ */ jsxs20(Fragment6, { children: [
|
|
3082
3124
|
"Successfully bridged ",
|
|
3083
|
-
/* @__PURE__ */
|
|
3125
|
+
/* @__PURE__ */ jsx34(Balance, { wei: amount }),
|
|
3084
3126
|
" to ",
|
|
3085
3127
|
chainL2.name,
|
|
3086
3128
|
"!"
|
|
@@ -3091,12 +3133,12 @@ function RelayDepositStatus({
|
|
|
3091
3133
|
}
|
|
3092
3134
|
|
|
3093
3135
|
// src/onboarding/deposit/Deposits.tsx
|
|
3094
|
-
import { useAccount as useAccount6, useClient as
|
|
3095
|
-
import { jsx as
|
|
3136
|
+
import { useAccount as useAccount6, useClient as useClient11 } from "wagmi";
|
|
3137
|
+
import { jsx as jsx35 } from "react/jsx-runtime";
|
|
3096
3138
|
function Deposits() {
|
|
3097
|
-
const queryClient =
|
|
3139
|
+
const queryClient = useQueryClient7();
|
|
3098
3140
|
const { chainId } = useEntryKitConfig();
|
|
3099
|
-
const client =
|
|
3141
|
+
const client = useClient11({ chainId });
|
|
3100
3142
|
const { address: userAddress } = useAccount6();
|
|
3101
3143
|
const { deposits, removeDeposit } = useDeposits();
|
|
3102
3144
|
const { data: isComplete } = useQuery17({
|
|
@@ -3107,24 +3149,24 @@ function Deposits() {
|
|
|
3107
3149
|
return true;
|
|
3108
3150
|
}
|
|
3109
3151
|
});
|
|
3110
|
-
|
|
3152
|
+
useEffect12(() => {
|
|
3111
3153
|
if (isComplete) {
|
|
3112
3154
|
queryClient.invalidateQueries({ queryKey: ["balance"] });
|
|
3113
3155
|
queryClient.invalidateQueries({ queryKey: ["getBalance", client?.uid, userAddress] });
|
|
3114
3156
|
}
|
|
3115
3157
|
}, [client?.uid, isComplete, queryClient, userAddress]);
|
|
3116
3158
|
if (!deposits.length) return null;
|
|
3117
|
-
return /* @__PURE__ */
|
|
3159
|
+
return /* @__PURE__ */ jsx35("div", { className: "flex flex-col gap-1 mt-4", children: deposits.map((deposit) => {
|
|
3118
3160
|
if (deposit.type === "transfer") {
|
|
3119
|
-
return /* @__PURE__ */
|
|
3161
|
+
return /* @__PURE__ */ jsx35(TransferDepositStatus, { ...deposit, onDismiss: () => removeDeposit(deposit.uid) }, deposit.uid);
|
|
3120
3162
|
} else if (deposit.type === "relay") {
|
|
3121
|
-
return /* @__PURE__ */
|
|
3163
|
+
return /* @__PURE__ */ jsx35(RelayDepositStatus, { ...deposit, onDismiss: () => removeDeposit(deposit.uid) }, deposit.uid);
|
|
3122
3164
|
}
|
|
3123
3165
|
}) });
|
|
3124
3166
|
}
|
|
3125
3167
|
|
|
3126
3168
|
// src/onboarding/deposit/DepositFormContainer.tsx
|
|
3127
|
-
import { jsx as
|
|
3169
|
+
import { jsx as jsx36, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
3128
3170
|
function DepositFormContainer() {
|
|
3129
3171
|
const { chainId: destinationChainId } = useEntryKitConfig();
|
|
3130
3172
|
const chainId = useChainId();
|
|
@@ -3132,8 +3174,8 @@ function DepositFormContainer() {
|
|
|
3132
3174
|
const [amount, setAmount] = useState4(void 0);
|
|
3133
3175
|
const [sourceChainId, setSourceChainId] = useState4(chainId);
|
|
3134
3176
|
const sourceChain = chains.find(({ id }) => id === sourceChainId);
|
|
3135
|
-
return /* @__PURE__ */
|
|
3136
|
-
destinationChainId === sourceChainId ? /* @__PURE__ */
|
|
3177
|
+
return /* @__PURE__ */ jsxs21("div", { className: "pt-10 pb-2", children: [
|
|
3178
|
+
destinationChainId === sourceChainId ? /* @__PURE__ */ jsx36(
|
|
3137
3179
|
DepositViaTransferForm,
|
|
3138
3180
|
{
|
|
3139
3181
|
amount,
|
|
@@ -3141,7 +3183,7 @@ function DepositFormContainer() {
|
|
|
3141
3183
|
sourceChain,
|
|
3142
3184
|
setSourceChainId
|
|
3143
3185
|
}
|
|
3144
|
-
) : /* @__PURE__ */
|
|
3186
|
+
) : /* @__PURE__ */ jsx36(
|
|
3145
3187
|
DepositViaRelayForm,
|
|
3146
3188
|
{
|
|
3147
3189
|
amount,
|
|
@@ -3150,14 +3192,14 @@ function DepositFormContainer() {
|
|
|
3150
3192
|
setSourceChainId
|
|
3151
3193
|
}
|
|
3152
3194
|
),
|
|
3153
|
-
/* @__PURE__ */
|
|
3195
|
+
/* @__PURE__ */ jsx36(Deposits, {})
|
|
3154
3196
|
] });
|
|
3155
3197
|
}
|
|
3156
3198
|
|
|
3157
3199
|
// src/icons/ArrowLeftIcon.tsx
|
|
3158
|
-
import { jsx as
|
|
3200
|
+
import { jsx as jsx37 } from "react/jsx-runtime";
|
|
3159
3201
|
function ArrowLeftIcon(props) {
|
|
3160
|
-
return /* @__PURE__ */
|
|
3202
|
+
return /* @__PURE__ */ jsx37(IconSVG, { ...props, children: /* @__PURE__ */ jsx37(
|
|
3161
3203
|
"path",
|
|
3162
3204
|
{
|
|
3163
3205
|
d: "M19 12H5M12 19l-7-7 7-7",
|
|
@@ -3171,24 +3213,24 @@ function ArrowLeftIcon(props) {
|
|
|
3171
3213
|
}
|
|
3172
3214
|
|
|
3173
3215
|
// src/onboarding/quarry/WithdrawGasBalanceButton.tsx
|
|
3174
|
-
import { getAction as
|
|
3216
|
+
import { getAction as getAction6 } from "viem/utils";
|
|
3175
3217
|
import { waitForTransactionReceipt as waitForTransactionReceipt3 } from "viem/actions";
|
|
3176
|
-
import { useAccount as useAccount7, useClient as
|
|
3218
|
+
import { useAccount as useAccount7, useClient as useClient12, useSwitchChain as useSwitchChain3, useWriteContract as useWriteContract2 } from "wagmi";
|
|
3177
3219
|
import { twMerge as twMerge17 } from "tailwind-merge";
|
|
3178
|
-
import { useMutation as
|
|
3179
|
-
import { useQueryClient as
|
|
3180
|
-
import { jsx as
|
|
3220
|
+
import { useMutation as useMutation5 } from "@tanstack/react-query";
|
|
3221
|
+
import { useQueryClient as useQueryClient8 } from "@tanstack/react-query";
|
|
3222
|
+
import { jsx as jsx38, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
3181
3223
|
function WithdrawGasBalanceButton({ userAddress }) {
|
|
3182
3224
|
const { writeContractAsync } = useWriteContract2();
|
|
3183
3225
|
const { switchChain } = useSwitchChain3();
|
|
3184
3226
|
const { chain, chainId } = useEntryKitConfig();
|
|
3185
3227
|
const { chainId: userChainId } = useAccount7();
|
|
3186
|
-
const queryClient =
|
|
3187
|
-
const client =
|
|
3228
|
+
const queryClient = useQueryClient8();
|
|
3229
|
+
const client = useClient12({ chainId });
|
|
3188
3230
|
const paymaster = getPaymaster(chain);
|
|
3189
3231
|
const balance = useShowQueryError(useBalance(userAddress));
|
|
3190
3232
|
const shouldSwitchChain = chainId != null && chainId !== userChainId;
|
|
3191
|
-
const withdraw =
|
|
3233
|
+
const withdraw = useMutation5({
|
|
3192
3234
|
mutationKey: ["withdraw", userAddress],
|
|
3193
3235
|
mutationFn: async () => {
|
|
3194
3236
|
if (!client) throw new Error("Client not ready.");
|
|
@@ -3202,7 +3244,7 @@ function WithdrawGasBalanceButton({ userAddress }) {
|
|
|
3202
3244
|
args: [userAddress, balance.data],
|
|
3203
3245
|
chainId
|
|
3204
3246
|
});
|
|
3205
|
-
await
|
|
3247
|
+
await getAction6(client, waitForTransactionReceipt3, "waitForTransactionReceipt")({ hash });
|
|
3206
3248
|
await Promise.all([
|
|
3207
3249
|
queryClient.invalidateQueries({ queryKey: ["balance"] }),
|
|
3208
3250
|
queryClient.invalidateQueries({ queryKey: ["getFunds"] }),
|
|
@@ -3217,7 +3259,7 @@ function WithdrawGasBalanceButton({ userAddress }) {
|
|
|
3217
3259
|
if (balance.data == null || balance.data === 0n) {
|
|
3218
3260
|
return null;
|
|
3219
3261
|
}
|
|
3220
|
-
return /* @__PURE__ */
|
|
3262
|
+
return /* @__PURE__ */ jsx38(
|
|
3221
3263
|
"button",
|
|
3222
3264
|
{
|
|
3223
3265
|
onClick: () => {
|
|
@@ -3231,8 +3273,8 @@ function WithdrawGasBalanceButton({ userAddress }) {
|
|
|
3231
3273
|
withdraw.isPending ? "opacity-50 pointer-events-none" : "cursor-pointer hover:text-white"
|
|
3232
3274
|
),
|
|
3233
3275
|
disabled: withdraw.isPending,
|
|
3234
|
-
children: /* @__PURE__ */
|
|
3235
|
-
/* @__PURE__ */
|
|
3276
|
+
children: /* @__PURE__ */ jsxs22("span", { className: "inline-block", children: [
|
|
3277
|
+
/* @__PURE__ */ jsxs22(
|
|
3236
3278
|
"span",
|
|
3237
3279
|
{
|
|
3238
3280
|
className: twMerge17(
|
|
@@ -3241,76 +3283,160 @@ function WithdrawGasBalanceButton({ userAddress }) {
|
|
|
3241
3283
|
shouldSwitchChain && "group-hover:hidden"
|
|
3242
3284
|
),
|
|
3243
3285
|
children: [
|
|
3244
|
-
withdraw.isPending && /* @__PURE__ */
|
|
3286
|
+
withdraw.isPending && /* @__PURE__ */ jsx38(PendingIcon, { className: "w-3 h-3" }),
|
|
3245
3287
|
"Withdraw"
|
|
3246
3288
|
]
|
|
3247
3289
|
}
|
|
3248
3290
|
),
|
|
3249
|
-
shouldSwitchChain && /* @__PURE__ */
|
|
3291
|
+
shouldSwitchChain && /* @__PURE__ */ jsx38("span", { className: "hidden group-hover:inline-block underline decoration-neutral-500 underline-offset-4 hover:decoration-orange-500", children: "Switch chain" })
|
|
3250
3292
|
] })
|
|
3251
3293
|
}
|
|
3252
3294
|
);
|
|
3253
3295
|
}
|
|
3254
3296
|
|
|
3297
|
+
// src/onboarding/quarry/useRequestAllowance.ts
|
|
3298
|
+
import { useMutation as useMutation6, useQueryClient as useQueryClient9 } from "@tanstack/react-query";
|
|
3299
|
+
|
|
3300
|
+
// src/quarry/transports/quarrySponsor.ts
|
|
3301
|
+
import { http as http2 } from "viem";
|
|
3302
|
+
function quarrySponsor() {
|
|
3303
|
+
return ({ chain }) => {
|
|
3304
|
+
if (!chain) throw new Error("No chain provided to quarrySponsor transport.");
|
|
3305
|
+
const url = "quarrySponsor" in chain.rpcUrls ? chain.rpcUrls.quarrySponsor.http[0] : void 0;
|
|
3306
|
+
if (!url) throw new Error(`No \`quarrySponsor\` RPC URL found for chain ${chain.id}.`);
|
|
3307
|
+
return http2(url)({ chain, retryCount: 0 });
|
|
3308
|
+
};
|
|
3309
|
+
}
|
|
3310
|
+
|
|
3311
|
+
// src/quarry/requestAllowance.ts
|
|
3312
|
+
async function requestAllowance({ chain, userAddress }) {
|
|
3313
|
+
const transport = quarrySponsor()({ chain });
|
|
3314
|
+
debug2("Requesting allowance for", userAddress);
|
|
3315
|
+
await transport.request({
|
|
3316
|
+
method: "sponsor_requestAllowance",
|
|
3317
|
+
params: [userAddress]
|
|
3318
|
+
});
|
|
3319
|
+
}
|
|
3320
|
+
|
|
3321
|
+
// src/onboarding/quarry/useRequestAllowance.ts
|
|
3322
|
+
function useRequestAllowance() {
|
|
3323
|
+
const queryClient = useQueryClient9();
|
|
3324
|
+
const { chain } = useEntryKitConfig();
|
|
3325
|
+
const mutationKey = ["requestAllowance", chain.id];
|
|
3326
|
+
return useMutation6({
|
|
3327
|
+
retry: 0,
|
|
3328
|
+
mutationKey,
|
|
3329
|
+
mutationFn: async (userAddress) => {
|
|
3330
|
+
await requestAllowance({ chain, userAddress });
|
|
3331
|
+
await Promise.all([
|
|
3332
|
+
queryClient.invalidateQueries({ queryKey: ["getAllowance"] }),
|
|
3333
|
+
queryClient.invalidateQueries({ queryKey: ["getFunds"] }),
|
|
3334
|
+
queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] })
|
|
3335
|
+
]);
|
|
3336
|
+
}
|
|
3337
|
+
});
|
|
3338
|
+
}
|
|
3339
|
+
|
|
3255
3340
|
// src/onboarding/quarry/GasBalance.tsx
|
|
3256
|
-
import { jsx as
|
|
3257
|
-
function GasBalance2({ isActive, isExpanded, isFocused, setFocused, userAddress }) {
|
|
3341
|
+
import { jsx as jsx39, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
3342
|
+
function GasBalance2({ isActive, isExpanded, isFocused, setFocused, userAddress, paymaster }) {
|
|
3258
3343
|
const queryClient = useQueryClient10();
|
|
3259
3344
|
const balance = useShowQueryError(useBalance(userAddress));
|
|
3260
3345
|
const prevBalance = usePrevious(balance.data || 0n);
|
|
3261
|
-
|
|
3346
|
+
const allowance = useShowQueryError(useAllowance(userAddress));
|
|
3347
|
+
const prevAllowance = usePrevious(allowance.data || 0n);
|
|
3348
|
+
const requestAllowance2 = useRequestAllowance();
|
|
3349
|
+
useEffect13(() => {
|
|
3262
3350
|
if (balance.data != null && prevBalance === 0n && balance.data > 0n) {
|
|
3263
3351
|
queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] });
|
|
3264
3352
|
setFocused(false);
|
|
3265
3353
|
}
|
|
3266
3354
|
}, [balance.data, prevBalance, setFocused, queryClient, userAddress]);
|
|
3355
|
+
useEffect13(() => {
|
|
3356
|
+
if (allowance.data != null && prevAllowance === 0n && allowance.data > 0n) {
|
|
3357
|
+
queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] });
|
|
3358
|
+
setFocused(false);
|
|
3359
|
+
}
|
|
3360
|
+
}, [allowance.data, prevAllowance, setFocused, queryClient, userAddress]);
|
|
3361
|
+
const gasBalance = balance.data != null && allowance.data != null ? balance.data + allowance.data : null;
|
|
3362
|
+
useEffect13(() => {
|
|
3363
|
+
if (!isActive) return;
|
|
3364
|
+
if (!paymaster.canSponsor) return;
|
|
3365
|
+
if (gasBalance !== 0n) return;
|
|
3366
|
+
if (requestAllowance2.status !== "idle") return;
|
|
3367
|
+
const timer = setTimeout(() => {
|
|
3368
|
+
console.log("no funds, requesting allowance");
|
|
3369
|
+
requestAllowance2.mutate(userAddress, {
|
|
3370
|
+
onSuccess(data) {
|
|
3371
|
+
console.log("got allowance", data);
|
|
3372
|
+
},
|
|
3373
|
+
onError(error2) {
|
|
3374
|
+
console.log("failed to get allowance", error2);
|
|
3375
|
+
}
|
|
3376
|
+
});
|
|
3377
|
+
});
|
|
3378
|
+
return () => clearTimeout(timer);
|
|
3379
|
+
}, [isActive, paymaster.canSponsor, gasBalance, requestAllowance2, userAddress]);
|
|
3267
3380
|
if (isFocused) {
|
|
3268
|
-
return /* @__PURE__ */
|
|
3269
|
-
isFocused && /* @__PURE__ */
|
|
3381
|
+
return /* @__PURE__ */ jsxs23("div", { children: [
|
|
3382
|
+
isFocused && /* @__PURE__ */ jsx39("div", { className: "absolute top-0 left-0", children: /* @__PURE__ */ jsx39(
|
|
3270
3383
|
"div",
|
|
3271
3384
|
{
|
|
3272
3385
|
className: "flex items-center justify-center w-10 h-10 text-white/20 hover:text-white/40 cursor-pointer",
|
|
3273
3386
|
onClick: () => setFocused(false),
|
|
3274
|
-
children: /* @__PURE__ */
|
|
3387
|
+
children: /* @__PURE__ */ jsx39(ArrowLeftIcon, { className: "m-0" })
|
|
3275
3388
|
}
|
|
3276
3389
|
) }),
|
|
3277
|
-
/* @__PURE__ */
|
|
3390
|
+
/* @__PURE__ */ jsx39(DepositFormContainer, {})
|
|
3278
3391
|
] });
|
|
3279
3392
|
}
|
|
3280
|
-
return /* @__PURE__ */
|
|
3281
|
-
/* @__PURE__ */
|
|
3282
|
-
/* @__PURE__ */
|
|
3283
|
-
/* @__PURE__ */
|
|
3284
|
-
/* @__PURE__ */
|
|
3393
|
+
return /* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-4", children: [
|
|
3394
|
+
/* @__PURE__ */ jsxs23("div", { className: "flex justify-between gap-4", children: [
|
|
3395
|
+
/* @__PURE__ */ jsxs23("div", { children: [
|
|
3396
|
+
/* @__PURE__ */ jsx39("div", { children: "Gas balance" }),
|
|
3397
|
+
/* @__PURE__ */ jsx39("div", { className: "font-mono text-white", children: gasBalance != null ? /* @__PURE__ */ jsx39(Balance, { wei: gasBalance }) : /* @__PURE__ */ jsx39(PendingIcon, { className: "text-sm" }) })
|
|
3285
3398
|
] }),
|
|
3286
|
-
/* @__PURE__ */
|
|
3287
|
-
/* @__PURE__ */
|
|
3399
|
+
/* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-1 justify-center items-center", children: [
|
|
3400
|
+
/* @__PURE__ */ jsx39(
|
|
3288
3401
|
Button,
|
|
3289
3402
|
{
|
|
3290
3403
|
variant: isActive ? "primary" : "tertiary",
|
|
3291
3404
|
className: "flex-shrink-0 text-sm p-1 w-28",
|
|
3292
3405
|
autoFocus: isActive || isExpanded,
|
|
3293
|
-
pending: balance.status === "pending",
|
|
3406
|
+
pending: balance.status === "pending" || allowance.status === "pending" || requestAllowance2.status === "pending",
|
|
3294
3407
|
onClick: () => setFocused(true),
|
|
3295
3408
|
children: "Top up"
|
|
3296
3409
|
}
|
|
3297
3410
|
),
|
|
3298
|
-
/* @__PURE__ */
|
|
3411
|
+
/* @__PURE__ */ jsx39(WithdrawGasBalanceButton, { userAddress })
|
|
3299
3412
|
] })
|
|
3300
3413
|
] }),
|
|
3301
|
-
isExpanded ? /* @__PURE__ */
|
|
3414
|
+
isExpanded ? /* @__PURE__ */ jsxs23("div", { className: "text-sm space-y-2", children: [
|
|
3415
|
+
/* @__PURE__ */ jsx39("p", { children: "Your gas balance is used to pay for onchain computation." }),
|
|
3416
|
+
/* @__PURE__ */ jsxs23("p", { children: [
|
|
3417
|
+
"You have",
|
|
3418
|
+
" ",
|
|
3419
|
+
/* @__PURE__ */ jsx39("span", { className: "font-mono", children: balance.data != null ? /* @__PURE__ */ jsx39(Balance, { wei: balance.data }) : /* @__PURE__ */ jsx39(PendingIcon, { className: "text-sm" }) }),
|
|
3420
|
+
" ",
|
|
3421
|
+
"in gas deposits and",
|
|
3422
|
+
" ",
|
|
3423
|
+
/* @__PURE__ */ jsx39("span", { className: "font-mono", children: allowance.data != null ? /* @__PURE__ */ jsx39(Balance, { wei: allowance.data }) : /* @__PURE__ */ jsx39(PendingIcon, { className: "text-sm" }) }),
|
|
3424
|
+
" ",
|
|
3425
|
+
"in gas grants."
|
|
3426
|
+
] })
|
|
3427
|
+
] }) : null
|
|
3302
3428
|
] });
|
|
3303
3429
|
}
|
|
3304
3430
|
|
|
3305
3431
|
// src/onboarding/ConnectedSteps.tsx
|
|
3306
|
-
import { jsx as
|
|
3307
|
-
function ConnectedSteps({ userClient, initialUserAddress }) {
|
|
3432
|
+
import { jsx as jsx40 } from "react/jsx-runtime";
|
|
3433
|
+
function ConnectedSteps({ connector, userClient, initialUserAddress }) {
|
|
3308
3434
|
const { chain } = useEntryKitConfig();
|
|
3309
3435
|
const paymaster = getPaymaster(chain);
|
|
3310
3436
|
const [focusedId, setFocusedId] = useState5(null);
|
|
3311
3437
|
const userAddress = userClient.account.address;
|
|
3312
3438
|
const { data: prerequisites, error: prerequisitesError } = usePrerequisites(userAddress);
|
|
3313
|
-
|
|
3439
|
+
useEffect14(() => {
|
|
3314
3440
|
if (prerequisitesError) {
|
|
3315
3441
|
console.error("Could not get prerequisites", prerequisitesError);
|
|
3316
3442
|
}
|
|
@@ -3318,7 +3444,7 @@ function ConnectedSteps({ userClient, initialUserAddress }) {
|
|
|
3318
3444
|
const { closeAccountModal } = useAccountModal();
|
|
3319
3445
|
const isNewConnection = userAddress !== initialUserAddress;
|
|
3320
3446
|
const initialPrerequisites = useRef5(prerequisites);
|
|
3321
|
-
|
|
3447
|
+
useEffect14(() => {
|
|
3322
3448
|
if (prerequisites == null) return;
|
|
3323
3449
|
if (initialPrerequisites.current == null) {
|
|
3324
3450
|
initialPrerequisites.current = prerequisites;
|
|
@@ -3344,7 +3470,7 @@ function ConnectedSteps({ userClient, initialUserAddress }) {
|
|
|
3344
3470
|
{
|
|
3345
3471
|
id: "wallet",
|
|
3346
3472
|
isComplete: true,
|
|
3347
|
-
content: (props) => /* @__PURE__ */
|
|
3473
|
+
content: (props) => /* @__PURE__ */ jsx40(Wallet, { ...props, userAddress })
|
|
3348
3474
|
}
|
|
3349
3475
|
];
|
|
3350
3476
|
if (!paymaster) {
|
|
@@ -3352,28 +3478,29 @@ function ConnectedSteps({ userClient, initialUserAddress }) {
|
|
|
3352
3478
|
steps2.push({
|
|
3353
3479
|
id: "gasBalance",
|
|
3354
3480
|
isComplete: !!hasGasBalance,
|
|
3355
|
-
content: (props) => /* @__PURE__ */
|
|
3481
|
+
content: (props) => /* @__PURE__ */ jsx40(GasBalance, { ...props, sessionAddress })
|
|
3356
3482
|
});
|
|
3357
3483
|
}
|
|
3358
3484
|
} else if (paymaster.type === "quarry") {
|
|
3359
|
-
|
|
3360
|
-
|
|
3361
|
-
|
|
3362
|
-
|
|
3363
|
-
|
|
3364
|
-
});
|
|
3365
|
-
} else {
|
|
3366
|
-
steps2.push({
|
|
3367
|
-
id: "gasBalanceQuarry",
|
|
3368
|
-
isComplete: !!hasQuarryGasBalance,
|
|
3369
|
-
content: (props) => /* @__PURE__ */ jsx41(GasBalance2, { ...props, userAddress })
|
|
3370
|
-
});
|
|
3371
|
-
}
|
|
3485
|
+
steps2.push({
|
|
3486
|
+
id: "gasBalanceQuarry",
|
|
3487
|
+
isComplete: !!hasQuarryGasBalance || !!hasAllowance,
|
|
3488
|
+
content: (props) => /* @__PURE__ */ jsx40(GasBalance2, { ...props, userAddress, paymaster })
|
|
3489
|
+
});
|
|
3372
3490
|
}
|
|
3373
3491
|
steps2.push({
|
|
3374
3492
|
id: "session",
|
|
3375
3493
|
isComplete: !!isSpender && !!hasDelegation,
|
|
3376
|
-
content: (props) => /* @__PURE__ */
|
|
3494
|
+
content: (props) => /* @__PURE__ */ jsx40(
|
|
3495
|
+
Session,
|
|
3496
|
+
{
|
|
3497
|
+
...props,
|
|
3498
|
+
userClient,
|
|
3499
|
+
connector,
|
|
3500
|
+
registerSpender: !isSpender,
|
|
3501
|
+
registerDelegation: !hasDelegation
|
|
3502
|
+
}
|
|
3503
|
+
)
|
|
3377
3504
|
});
|
|
3378
3505
|
return steps2;
|
|
3379
3506
|
}, [
|
|
@@ -3385,14 +3512,15 @@ function ConnectedSteps({ userClient, initialUserAddress }) {
|
|
|
3385
3512
|
paymaster,
|
|
3386
3513
|
sessionAddress,
|
|
3387
3514
|
userAddress,
|
|
3388
|
-
userClient
|
|
3515
|
+
userClient,
|
|
3516
|
+
connector
|
|
3389
3517
|
]);
|
|
3390
3518
|
const [selectedStepId] = useState5(null);
|
|
3391
3519
|
const nextStep = steps.find((step) => step.content != null && !step.isComplete);
|
|
3392
3520
|
const completedSteps = steps.filter((step) => step.isComplete);
|
|
3393
3521
|
const activeStep = (selectedStepId != null ? steps.find((step) => step.id === selectedStepId) : null) ?? nextStep ?? (completedSteps.length < steps.length ? completedSteps.at(-1) : null);
|
|
3394
3522
|
const activeStepIndex = activeStep ? steps.indexOf(activeStep) : -1;
|
|
3395
|
-
return /* @__PURE__ */
|
|
3523
|
+
return /* @__PURE__ */ jsx40(
|
|
3396
3524
|
"div",
|
|
3397
3525
|
{
|
|
3398
3526
|
className: twMerge18(
|
|
@@ -3417,7 +3545,7 @@ function ConnectedSteps({ userClient, initialUserAddress }) {
|
|
|
3417
3545
|
}
|
|
3418
3546
|
return null;
|
|
3419
3547
|
}
|
|
3420
|
-
return /* @__PURE__ */
|
|
3548
|
+
return /* @__PURE__ */ jsx40("div", { className: twMerge18("py-8 flex flex-col justify-center", isActive ? "flex-grow" : null), children: /* @__PURE__ */ jsx40("div", { className: twMerge18("flex flex-col", isDisabled ? "opacity-30 pointer-events-none" : null), children: content }) }, step.id);
|
|
3421
3549
|
})
|
|
3422
3550
|
}
|
|
3423
3551
|
);
|
|
@@ -3425,16 +3553,23 @@ function ConnectedSteps({ userClient, initialUserAddress }) {
|
|
|
3425
3553
|
|
|
3426
3554
|
// src/AccountModalContent.tsx
|
|
3427
3555
|
import { useRef as useRef6 } from "react";
|
|
3428
|
-
import { jsx as
|
|
3556
|
+
import { jsx as jsx41 } from "react/jsx-runtime";
|
|
3429
3557
|
function AccountModalContent() {
|
|
3430
3558
|
const { chainId } = useEntryKitConfig();
|
|
3431
|
-
const
|
|
3432
|
-
const {
|
|
3559
|
+
const { address: userAddress, connector } = useAccount8();
|
|
3560
|
+
const userClient = useConnectorClient({ chainId, connector });
|
|
3433
3561
|
const initialUserAddress = useRef6(userAddress);
|
|
3434
3562
|
if (userClient.status !== "success") {
|
|
3435
|
-
return /* @__PURE__ */
|
|
3563
|
+
return /* @__PURE__ */ jsx41(ConnectWallet, {});
|
|
3436
3564
|
}
|
|
3437
|
-
return /* @__PURE__ */
|
|
3565
|
+
return /* @__PURE__ */ jsx41(
|
|
3566
|
+
ConnectedSteps,
|
|
3567
|
+
{
|
|
3568
|
+
connector,
|
|
3569
|
+
userClient: userClient.data,
|
|
3570
|
+
initialUserAddress: initialUserAddress.current
|
|
3571
|
+
}
|
|
3572
|
+
);
|
|
3438
3573
|
}
|
|
3439
3574
|
|
|
3440
3575
|
// src/AccountModal.tsx
|
|
@@ -3443,17 +3578,17 @@ import { ErrorBoundary } from "react-error-boundary";
|
|
|
3443
3578
|
|
|
3444
3579
|
// src/errors/ErrorOverlay.tsx
|
|
3445
3580
|
import { wait } from "@latticexyz/common/utils";
|
|
3446
|
-
import { useEffect as
|
|
3581
|
+
import { useEffect as useEffect15 } from "react";
|
|
3447
3582
|
import { twMerge as twMerge19 } from "tailwind-merge";
|
|
3448
|
-
import { Fragment as
|
|
3583
|
+
import { Fragment as Fragment7, jsx as jsx42, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
3449
3584
|
function ErrorOverlay({ error: error2, retry, dismiss }) {
|
|
3450
|
-
|
|
3585
|
+
useEffect15(() => {
|
|
3451
3586
|
if (error2) {
|
|
3452
3587
|
console.error(error2);
|
|
3453
3588
|
}
|
|
3454
3589
|
}, [error2]);
|
|
3455
|
-
return /* @__PURE__ */
|
|
3456
|
-
/* @__PURE__ */
|
|
3590
|
+
return /* @__PURE__ */ jsxs24("div", { className: "pointer-events-none absolute inset-0 overflow-clip", children: [
|
|
3591
|
+
/* @__PURE__ */ jsx42(
|
|
3457
3592
|
"div",
|
|
3458
3593
|
{
|
|
3459
3594
|
className: twMerge19(
|
|
@@ -3463,7 +3598,7 @@ function ErrorOverlay({ error: error2, retry, dismiss }) {
|
|
|
3463
3598
|
)
|
|
3464
3599
|
}
|
|
3465
3600
|
),
|
|
3466
|
-
/* @__PURE__ */
|
|
3601
|
+
/* @__PURE__ */ jsx42(
|
|
3467
3602
|
"div",
|
|
3468
3603
|
{
|
|
3469
3604
|
className: twMerge19(
|
|
@@ -3471,15 +3606,15 @@ function ErrorOverlay({ error: error2, retry, dismiss }) {
|
|
|
3471
3606
|
"transition duration-300",
|
|
3472
3607
|
error2 ? "translate-y-0 opacity-100 pointer-events-auto" : "-translate-y-4 opacity-0"
|
|
3473
3608
|
),
|
|
3474
|
-
children: error2 ? /* @__PURE__ */
|
|
3475
|
-
/* @__PURE__ */
|
|
3476
|
-
/* @__PURE__ */
|
|
3477
|
-
/* @__PURE__ */
|
|
3478
|
-
/* @__PURE__ */
|
|
3609
|
+
children: error2 ? /* @__PURE__ */ jsx42(Fragment7, { children: /* @__PURE__ */ jsxs24("div", { className: "w-full max-h-full bg-blue-700 text-white/80 overflow-auto", children: [
|
|
3610
|
+
/* @__PURE__ */ jsxs24("div", { className: "space-y-6 px-8 pt-8", children: [
|
|
3611
|
+
/* @__PURE__ */ jsx42("div", { className: "text-white text-lg font-bold", children: "Oops! It broke :(" }),
|
|
3612
|
+
/* @__PURE__ */ jsx42("div", { className: "font-mono text-xs whitespace-pre-wrap", children: error2.message.trim() }),
|
|
3613
|
+
/* @__PURE__ */ jsx42("div", { className: "text-sm", children: "See the console for more info." })
|
|
3479
3614
|
] }),
|
|
3480
|
-
/* @__PURE__ */
|
|
3481
|
-
/* @__PURE__ */
|
|
3482
|
-
retry ? /* @__PURE__ */
|
|
3615
|
+
/* @__PURE__ */ jsxs24("div", { className: "pointer-events-none sticky bottom-0 left-0 -mt-2", children: [
|
|
3616
|
+
/* @__PURE__ */ jsx42("div", { className: "w-full h-12 bg-gradient-to-b from-transparent to-blue-700" }),
|
|
3617
|
+
retry ? /* @__PURE__ */ jsx42("div", { className: "bg-blue-700 text-center", children: /* @__PURE__ */ jsxs24(
|
|
3483
3618
|
"button",
|
|
3484
3619
|
{
|
|
3485
3620
|
type: "button",
|
|
@@ -3498,11 +3633,11 @@ function ErrorOverlay({ error: error2, retry, dismiss }) {
|
|
|
3498
3633
|
}
|
|
3499
3634
|
},
|
|
3500
3635
|
children: [
|
|
3501
|
-
/* @__PURE__ */
|
|
3502
|
-
/* @__PURE__ */
|
|
3636
|
+
/* @__PURE__ */ jsx42("span", { className: "group-aria-busy:hidden", children: "Retry" }),
|
|
3637
|
+
/* @__PURE__ */ jsx42("span", { className: "hidden group-aria-busy:inline", children: "Retrying\u2026" })
|
|
3503
3638
|
]
|
|
3504
3639
|
}
|
|
3505
|
-
) }) : dismiss ? /* @__PURE__ */
|
|
3640
|
+
) }) : dismiss ? /* @__PURE__ */ jsx42("div", { className: "bg-blue-700 text-center", children: /* @__PURE__ */ jsx42(
|
|
3506
3641
|
"button",
|
|
3507
3642
|
{
|
|
3508
3643
|
type: "button",
|
|
@@ -3524,24 +3659,24 @@ function ErrorOverlay({ error: error2, retry, dismiss }) {
|
|
|
3524
3659
|
}
|
|
3525
3660
|
|
|
3526
3661
|
// src/errors/ErrorFallback.tsx
|
|
3527
|
-
import { jsx as
|
|
3662
|
+
import { jsx as jsx43 } from "react/jsx-runtime";
|
|
3528
3663
|
function ErrorFallback({ error: error2, resetErrorBoundary }) {
|
|
3529
|
-
return /* @__PURE__ */
|
|
3664
|
+
return /* @__PURE__ */ jsx43("div", { className: "h-64", children: /* @__PURE__ */ jsx43(ErrorOverlay, { error: error2, retry: resetErrorBoundary }) });
|
|
3530
3665
|
}
|
|
3531
3666
|
|
|
3532
3667
|
// src/errors/ErrorsOverlay.tsx
|
|
3533
3668
|
import { useStore as useStore3 } from "zustand";
|
|
3534
|
-
import { jsx as
|
|
3669
|
+
import { jsx as jsx44 } from "react/jsx-runtime";
|
|
3535
3670
|
function ErrorsOverlay() {
|
|
3536
3671
|
const error2 = useStore3(store3, (state) => state.errors.at(0));
|
|
3537
|
-
return /* @__PURE__ */
|
|
3672
|
+
return /* @__PURE__ */ jsx44(ErrorOverlay, { error: error2?.error, retry: error2?.retry, dismiss: error2?.dismiss });
|
|
3538
3673
|
}
|
|
3539
3674
|
|
|
3540
3675
|
// src/AccountModal.tsx
|
|
3541
|
-
import { jsx as
|
|
3676
|
+
import { jsx as jsx45, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
3542
3677
|
function AccountModal() {
|
|
3543
3678
|
const { accountModalOpen, toggleAccountModal } = useAccountModal();
|
|
3544
|
-
return /* @__PURE__ */
|
|
3679
|
+
return /* @__PURE__ */ jsx45(Modal, { open: accountModalOpen, onOpenChange: toggleAccountModal, children: accountModalOpen ? /* @__PURE__ */ jsxs25(
|
|
3545
3680
|
"div",
|
|
3546
3681
|
{
|
|
3547
3682
|
className: twMerge20(
|
|
@@ -3552,11 +3687,11 @@ function AccountModal() {
|
|
|
3552
3687
|
"links:decoration-neutral-500 hover:links:decoration-orange-500"
|
|
3553
3688
|
),
|
|
3554
3689
|
children: [
|
|
3555
|
-
/* @__PURE__ */
|
|
3556
|
-
/* @__PURE__ */
|
|
3557
|
-
/* @__PURE__ */
|
|
3690
|
+
/* @__PURE__ */ jsxs25(ErrorBoundary, { FallbackComponent: ErrorFallback, children: [
|
|
3691
|
+
/* @__PURE__ */ jsx45(AccountModalContent, {}),
|
|
3692
|
+
/* @__PURE__ */ jsx45(ErrorsOverlay, {})
|
|
3558
3693
|
] }),
|
|
3559
|
-
/* @__PURE__ */
|
|
3694
|
+
/* @__PURE__ */ jsxs25(
|
|
3560
3695
|
"a",
|
|
3561
3696
|
{
|
|
3562
3697
|
href: "https://mud.dev",
|
|
@@ -3564,12 +3699,12 @@ function AccountModal() {
|
|
|
3564
3699
|
rel: "noreferrer noopener",
|
|
3565
3700
|
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",
|
|
3566
3701
|
children: [
|
|
3567
|
-
/* @__PURE__ */
|
|
3568
|
-
/* @__PURE__ */
|
|
3702
|
+
/* @__PURE__ */ jsx45("span", { className: "block w-4 h-4", children: /* @__PURE__ */ jsx45(Logo, { className: "w-full h-full text-orange-500 group-hover:rotate-90 transition duration-300" }) }),
|
|
3703
|
+
/* @__PURE__ */ jsx45("span", { children: "Powered by MUD" })
|
|
3569
3704
|
]
|
|
3570
3705
|
}
|
|
3571
3706
|
),
|
|
3572
|
-
/* @__PURE__ */
|
|
3707
|
+
/* @__PURE__ */ jsx45("div", { className: "absolute top-0 right-0", children: /* @__PURE__ */ jsx45(
|
|
3573
3708
|
DialogClose,
|
|
3574
3709
|
{
|
|
3575
3710
|
className: twMerge20(
|
|
@@ -3577,7 +3712,7 @@ function AccountModal() {
|
|
|
3577
3712
|
"text-white/20 hover:text-white/40"
|
|
3578
3713
|
),
|
|
3579
3714
|
title: "Close",
|
|
3580
|
-
children: /* @__PURE__ */
|
|
3715
|
+
children: /* @__PURE__ */ jsx45(CloseIcon, { className: "m-0" })
|
|
3581
3716
|
}
|
|
3582
3717
|
) })
|
|
3583
3718
|
]
|
|
@@ -3586,11 +3721,11 @@ function AccountModal() {
|
|
|
3586
3721
|
}
|
|
3587
3722
|
|
|
3588
3723
|
// src/EntryKitProvider.tsx
|
|
3589
|
-
import { jsx as
|
|
3724
|
+
import { jsx as jsx46, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3590
3725
|
function EntryKitProvider({ config, children }) {
|
|
3591
|
-
return /* @__PURE__ */
|
|
3726
|
+
return /* @__PURE__ */ jsxs26(EntryKitConfigProvider, { config, children: [
|
|
3592
3727
|
children,
|
|
3593
|
-
/* @__PURE__ */
|
|
3728
|
+
/* @__PURE__ */ jsx46(AccountModal, {})
|
|
3594
3729
|
] });
|
|
3595
3730
|
}
|
|
3596
3731
|
|
|
@@ -3600,13 +3735,13 @@ import { twMerge as twMerge22 } from "tailwind-merge";
|
|
|
3600
3735
|
|
|
3601
3736
|
// src/AccountName.tsx
|
|
3602
3737
|
import { twMerge as twMerge21 } from "tailwind-merge";
|
|
3603
|
-
import { Fragment as
|
|
3738
|
+
import { Fragment as Fragment8, jsx as jsx47, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3604
3739
|
function AccountName({ address }) {
|
|
3605
3740
|
const { data: ens } = useENS(address);
|
|
3606
3741
|
const avatar = usePreloadImage(ens?.avatar);
|
|
3607
|
-
return /* @__PURE__ */
|
|
3608
|
-
/* @__PURE__ */
|
|
3609
|
-
/* @__PURE__ */
|
|
3742
|
+
return /* @__PURE__ */ jsxs27(Fragment8, { children: [
|
|
3743
|
+
/* @__PURE__ */ jsxs27("span", { className: "flex-shrink-0 w-6 h-6 -my-1 -mx-0.5 grid place-items-center", children: [
|
|
3744
|
+
/* @__PURE__ */ jsx47(
|
|
3610
3745
|
"img",
|
|
3611
3746
|
{
|
|
3612
3747
|
src: ens?.avatar && avatar.isSuccess ? ens.avatar : void 0,
|
|
@@ -3618,7 +3753,7 @@ function AccountName({ address }) {
|
|
|
3618
3753
|
)
|
|
3619
3754
|
}
|
|
3620
3755
|
),
|
|
3621
|
-
/* @__PURE__ */
|
|
3756
|
+
/* @__PURE__ */ jsx47(
|
|
3622
3757
|
Logo,
|
|
3623
3758
|
{
|
|
3624
3759
|
className: twMerge21(
|
|
@@ -3629,13 +3764,13 @@ function AccountName({ address }) {
|
|
|
3629
3764
|
}
|
|
3630
3765
|
)
|
|
3631
3766
|
] }),
|
|
3632
|
-
/* @__PURE__ */
|
|
3767
|
+
/* @__PURE__ */ jsx47("span", { className: "flex-grow", children: ens?.name ?? /* @__PURE__ */ jsx47(TruncatedHex, { hex: address }) })
|
|
3633
3768
|
] });
|
|
3634
3769
|
}
|
|
3635
3770
|
|
|
3636
3771
|
// src/AccountButton.tsx
|
|
3637
3772
|
import { useRef as useRef7 } from "react";
|
|
3638
|
-
import { jsx as
|
|
3773
|
+
import { jsx as jsx48, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
3639
3774
|
var containerClassNames = twMerge22(
|
|
3640
3775
|
"w-48 p-3 inline-flex outline-none transition",
|
|
3641
3776
|
"border border-transparent",
|
|
@@ -3648,7 +3783,7 @@ var secondaryClassNames = twMerge22(
|
|
|
3648
3783
|
var secondaryInteractiveClassNames = twMerge22(
|
|
3649
3784
|
"cursor-pointer outline-none hover:bg-neutral-200 data-[highlighted]:bg-neutral-200 dark:hover:bg-neutral-700"
|
|
3650
3785
|
);
|
|
3651
|
-
function
|
|
3786
|
+
function AccountButton2() {
|
|
3652
3787
|
const { openAccountModal, accountModalOpen } = useAccountModal();
|
|
3653
3788
|
const { status, address: userAddress } = useAccount9();
|
|
3654
3789
|
const initialUserAddress = useRef7(userAddress);
|
|
@@ -3663,16 +3798,16 @@ function AccountButton() {
|
|
|
3663
3798
|
}
|
|
3664
3799
|
return "Sign in";
|
|
3665
3800
|
})();
|
|
3666
|
-
return /* @__PURE__ */
|
|
3801
|
+
return /* @__PURE__ */ jsx48(Shadow, { mode: "child", children: isSignedIn ? /* @__PURE__ */ jsx48(
|
|
3667
3802
|
"button",
|
|
3668
3803
|
{
|
|
3669
3804
|
type: "button",
|
|
3670
3805
|
className: twMerge22(containerClassNames, secondaryClassNames, secondaryInteractiveClassNames),
|
|
3671
3806
|
onClick: openAccountModal,
|
|
3672
|
-
children: /* @__PURE__ */
|
|
3807
|
+
children: /* @__PURE__ */ jsx48("span", { className: "flex-grow inline-flex gap-2.5 items-center text-left font-medium", children: userAddress ? /* @__PURE__ */ jsx48(AccountName, { address: userAddress }) : null })
|
|
3673
3808
|
},
|
|
3674
3809
|
"connected"
|
|
3675
|
-
) : /* @__PURE__ */
|
|
3810
|
+
) : /* @__PURE__ */ jsxs28(
|
|
3676
3811
|
"button",
|
|
3677
3812
|
{
|
|
3678
3813
|
type: "button",
|
|
@@ -3687,8 +3822,8 @@ function AccountButton() {
|
|
|
3687
3822
|
"aria-busy": accountModalOpen || prereqs.isPending,
|
|
3688
3823
|
onClick: openAccountModal,
|
|
3689
3824
|
children: [
|
|
3690
|
-
/* @__PURE__ */
|
|
3691
|
-
/* @__PURE__ */
|
|
3825
|
+
/* @__PURE__ */ jsxs28("span", { className: "pointer-events-none inline-grid place-items-center -ml-3", children: [
|
|
3826
|
+
/* @__PURE__ */ jsx48(
|
|
3692
3827
|
"span",
|
|
3693
3828
|
{
|
|
3694
3829
|
className: twMerge22(
|
|
@@ -3696,10 +3831,10 @@ function AccountButton() {
|
|
|
3696
3831
|
"scale-100 opacity-100 transition duration-300",
|
|
3697
3832
|
"group-aria-busy:scale-125 group-aria-busy:opacity-0"
|
|
3698
3833
|
),
|
|
3699
|
-
children: /* @__PURE__ */
|
|
3834
|
+
children: /* @__PURE__ */ jsx48(Logo, {})
|
|
3700
3835
|
}
|
|
3701
3836
|
),
|
|
3702
|
-
/* @__PURE__ */
|
|
3837
|
+
/* @__PURE__ */ jsx48(
|
|
3703
3838
|
"span",
|
|
3704
3839
|
{
|
|
3705
3840
|
"aria-hidden": true,
|
|
@@ -3708,11 +3843,11 @@ function AccountButton() {
|
|
|
3708
3843
|
"scale-50 opacity-0 transition duration-300 delay-50",
|
|
3709
3844
|
"group-aria-busy:scale-100 group-aria-busy:opacity-100"
|
|
3710
3845
|
),
|
|
3711
|
-
children: /* @__PURE__ */
|
|
3846
|
+
children: /* @__PURE__ */ jsx48(PendingIcon, {})
|
|
3712
3847
|
}
|
|
3713
3848
|
)
|
|
3714
3849
|
] }),
|
|
3715
|
-
/* @__PURE__ */
|
|
3850
|
+
/* @__PURE__ */ jsx48("span", { className: "font-medium", children: buttonLabel })
|
|
3716
3851
|
]
|
|
3717
3852
|
},
|
|
3718
3853
|
"sign in"
|
|
@@ -3737,6 +3872,8 @@ function useSessionClientReady() {
|
|
|
3737
3872
|
// src/createWagmiConfig.ts
|
|
3738
3873
|
import { createConfig } from "wagmi";
|
|
3739
3874
|
import { getDefaultConfig } from "connectkit";
|
|
3875
|
+
|
|
3876
|
+
// src/getDefaultConnectors.ts
|
|
3740
3877
|
import { injected, coinbaseWallet, safe } from "wagmi/connectors";
|
|
3741
3878
|
|
|
3742
3879
|
// src/connectors/walletConnect.ts
|
|
@@ -3745,7 +3882,7 @@ import {
|
|
|
3745
3882
|
SwitchChainError,
|
|
3746
3883
|
UserRejectedRequestError,
|
|
3747
3884
|
getAddress,
|
|
3748
|
-
numberToHex as
|
|
3885
|
+
numberToHex as numberToHex2
|
|
3749
3886
|
} from "viem";
|
|
3750
3887
|
walletConnect.type = "walletConnect";
|
|
3751
3888
|
function walletConnect(parameters) {
|
|
@@ -3942,7 +4079,7 @@ function walletConnect(parameters) {
|
|
|
3942
4079
|
}),
|
|
3943
4080
|
provider.request({
|
|
3944
4081
|
method: "wallet_switchEthereumChain",
|
|
3945
|
-
params: [{ chainId:
|
|
4082
|
+
params: [{ chainId: numberToHex2(chainId) }]
|
|
3946
4083
|
})
|
|
3947
4084
|
]);
|
|
3948
4085
|
const requestedChains = await this.getRequestedChainsIds();
|
|
@@ -3961,7 +4098,7 @@ function walletConnect(parameters) {
|
|
|
3961
4098
|
else rpcUrls = [...chain.rpcUrls.default.http];
|
|
3962
4099
|
const addEthereumChain = {
|
|
3963
4100
|
blockExplorerUrls,
|
|
3964
|
-
chainId:
|
|
4101
|
+
chainId: numberToHex2(chainId),
|
|
3965
4102
|
chainName: addEthereumChainParameter?.chainName ?? chain.name,
|
|
3966
4103
|
iconUrls: addEthereumChainParameter?.iconUrls,
|
|
3967
4104
|
nativeCurrency: addEthereumChainParameter?.nativeCurrency ?? chain.nativeCurrency,
|
|
@@ -4072,8 +4209,8 @@ function extractRpcUrls(parameters) {
|
|
|
4072
4209
|
return transports.map(({ value }) => value?.url || fallbackUrl);
|
|
4073
4210
|
}
|
|
4074
4211
|
|
|
4075
|
-
// src/
|
|
4076
|
-
function
|
|
4212
|
+
// src/getDefaultConnectors.ts
|
|
4213
|
+
function getDefaultConnectors(config) {
|
|
4077
4214
|
const connectors = [];
|
|
4078
4215
|
const shouldUseSafeConnector = !(typeof window === "undefined") && window?.parent !== window;
|
|
4079
4216
|
if (shouldUseSafeConnector) {
|
|
@@ -4098,6 +4235,12 @@ function createWagmiConfig(config) {
|
|
|
4098
4235
|
})
|
|
4099
4236
|
);
|
|
4100
4237
|
}
|
|
4238
|
+
return connectors;
|
|
4239
|
+
}
|
|
4240
|
+
|
|
4241
|
+
// src/createWagmiConfig.ts
|
|
4242
|
+
function createWagmiConfig(config) {
|
|
4243
|
+
const connectors = config.connectors ?? getDefaultConnectors(config);
|
|
4101
4244
|
const configParams = getDefaultConfig({
|
|
4102
4245
|
chains: config.chains,
|
|
4103
4246
|
transports: config.transports,
|
|
@@ -4130,7 +4273,7 @@ function withFeeCache(chain, options = { refreshInterval: 1e4 }) {
|
|
|
4130
4273
|
}
|
|
4131
4274
|
|
|
4132
4275
|
// src/validateSigner.ts
|
|
4133
|
-
import { readContract } from "viem/actions";
|
|
4276
|
+
import { readContract as readContract2 } from "viem/actions";
|
|
4134
4277
|
async function internal_validateSigner({
|
|
4135
4278
|
client,
|
|
4136
4279
|
worldAddress,
|
|
@@ -4138,7 +4281,7 @@ async function internal_validateSigner({
|
|
|
4138
4281
|
sessionAddress,
|
|
4139
4282
|
signerAddress
|
|
4140
4283
|
}) {
|
|
4141
|
-
const ownerAddress = await
|
|
4284
|
+
const ownerAddress = await readContract2(client, {
|
|
4142
4285
|
address: sessionAddress,
|
|
4143
4286
|
abi: simpleAccountAbi,
|
|
4144
4287
|
functionName: "owner"
|
|
@@ -4173,10 +4316,14 @@ var simpleAccountAbi = [
|
|
|
4173
4316
|
}
|
|
4174
4317
|
];
|
|
4175
4318
|
export {
|
|
4176
|
-
AccountButton,
|
|
4319
|
+
AccountButton2 as AccountButton,
|
|
4177
4320
|
EntryKitProvider,
|
|
4321
|
+
createBundlerClient,
|
|
4178
4322
|
createWagmiConfig,
|
|
4323
|
+
defineCall,
|
|
4179
4324
|
defineConfig,
|
|
4325
|
+
getBundlerTransport,
|
|
4326
|
+
getDefaultConnectors,
|
|
4180
4327
|
getFundsQueryOptions,
|
|
4181
4328
|
internal_validateSigner,
|
|
4182
4329
|
useAccountModal,
|