@latticexyz/entrykit 2.2.23-8150fcd067d3a61e87f7582805a1c129a93731b6 → 2.2.23-84b8926b9c97fd6d0807aa5b84326fe9a698f264
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.
- package/dist/tsup/exports/internal.js +427 -408
- package/dist/tsup/exports/internal.js.map +1 -1
- package/package.json +11 -11
|
@@ -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";
|
|
@@ -582,6 +582,7 @@ function ConnectWallet() {
|
|
|
582
582
|
function AccountButton({ connector }) {
|
|
583
583
|
const { setOpen } = useModal();
|
|
584
584
|
const { connect, isPending, error: error2 } = useConnect();
|
|
585
|
+
const { chainId } = useEntryKitConfig();
|
|
585
586
|
if (error2) {
|
|
586
587
|
console.error("connect error", error2);
|
|
587
588
|
}
|
|
@@ -592,7 +593,14 @@ function AccountButton({ connector }) {
|
|
|
592
593
|
variant: "secondary",
|
|
593
594
|
className: "self-auto flex justify-center",
|
|
594
595
|
pending: isPending,
|
|
595
|
-
onClick: () => connect({
|
|
596
|
+
onClick: () => connect({
|
|
597
|
+
connector,
|
|
598
|
+
// need to provide both `chainId` and `capabilities` to the
|
|
599
|
+
// Porto connector so a fresh browser instance reusing a synced passkey
|
|
600
|
+
// can be bound to the correct chain ID for the account
|
|
601
|
+
chainId,
|
|
602
|
+
capabilities: {}
|
|
603
|
+
}),
|
|
596
604
|
autoFocus: true,
|
|
597
605
|
children: "Sign in"
|
|
598
606
|
},
|
|
@@ -631,7 +639,7 @@ function WalletButton() {
|
|
|
631
639
|
}
|
|
632
640
|
|
|
633
641
|
// src/onboarding/ConnectedSteps.tsx
|
|
634
|
-
import { useEffect as
|
|
642
|
+
import { useEffect as useEffect14, useMemo as useMemo4, useRef as useRef5, useState as useState5 } from "react";
|
|
635
643
|
import { twMerge as twMerge18 } from "tailwind-merge";
|
|
636
644
|
|
|
637
645
|
// src/onboarding/usePrerequisites.ts
|
|
@@ -1195,153 +1203,12 @@ function Wallet({ isActive, isExpanded, userAddress }) {
|
|
|
1195
1203
|
] });
|
|
1196
1204
|
}
|
|
1197
1205
|
|
|
1198
|
-
// src/onboarding/quarry/Allowance.tsx
|
|
1199
|
-
import { parseEther as parseEther2 } from "viem";
|
|
1200
|
-
|
|
1201
|
-
// src/onboarding/quarry/useRequestAllowance.ts
|
|
1202
|
-
import { useMutation, useQueryClient as useQueryClient3 } from "@tanstack/react-query";
|
|
1203
|
-
|
|
1204
|
-
// src/quarry/transports/quarrySponsor.ts
|
|
1205
|
-
import { http as http2 } from "viem";
|
|
1206
|
-
function quarrySponsor() {
|
|
1207
|
-
return ({ chain }) => {
|
|
1208
|
-
if (!chain) throw new Error("No chain provided to quarrySponsor transport.");
|
|
1209
|
-
const url = "quarrySponsor" in chain.rpcUrls ? chain.rpcUrls.quarrySponsor.http[0] : void 0;
|
|
1210
|
-
if (!url) throw new Error(`No \`quarrySponsor\` RPC URL found for chain ${chain.id}.`);
|
|
1211
|
-
return http2(url)({ chain, retryCount: 0 });
|
|
1212
|
-
};
|
|
1213
|
-
}
|
|
1214
|
-
|
|
1215
|
-
// src/quarry/requestAllowance.ts
|
|
1216
|
-
async function requestAllowance({ chain, userAddress }) {
|
|
1217
|
-
const transport = quarrySponsor()({ chain });
|
|
1218
|
-
debug2("Requesting allowance for", userAddress);
|
|
1219
|
-
await transport.request({
|
|
1220
|
-
method: "sponsor_requestAllowance",
|
|
1221
|
-
params: [userAddress]
|
|
1222
|
-
});
|
|
1223
|
-
}
|
|
1224
|
-
|
|
1225
|
-
// src/onboarding/quarry/useRequestAllowance.ts
|
|
1226
|
-
function useRequestAllowance() {
|
|
1227
|
-
const queryClient = useQueryClient3();
|
|
1228
|
-
const { chain } = useEntryKitConfig();
|
|
1229
|
-
const mutationKey = ["requestAllowance", chain.id];
|
|
1230
|
-
return useMutation({
|
|
1231
|
-
retry: 0,
|
|
1232
|
-
mutationKey,
|
|
1233
|
-
mutationFn: async (userAddress) => {
|
|
1234
|
-
await requestAllowance({ chain, userAddress });
|
|
1235
|
-
await Promise.all([
|
|
1236
|
-
queryClient.invalidateQueries({ queryKey: ["getAllowance"] }),
|
|
1237
|
-
queryClient.invalidateQueries({ queryKey: ["getFunds"] }),
|
|
1238
|
-
queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] })
|
|
1239
|
-
]);
|
|
1240
|
-
}
|
|
1241
|
-
});
|
|
1242
|
-
}
|
|
1243
|
-
|
|
1244
|
-
// src/icons/EthIcon.tsx
|
|
1245
|
-
import { twMerge as twMerge6 } from "tailwind-merge";
|
|
1246
|
-
import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1247
|
-
function EthIcon({ className, ...props }) {
|
|
1248
|
-
return /* @__PURE__ */ jsxs10(
|
|
1249
|
-
"svg",
|
|
1250
|
-
{
|
|
1251
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
1252
|
-
viewBox: "0 0 263 428",
|
|
1253
|
-
fill: "currentColor",
|
|
1254
|
-
className: twMerge6("w-[0.6em] h-[1em]", className),
|
|
1255
|
-
...props,
|
|
1256
|
-
children: [
|
|
1257
|
-
/* @__PURE__ */ jsx12("path", { d: "M132 321V428L263 243L132 321Z" }),
|
|
1258
|
-
/* @__PURE__ */ jsx12("path", { d: "M0 243L132 321V428", fillOpacity: "0.5" }),
|
|
1259
|
-
/* @__PURE__ */ jsx12("path", { d: "M132 0V296L263 218" }),
|
|
1260
|
-
/* @__PURE__ */ jsx12("path", { d: "M0 218L132 296V0L0 218Z", fillOpacity: "0.5" })
|
|
1261
|
-
]
|
|
1262
|
-
}
|
|
1263
|
-
);
|
|
1264
|
-
}
|
|
1265
|
-
|
|
1266
|
-
// src/formatBalance.ts
|
|
1267
|
-
import { formatEther } from "viem";
|
|
1268
|
-
function formatBalance(wei) {
|
|
1269
|
-
const formatted = formatEther(wei);
|
|
1270
|
-
const parsed = parseFloat(formatted);
|
|
1271
|
-
if (parsed > 0 && parsed < 1e-5) {
|
|
1272
|
-
return "<0.00001";
|
|
1273
|
-
}
|
|
1274
|
-
const magnitude = Math.floor(parsed).toString().length;
|
|
1275
|
-
return parsed.toLocaleString("en-US", { maximumFractionDigits: Math.max(0, 6 - magnitude) });
|
|
1276
|
-
}
|
|
1277
|
-
|
|
1278
|
-
// src/ui/Balance.tsx
|
|
1279
|
-
import { formatEther as formatEther2 } from "viem";
|
|
1280
|
-
import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1281
|
-
function Balance({ wei }) {
|
|
1282
|
-
return /* @__PURE__ */ jsxs11("span", { className: "inline-flex items-center gap-1", title: formatEther2(wei), children: [
|
|
1283
|
-
formatBalance(wei),
|
|
1284
|
-
" ",
|
|
1285
|
-
/* @__PURE__ */ jsx13(EthIcon, {})
|
|
1286
|
-
] });
|
|
1287
|
-
}
|
|
1288
|
-
|
|
1289
|
-
// src/onboarding/quarry/Allowance.tsx
|
|
1290
|
-
import { useEffect as useEffect6 } from "react";
|
|
1291
|
-
|
|
1292
|
-
// src/errors/useShowQueryError.ts
|
|
1293
|
-
import { useEffect as useEffect5 } from "react";
|
|
1294
|
-
function useShowQueryError(result) {
|
|
1295
|
-
const { error: error2, refetch } = result;
|
|
1296
|
-
useEffect5(() => {
|
|
1297
|
-
if (!error2) return;
|
|
1298
|
-
return addError({ error: error2, retry: refetch, dismiss: () => {
|
|
1299
|
-
} });
|
|
1300
|
-
}, [error2, refetch]);
|
|
1301
|
-
return result;
|
|
1302
|
-
}
|
|
1303
|
-
|
|
1304
|
-
// src/onboarding/quarry/Allowance.tsx
|
|
1305
|
-
import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1306
|
-
function Allowance({ isActive, isExpanded, userAddress }) {
|
|
1307
|
-
const allowance = useShowQueryError(useAllowance(userAddress));
|
|
1308
|
-
const requestAllowance2 = useShowMutationError(useRequestAllowance());
|
|
1309
|
-
useEffect6(() => {
|
|
1310
|
-
const timer = setTimeout(() => {
|
|
1311
|
-
if (isActive && requestAllowance2.status === "idle" && allowance.isSuccess && allowance.data != null && allowance.data < parseEther2("0.01")) {
|
|
1312
|
-
requestAllowance2.mutate(userAddress);
|
|
1313
|
-
}
|
|
1314
|
-
});
|
|
1315
|
-
return () => clearTimeout(timer);
|
|
1316
|
-
}, [allowance.data, allowance.isSuccess, requestAllowance2, isActive, userAddress]);
|
|
1317
|
-
return /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-4", children: [
|
|
1318
|
-
/* @__PURE__ */ jsxs12("div", { className: "flex justify-between gap-4", children: [
|
|
1319
|
-
/* @__PURE__ */ jsxs12("div", { children: [
|
|
1320
|
-
/* @__PURE__ */ jsx14("div", { children: "Allowance" }),
|
|
1321
|
-
/* @__PURE__ */ jsx14("div", { className: "font-mono text-white", children: allowance.data != null ? /* @__PURE__ */ jsx14(Balance, { wei: allowance.data }) : /* @__PURE__ */ jsx14(PendingIcon, { className: "text-sm" }) })
|
|
1322
|
-
] }),
|
|
1323
|
-
/* @__PURE__ */ jsx14(
|
|
1324
|
-
Button,
|
|
1325
|
-
{
|
|
1326
|
-
variant: isActive ? "primary" : "tertiary",
|
|
1327
|
-
className: "flex-shrink-0 text-sm p-1 w-28",
|
|
1328
|
-
autoFocus: isActive || isExpanded,
|
|
1329
|
-
pending: allowance.status === "pending" || requestAllowance2.status === "pending",
|
|
1330
|
-
onClick: () => requestAllowance2.mutate(userAddress),
|
|
1331
|
-
children: "Top up"
|
|
1332
|
-
}
|
|
1333
|
-
)
|
|
1334
|
-
] }),
|
|
1335
|
-
isExpanded ? /* @__PURE__ */ jsx14("p", { className: "text-sm", children: "Your allowance is used to pay for onchain computation." }) : null
|
|
1336
|
-
] });
|
|
1337
|
-
}
|
|
1338
|
-
|
|
1339
1206
|
// src/onboarding/Session.tsx
|
|
1340
|
-
import { useEffect as
|
|
1207
|
+
import { useEffect as useEffect6 } from "react";
|
|
1341
1208
|
|
|
1342
1209
|
// src/onboarding/useSetupSession.ts
|
|
1343
|
-
import { encodeFunctionData, parseEventLogs as parseEventLogs2 } from "viem";
|
|
1344
|
-
import { useMutation
|
|
1210
|
+
import { encodeFunctionData, parseEventLogs as parseEventLogs2, zeroAddress } from "viem";
|
|
1211
|
+
import { useMutation, useQueryClient as useQueryClient3 } from "@tanstack/react-query";
|
|
1345
1212
|
import { getAction as getAction5 } from "viem/utils";
|
|
1346
1213
|
import { entryPoint07Abi as entryPoint07Abi2, sendUserOperation as sendUserOperation2, waitForUserOperationReceipt } from "viem/account-abstraction";
|
|
1347
1214
|
import { sendCalls, waitForTransactionReceipt as waitForTransactionReceipt2 } from "viem/actions";
|
|
@@ -1489,11 +1356,11 @@ function createFeeEstimator(client) {
|
|
|
1489
1356
|
import { isIdPlaceConnector as isIdPlaceConnector2 } from "@latticexyz/id.place/internal";
|
|
1490
1357
|
import { storeEventsAbi } from "@latticexyz/store";
|
|
1491
1358
|
function useSetupSession({ connector, userClient }) {
|
|
1492
|
-
const queryClient =
|
|
1359
|
+
const queryClient = useQueryClient3();
|
|
1493
1360
|
const { chainId, worldAddress } = useEntryKitConfig();
|
|
1494
1361
|
const client = useClient8({ chainId });
|
|
1495
1362
|
const mutationKey = ["setupSession", client?.chain.id, userClient.account.address];
|
|
1496
|
-
return
|
|
1363
|
+
return useMutation({
|
|
1497
1364
|
retry: 0,
|
|
1498
1365
|
mutationKey,
|
|
1499
1366
|
mutationFn: async ({
|
|
@@ -1649,6 +1516,23 @@ function useSetupSession({ connector, userClient }) {
|
|
|
1649
1516
|
}
|
|
1650
1517
|
}
|
|
1651
1518
|
}
|
|
1519
|
+
await (async () => {
|
|
1520
|
+
if (await sessionClient.account.isDeployed?.()) return;
|
|
1521
|
+
console.log("creating session account by sending empty user op");
|
|
1522
|
+
const hash = await getAction5(
|
|
1523
|
+
sessionClient,
|
|
1524
|
+
sendUserOperation2,
|
|
1525
|
+
"sendUserOperation"
|
|
1526
|
+
)({
|
|
1527
|
+
calls: [{ to: zeroAddress }]
|
|
1528
|
+
});
|
|
1529
|
+
const receipt = await getAction5(
|
|
1530
|
+
sessionClient,
|
|
1531
|
+
waitForUserOperationReceipt,
|
|
1532
|
+
"waitForUserOperationReceipt"
|
|
1533
|
+
)({ hash });
|
|
1534
|
+
console.log("got user op receipt", receipt);
|
|
1535
|
+
})();
|
|
1652
1536
|
await Promise.all([
|
|
1653
1537
|
queryClient.invalidateQueries({ queryKey: ["getSpender"] }),
|
|
1654
1538
|
queryClient.invalidateQueries({ queryKey: ["getDelegation"] }),
|
|
@@ -1663,7 +1547,7 @@ import { useClient as useClient9 } from "wagmi";
|
|
|
1663
1547
|
import {
|
|
1664
1548
|
queryOptions as queryOptions8,
|
|
1665
1549
|
useQuery as useQuery10,
|
|
1666
|
-
useQueryClient as
|
|
1550
|
+
useQueryClient as useQueryClient4
|
|
1667
1551
|
} from "@tanstack/react-query";
|
|
1668
1552
|
|
|
1669
1553
|
// src/getSessionClient.ts
|
|
@@ -1730,7 +1614,7 @@ function getSessionClientQueryOptions({
|
|
|
1730
1614
|
});
|
|
1731
1615
|
}
|
|
1732
1616
|
function useSessionClient(userAddress) {
|
|
1733
|
-
const queryClient =
|
|
1617
|
+
const queryClient = useQueryClient4();
|
|
1734
1618
|
const { chainId, worldAddress } = useEntryKitConfig();
|
|
1735
1619
|
const client = useClient9({ chainId });
|
|
1736
1620
|
return useQuery10(
|
|
@@ -1743,15 +1627,27 @@ function useSessionClient(userAddress) {
|
|
|
1743
1627
|
);
|
|
1744
1628
|
}
|
|
1745
1629
|
|
|
1630
|
+
// src/errors/useShowQueryError.ts
|
|
1631
|
+
import { useEffect as useEffect5 } from "react";
|
|
1632
|
+
function useShowQueryError(result) {
|
|
1633
|
+
const { error: error2, refetch } = result;
|
|
1634
|
+
useEffect5(() => {
|
|
1635
|
+
if (!error2) return;
|
|
1636
|
+
return addError({ error: error2, retry: refetch, dismiss: () => {
|
|
1637
|
+
} });
|
|
1638
|
+
}, [error2, refetch]);
|
|
1639
|
+
return result;
|
|
1640
|
+
}
|
|
1641
|
+
|
|
1746
1642
|
// src/onboarding/Session.tsx
|
|
1747
|
-
import { jsx as
|
|
1643
|
+
import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1748
1644
|
function Session({ isActive, isExpanded, connector, userClient, registerSpender, registerDelegation }) {
|
|
1749
1645
|
const sessionClient = useShowQueryError(useSessionClient(userClient.account.address));
|
|
1750
1646
|
const setup = useShowMutationError(useSetupSession({ userClient, connector }));
|
|
1751
1647
|
const hasSession = !registerDelegation && !registerDelegation;
|
|
1752
1648
|
const { data: prerequisites } = usePrerequisites(userClient.account.address);
|
|
1753
1649
|
const { hasAllowance, hasGasBalance, hasQuarryGasBalance } = prerequisites ?? {};
|
|
1754
|
-
|
|
1650
|
+
useEffect6(() => {
|
|
1755
1651
|
const timer = setTimeout(() => {
|
|
1756
1652
|
if (isActive && setup.status === "idle" && sessionClient.data && !hasSession && (hasAllowance || hasGasBalance || hasQuarryGasBalance)) {
|
|
1757
1653
|
}
|
|
@@ -1768,13 +1664,13 @@ function Session({ isActive, isExpanded, connector, userClient, registerSpender,
|
|
|
1768
1664
|
hasGasBalance,
|
|
1769
1665
|
hasQuarryGasBalance
|
|
1770
1666
|
]);
|
|
1771
|
-
return /* @__PURE__ */
|
|
1772
|
-
/* @__PURE__ */
|
|
1773
|
-
/* @__PURE__ */
|
|
1774
|
-
/* @__PURE__ */
|
|
1775
|
-
/* @__PURE__ */
|
|
1667
|
+
return /* @__PURE__ */ jsxs10("div", { className: "flex flex-col gap-4", children: [
|
|
1668
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex justify-between gap-4", children: [
|
|
1669
|
+
/* @__PURE__ */ jsxs10("div", { children: [
|
|
1670
|
+
/* @__PURE__ */ jsx12("div", { children: "Session" }),
|
|
1671
|
+
/* @__PURE__ */ jsx12("div", { className: "font-mono text-white", children: hasSession ? "Enabled" : "Set up" })
|
|
1776
1672
|
] }),
|
|
1777
|
-
hasSession ? /* @__PURE__ */
|
|
1673
|
+
hasSession ? /* @__PURE__ */ jsx12(Button, { variant: "tertiary", className: "flex-shrink-0 text-sm p-1 w-28", autoFocus: isActive, disabled: true, children: "Enabled" }) : /* @__PURE__ */ jsx12(
|
|
1778
1674
|
Button,
|
|
1779
1675
|
{
|
|
1780
1676
|
variant: isActive ? "primary" : "tertiary",
|
|
@@ -1790,14 +1686,61 @@ function Session({ isActive, isExpanded, connector, userClient, registerSpender,
|
|
|
1790
1686
|
}
|
|
1791
1687
|
)
|
|
1792
1688
|
] }),
|
|
1793
|
-
isExpanded ? /* @__PURE__ */
|
|
1689
|
+
isExpanded ? /* @__PURE__ */ jsx12("p", { className: "text-sm", children: "You can perform actions in this app without interruptions for approvals." }) : null
|
|
1690
|
+
] });
|
|
1691
|
+
}
|
|
1692
|
+
|
|
1693
|
+
// src/onboarding/GasBalance.tsx
|
|
1694
|
+
import { useEffect as useEffect8, useState as useState2 } from "react";
|
|
1695
|
+
import { parseEther as parseEther2 } from "viem";
|
|
1696
|
+
import { useQueryClient as useQueryClient6 } from "@tanstack/react-query";
|
|
1697
|
+
|
|
1698
|
+
// src/icons/EthIcon.tsx
|
|
1699
|
+
import { twMerge as twMerge6 } from "tailwind-merge";
|
|
1700
|
+
import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1701
|
+
function EthIcon({ className, ...props }) {
|
|
1702
|
+
return /* @__PURE__ */ jsxs11(
|
|
1703
|
+
"svg",
|
|
1704
|
+
{
|
|
1705
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1706
|
+
viewBox: "0 0 263 428",
|
|
1707
|
+
fill: "currentColor",
|
|
1708
|
+
className: twMerge6("w-[0.6em] h-[1em]", className),
|
|
1709
|
+
...props,
|
|
1710
|
+
children: [
|
|
1711
|
+
/* @__PURE__ */ jsx13("path", { d: "M132 321V428L263 243L132 321Z" }),
|
|
1712
|
+
/* @__PURE__ */ jsx13("path", { d: "M0 243L132 321V428", fillOpacity: "0.5" }),
|
|
1713
|
+
/* @__PURE__ */ jsx13("path", { d: "M132 0V296L263 218" }),
|
|
1714
|
+
/* @__PURE__ */ jsx13("path", { d: "M0 218L132 296V0L0 218Z", fillOpacity: "0.5" })
|
|
1715
|
+
]
|
|
1716
|
+
}
|
|
1717
|
+
);
|
|
1718
|
+
}
|
|
1719
|
+
|
|
1720
|
+
// src/formatBalance.ts
|
|
1721
|
+
import { formatEther } from "viem";
|
|
1722
|
+
function formatBalance(wei) {
|
|
1723
|
+
const formatted = formatEther(wei);
|
|
1724
|
+
const parsed = parseFloat(formatted);
|
|
1725
|
+
if (parsed > 0 && parsed < 1e-5) {
|
|
1726
|
+
return "<0.00001";
|
|
1727
|
+
}
|
|
1728
|
+
const magnitude = Math.floor(parsed).toString().length;
|
|
1729
|
+
return parsed.toLocaleString("en-US", { maximumFractionDigits: Math.max(0, 6 - magnitude) });
|
|
1730
|
+
}
|
|
1731
|
+
|
|
1732
|
+
// src/ui/Balance.tsx
|
|
1733
|
+
import { formatEther as formatEther2 } from "viem";
|
|
1734
|
+
import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1735
|
+
function Balance({ wei }) {
|
|
1736
|
+
return /* @__PURE__ */ jsxs12("span", { className: "inline-flex items-center gap-1", title: formatEther2(wei), children: [
|
|
1737
|
+
formatBalance(wei),
|
|
1738
|
+
" ",
|
|
1739
|
+
/* @__PURE__ */ jsx14(EthIcon, {})
|
|
1794
1740
|
] });
|
|
1795
1741
|
}
|
|
1796
1742
|
|
|
1797
1743
|
// src/onboarding/GasBalance.tsx
|
|
1798
|
-
import { useEffect as useEffect9, useState as useState2 } from "react";
|
|
1799
|
-
import { parseEther as parseEther3 } from "viem";
|
|
1800
|
-
import { useQueryClient as useQueryClient7 } from "@tanstack/react-query";
|
|
1801
1744
|
import { useBalance as useBalance2, useWatchBlockNumber } from "wagmi";
|
|
1802
1745
|
|
|
1803
1746
|
// src/data/relayChains.json
|
|
@@ -2081,14 +2024,14 @@ var relayChains_default = {
|
|
|
2081
2024
|
};
|
|
2082
2025
|
|
|
2083
2026
|
// src/onboarding/useSetBalance.ts
|
|
2084
|
-
import { useQueryClient as
|
|
2027
|
+
import { useQueryClient as useQueryClient5, useMutation as useMutation2 } from "@tanstack/react-query";
|
|
2085
2028
|
import { setBalance as setBalance2 } from "viem/actions";
|
|
2086
2029
|
import { useClient as useClient10 } from "wagmi";
|
|
2087
2030
|
function useSetBalance() {
|
|
2088
|
-
const queryClient =
|
|
2031
|
+
const queryClient = useQueryClient5();
|
|
2089
2032
|
const { chainId } = useEntryKitConfig();
|
|
2090
2033
|
const client = useClient10({ chainId });
|
|
2091
|
-
return
|
|
2034
|
+
return useMutation2({
|
|
2092
2035
|
retry: 0,
|
|
2093
2036
|
mutationKey: ["setBalance", chainId],
|
|
2094
2037
|
mutationFn: async (params) => {
|
|
@@ -2105,10 +2048,10 @@ function useSetBalance() {
|
|
|
2105
2048
|
}
|
|
2106
2049
|
|
|
2107
2050
|
// src/errors/usePrevious.ts
|
|
2108
|
-
import { useEffect as
|
|
2051
|
+
import { useEffect as useEffect7, useRef as useRef3 } from "react";
|
|
2109
2052
|
function usePrevious(value, initialValue) {
|
|
2110
2053
|
const ref = useRef3();
|
|
2111
|
-
|
|
2054
|
+
useEffect7(() => {
|
|
2112
2055
|
ref.current = { value };
|
|
2113
2056
|
}, [value]);
|
|
2114
2057
|
return ref.current ? ref.current.value : initialValue;
|
|
@@ -2116,9 +2059,9 @@ function usePrevious(value, initialValue) {
|
|
|
2116
2059
|
|
|
2117
2060
|
// src/icons/IconSVG.tsx
|
|
2118
2061
|
import { twMerge as twMerge7 } from "tailwind-merge";
|
|
2119
|
-
import { jsx as
|
|
2062
|
+
import { jsx as jsx15 } from "react/jsx-runtime";
|
|
2120
2063
|
function IconSVG({ className, children, ...props }) {
|
|
2121
|
-
return /* @__PURE__ */
|
|
2064
|
+
return /* @__PURE__ */ jsx15(
|
|
2122
2065
|
"svg",
|
|
2123
2066
|
{
|
|
2124
2067
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2132,9 +2075,9 @@ function IconSVG({ className, children, ...props }) {
|
|
|
2132
2075
|
}
|
|
2133
2076
|
|
|
2134
2077
|
// src/icons/CopyIcon.tsx
|
|
2135
|
-
import { jsx as
|
|
2078
|
+
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
2136
2079
|
function CopyIcon(props) {
|
|
2137
|
-
return /* @__PURE__ */
|
|
2080
|
+
return /* @__PURE__ */ jsx16(IconSVG, { ...props, children: /* @__PURE__ */ jsx16(
|
|
2138
2081
|
"path",
|
|
2139
2082
|
{
|
|
2140
2083
|
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",
|
|
@@ -2148,9 +2091,9 @@ function CopyIcon(props) {
|
|
|
2148
2091
|
}
|
|
2149
2092
|
|
|
2150
2093
|
// src/icons/CheckIcon.tsx
|
|
2151
|
-
import { jsx as
|
|
2094
|
+
import { jsx as jsx17 } from "react/jsx-runtime";
|
|
2152
2095
|
function CheckIcon(props) {
|
|
2153
|
-
return /* @__PURE__ */
|
|
2096
|
+
return /* @__PURE__ */ jsx17(IconSVG, { ...props, children: /* @__PURE__ */ jsx17(
|
|
2154
2097
|
"path",
|
|
2155
2098
|
{
|
|
2156
2099
|
d: "M5 13L9 17L19 7",
|
|
@@ -2164,9 +2107,9 @@ function CheckIcon(props) {
|
|
|
2164
2107
|
}
|
|
2165
2108
|
|
|
2166
2109
|
// src/onboarding/GasBalance.tsx
|
|
2167
|
-
import { Fragment as Fragment2, jsx as
|
|
2110
|
+
import { Fragment as Fragment2, jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
2168
2111
|
function GasBalance({ isActive, isExpanded, sessionAddress }) {
|
|
2169
|
-
const queryClient =
|
|
2112
|
+
const queryClient = useQueryClient6();
|
|
2170
2113
|
const { chain } = useEntryKitConfig();
|
|
2171
2114
|
const [copied, setCopied] = useState2(false);
|
|
2172
2115
|
const balance = useShowQueryError(useBalance2({ chainId: chain.id, address: sessionAddress }));
|
|
@@ -2179,19 +2122,19 @@ function GasBalance({ isActive, isExpanded, sessionAddress }) {
|
|
|
2179
2122
|
setCopied(true);
|
|
2180
2123
|
setTimeout(() => setCopied(false), 2e3);
|
|
2181
2124
|
};
|
|
2182
|
-
|
|
2125
|
+
useEffect8(() => {
|
|
2183
2126
|
if (balance.data != null && prevBalance?.value === 0n && balance.data.value > 0n) {
|
|
2184
2127
|
queryClient.invalidateQueries({ queryKey: ["getFunds"] });
|
|
2185
2128
|
queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] });
|
|
2186
2129
|
}
|
|
2187
2130
|
}, [balance.data, prevBalance, setBalance3, sessionAddress, queryClient]);
|
|
2188
|
-
return /* @__PURE__ */
|
|
2189
|
-
/* @__PURE__ */
|
|
2190
|
-
/* @__PURE__ */
|
|
2191
|
-
/* @__PURE__ */
|
|
2192
|
-
/* @__PURE__ */
|
|
2131
|
+
return /* @__PURE__ */ jsxs13("div", { className: "flex flex-col gap-4", children: [
|
|
2132
|
+
/* @__PURE__ */ jsxs13("div", { className: "flex justify-between gap-4", children: [
|
|
2133
|
+
/* @__PURE__ */ jsxs13("div", { children: [
|
|
2134
|
+
/* @__PURE__ */ jsx18("div", { children: "Gas balance" }),
|
|
2135
|
+
/* @__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" }) })
|
|
2193
2136
|
] }),
|
|
2194
|
-
chain.id === 31337 ? /* @__PURE__ */
|
|
2137
|
+
chain.id === 31337 ? /* @__PURE__ */ jsx18(
|
|
2195
2138
|
Button,
|
|
2196
2139
|
{
|
|
2197
2140
|
variant: isActive ? "primary" : "tertiary",
|
|
@@ -2200,19 +2143,19 @@ function GasBalance({ isActive, isExpanded, sessionAddress }) {
|
|
|
2200
2143
|
pending: balance.status === "pending" || setBalance3.status === "pending",
|
|
2201
2144
|
onClick: () => setBalance3.mutate({
|
|
2202
2145
|
address: sessionAddress,
|
|
2203
|
-
value:
|
|
2146
|
+
value: parseEther2("0.01") + (balance.data?.value ?? 0n)
|
|
2204
2147
|
}),
|
|
2205
2148
|
children: "Top up"
|
|
2206
2149
|
}
|
|
2207
2150
|
) : relayChain != null ? (
|
|
2208
2151
|
// TODO: convert this to a <ButtonLink>
|
|
2209
|
-
/* @__PURE__ */
|
|
2152
|
+
/* @__PURE__ */ jsx18(
|
|
2210
2153
|
"a",
|
|
2211
2154
|
{
|
|
2212
2155
|
href: `${relayChain.bridgeUrl}?${new URLSearchParams({ toAddress: sessionAddress, amount: "0.01" })}`,
|
|
2213
2156
|
target: "_blank",
|
|
2214
2157
|
rel: "noopener noreferrer",
|
|
2215
|
-
children: /* @__PURE__ */
|
|
2158
|
+
children: /* @__PURE__ */ jsx18(
|
|
2216
2159
|
Button,
|
|
2217
2160
|
{
|
|
2218
2161
|
variant: isActive ? "primary" : "tertiary",
|
|
@@ -2226,21 +2169,21 @@ function GasBalance({ isActive, isExpanded, sessionAddress }) {
|
|
|
2226
2169
|
)
|
|
2227
2170
|
) : null
|
|
2228
2171
|
] }),
|
|
2229
|
-
isExpanded ? /* @__PURE__ */
|
|
2230
|
-
/* @__PURE__ */
|
|
2231
|
-
/* @__PURE__ */
|
|
2172
|
+
isExpanded ? /* @__PURE__ */ jsxs13(Fragment2, { children: [
|
|
2173
|
+
/* @__PURE__ */ jsx18("p", { className: "text-sm", children: "Your session's gas balance is used to pay for onchain computation." }),
|
|
2174
|
+
/* @__PURE__ */ jsxs13("p", { className: "text-sm", children: [
|
|
2232
2175
|
"Send funds to",
|
|
2233
2176
|
" ",
|
|
2234
|
-
/* @__PURE__ */
|
|
2177
|
+
/* @__PURE__ */ jsxs13(
|
|
2235
2178
|
"span",
|
|
2236
2179
|
{
|
|
2237
2180
|
className: "inline-flex items-center gap-1 font-mono text-white cursor-pointer hover:text-white/80 transition-colors",
|
|
2238
2181
|
onClick: handleCopy,
|
|
2239
2182
|
title: "Click to copy",
|
|
2240
2183
|
children: [
|
|
2241
|
-
/* @__PURE__ */
|
|
2184
|
+
/* @__PURE__ */ jsx18(TruncatedHex, { hex: sessionAddress }),
|
|
2242
2185
|
" ",
|
|
2243
|
-
copied ? /* @__PURE__ */
|
|
2186
|
+
copied ? /* @__PURE__ */ jsx18(CheckIcon, { className: "w-3.5 h-3.5" }) : /* @__PURE__ */ jsx18(CopyIcon, { className: "w-3.5 h-3.5" })
|
|
2244
2187
|
]
|
|
2245
2188
|
}
|
|
2246
2189
|
),
|
|
@@ -2254,7 +2197,7 @@ function GasBalance({ isActive, isExpanded, sessionAddress }) {
|
|
|
2254
2197
|
}
|
|
2255
2198
|
|
|
2256
2199
|
// src/onboarding/quarry/GasBalance.tsx
|
|
2257
|
-
import { useEffect as
|
|
2200
|
+
import { useEffect as useEffect13 } from "react";
|
|
2258
2201
|
import { useQueryClient as useQueryClient10 } from "@tanstack/react-query";
|
|
2259
2202
|
|
|
2260
2203
|
// src/onboarding/deposit/DepositFormContainer.tsx
|
|
@@ -2264,24 +2207,24 @@ import { useChains as useChains4, useChainId } from "wagmi";
|
|
|
2264
2207
|
// src/onboarding/deposit/DepositViaTransferForm.tsx
|
|
2265
2208
|
import { useAccount as useAccount4, useWriteContract, usePrepareTransactionRequest, usePublicClient } from "wagmi";
|
|
2266
2209
|
import { encodeFunctionData as encodeFunctionData2 } from "viem";
|
|
2267
|
-
import { useMutation as
|
|
2210
|
+
import { useMutation as useMutation3, useQuery as useQuery13 } from "@tanstack/react-query";
|
|
2268
2211
|
|
|
2269
2212
|
// src/onboarding/deposit/DepositForm.tsx
|
|
2270
|
-
import { useEffect as
|
|
2213
|
+
import { useEffect as useEffect10, useRef as useRef4 } from "react";
|
|
2271
2214
|
import { useAccount as useAccount3, useBalance as useBalance4, useWatchBlockNumber as useWatchBlockNumber2 } from "wagmi";
|
|
2272
2215
|
import { useIsMounted } from "usehooks-ts";
|
|
2273
2216
|
import { twMerge as twMerge15 } from "tailwind-merge";
|
|
2274
2217
|
|
|
2275
2218
|
// src/onboarding/deposit/ChainSelect.tsx
|
|
2276
|
-
import { useEffect as
|
|
2219
|
+
import { useEffect as useEffect9, useMemo as useMemo2 } from "react";
|
|
2277
2220
|
import { useSwitchChain } from "wagmi";
|
|
2278
2221
|
import { twMerge as twMerge12 } from "tailwind-merge";
|
|
2279
2222
|
import * as Select from "@radix-ui/react-select";
|
|
2280
2223
|
|
|
2281
2224
|
// src/icons/ChevronUpIcon.tsx
|
|
2282
|
-
import { jsx as
|
|
2225
|
+
import { jsx as jsx19 } from "react/jsx-runtime";
|
|
2283
2226
|
function ChevronUpIcon(props) {
|
|
2284
|
-
return /* @__PURE__ */
|
|
2227
|
+
return /* @__PURE__ */ jsx19(IconSVG, { viewBox: "0 0 20 20", ...props, children: /* @__PURE__ */ jsx19(
|
|
2285
2228
|
"path",
|
|
2286
2229
|
{
|
|
2287
2230
|
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",
|
|
@@ -2292,9 +2235,9 @@ function ChevronUpIcon(props) {
|
|
|
2292
2235
|
}
|
|
2293
2236
|
|
|
2294
2237
|
// src/icons/ChevronDownIcon.tsx
|
|
2295
|
-
import { jsx as
|
|
2238
|
+
import { jsx as jsx20 } from "react/jsx-runtime";
|
|
2296
2239
|
function ChevronDownIcon(props) {
|
|
2297
|
-
return /* @__PURE__ */
|
|
2240
|
+
return /* @__PURE__ */ jsx20(IconSVG, { viewBox: "0 0 20 20", ...props, children: /* @__PURE__ */ jsx20(
|
|
2298
2241
|
"path",
|
|
2299
2242
|
{
|
|
2300
2243
|
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",
|
|
@@ -2330,10 +2273,10 @@ function Slot({
|
|
|
2330
2273
|
|
|
2331
2274
|
// src/ui/Input.tsx
|
|
2332
2275
|
import { twMerge as twMerge9 } from "tailwind-merge";
|
|
2333
|
-
import { jsx as
|
|
2276
|
+
import { jsx as jsx21 } from "react/jsx-runtime";
|
|
2334
2277
|
function Input({ asChild, className, ...props }) {
|
|
2335
2278
|
const Child = asChild ? Slot : "input";
|
|
2336
|
-
return /* @__PURE__ */
|
|
2279
|
+
return /* @__PURE__ */ jsx21(
|
|
2337
2280
|
Child,
|
|
2338
2281
|
{
|
|
2339
2282
|
className: twMerge9(
|
|
@@ -2352,24 +2295,24 @@ import { twMerge as twMerge11 } from "tailwind-merge";
|
|
|
2352
2295
|
|
|
2353
2296
|
// src/onboarding/deposit/PreloadedImage.tsx
|
|
2354
2297
|
import { twMerge as twMerge10 } from "tailwind-merge";
|
|
2355
|
-
import { jsx as
|
|
2298
|
+
import { jsx as jsx22 } from "react/jsx-runtime";
|
|
2356
2299
|
function PreloadedImage({ url, fallback: fallback2, className }) {
|
|
2357
2300
|
const { isSuccess, isLoading } = usePreloadImage(url);
|
|
2358
|
-
return /* @__PURE__ */
|
|
2301
|
+
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 });
|
|
2359
2302
|
}
|
|
2360
2303
|
|
|
2361
2304
|
// src/onboarding/deposit/ChainIcon.tsx
|
|
2362
2305
|
import { forwardRef as forwardRef2 } from "react";
|
|
2363
|
-
import { jsx as
|
|
2306
|
+
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
2364
2307
|
var ChainIcon = forwardRef2(function ChainIcon2({ name, url, className }, forwardedRef) {
|
|
2365
|
-
return /* @__PURE__ */
|
|
2308
|
+
return /* @__PURE__ */ jsx23(
|
|
2366
2309
|
"span",
|
|
2367
2310
|
{
|
|
2368
2311
|
ref: forwardedRef,
|
|
2369
2312
|
className: twMerge11("flex-shrink-0 inline-flex w-6 aspect-square rounded-full overflow-clip", className),
|
|
2370
|
-
children: url ? /* @__PURE__ */
|
|
2313
|
+
children: url ? /* @__PURE__ */ jsx23(PreloadedImage, { url }) : (
|
|
2371
2314
|
// TODO: better placeholder
|
|
2372
|
-
/* @__PURE__ */
|
|
2315
|
+
/* @__PURE__ */ jsx23(
|
|
2373
2316
|
"span",
|
|
2374
2317
|
{
|
|
2375
2318
|
className: twMerge11(
|
|
@@ -2444,7 +2387,7 @@ function useChainBalances({ chains }) {
|
|
|
2444
2387
|
}
|
|
2445
2388
|
|
|
2446
2389
|
// src/onboarding/deposit/ChainSelect.tsx
|
|
2447
|
-
import { Fragment as Fragment3, jsx as
|
|
2390
|
+
import { Fragment as Fragment3, jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
2448
2391
|
function ChainSelect({ value, onChange }) {
|
|
2449
2392
|
const theme = useTheme();
|
|
2450
2393
|
const { frame } = useFrame();
|
|
@@ -2467,14 +2410,14 @@ function ChainSelect({ value, onChange }) {
|
|
|
2467
2410
|
const chainsWithBalance = chainsBalances.filter(({ balance }) => balance.value > 0n).map(({ chain, balance }) => ({ chain, balance: balance.value }));
|
|
2468
2411
|
return chainsWithBalance.length > 0 ? chainsWithBalance : sourceChains.map((chain) => ({ chain, balance: 0n }));
|
|
2469
2412
|
}, [chainsBalances, sourceChains]);
|
|
2470
|
-
|
|
2413
|
+
useEffect9(() => {
|
|
2471
2414
|
if (renderedChains.length > 0 && (!selectedChain || !renderedChains.find((c) => c.chain.id === selectedChain?.id))) {
|
|
2472
2415
|
const defaultChain = renderedChains[0].chain;
|
|
2473
2416
|
onChange(defaultChain.id);
|
|
2474
2417
|
switchChain({ chainId: defaultChain.id });
|
|
2475
2418
|
}
|
|
2476
2419
|
}, [value, selectedChain, renderedChains, onChange, switchChain]);
|
|
2477
|
-
return /* @__PURE__ */
|
|
2420
|
+
return /* @__PURE__ */ jsxs14(
|
|
2478
2421
|
Select.Root,
|
|
2479
2422
|
{
|
|
2480
2423
|
value: value.toString(),
|
|
@@ -2486,8 +2429,8 @@ function ChainSelect({ value, onChange }) {
|
|
|
2486
2429
|
}
|
|
2487
2430
|
},
|
|
2488
2431
|
children: [
|
|
2489
|
-
/* @__PURE__ */
|
|
2490
|
-
/* @__PURE__ */
|
|
2432
|
+
/* @__PURE__ */ jsx24(Input, { asChild: true, children: /* @__PURE__ */ jsxs14(Select.Trigger, { className: "group inline-flex items-center justify-center", children: [
|
|
2433
|
+
/* @__PURE__ */ jsx24(Select.Value, { asChild: true, children: /* @__PURE__ */ jsx24(
|
|
2491
2434
|
ChainIcon,
|
|
2492
2435
|
{
|
|
2493
2436
|
id: selectedChain?.id,
|
|
@@ -2496,25 +2439,25 @@ function ChainSelect({ value, onChange }) {
|
|
|
2496
2439
|
className: "w-8"
|
|
2497
2440
|
}
|
|
2498
2441
|
) }),
|
|
2499
|
-
/* @__PURE__ */
|
|
2500
|
-
/* @__PURE__ */
|
|
2501
|
-
/* @__PURE__ */
|
|
2442
|
+
/* @__PURE__ */ jsx24(Select.Icon, { asChild: true, children: /* @__PURE__ */ jsxs14(Fragment3, { children: [
|
|
2443
|
+
/* @__PURE__ */ jsx24(ChevronDownIcon, { className: "text-sm -mr-1 group-aria-expanded:hidden" }),
|
|
2444
|
+
/* @__PURE__ */ jsx24(ChevronUpIcon, { className: "text-sm -mr-1 hidden group-aria-expanded:inline" })
|
|
2502
2445
|
] }) })
|
|
2503
2446
|
] }) }),
|
|
2504
|
-
frame.contentDocument ? /* @__PURE__ */
|
|
2447
|
+
frame.contentDocument ? /* @__PURE__ */ jsx24(Select.Portal, { container: frame.contentDocument.body, children: /* @__PURE__ */ jsx24(
|
|
2505
2448
|
Select.Content,
|
|
2506
2449
|
{
|
|
2507
2450
|
position: "popper",
|
|
2508
2451
|
className: "w-[352px] max-h-[230px] overflow-y-auto mt-1 animate-in fade-in slide-in-from-top-2",
|
|
2509
|
-
children: /* @__PURE__ */
|
|
2452
|
+
children: /* @__PURE__ */ jsx24(Select.Viewport, { children: /* @__PURE__ */ jsx24(
|
|
2510
2453
|
Select.Group,
|
|
2511
2454
|
{
|
|
2512
2455
|
className: twMerge12(
|
|
2513
2456
|
"flex flex-col border divide-y",
|
|
2514
2457
|
"bg-neutral-800 text-neutral-300 border-neutral-700 divide-neutral-700"
|
|
2515
2458
|
),
|
|
2516
|
-
children: isLoading ? /* @__PURE__ */
|
|
2517
|
-
return /* @__PURE__ */
|
|
2459
|
+
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 }) => {
|
|
2460
|
+
return /* @__PURE__ */ jsxs14(
|
|
2518
2461
|
Select.Item,
|
|
2519
2462
|
{
|
|
2520
2463
|
value: chain.id.toString(),
|
|
@@ -2523,9 +2466,9 @@ function ChainSelect({ value, onChange }) {
|
|
|
2523
2466
|
"text-white focus:bg-neutral-700 data-[state=checked]:bg-neutral-900"
|
|
2524
2467
|
),
|
|
2525
2468
|
children: [
|
|
2526
|
-
/* @__PURE__ */
|
|
2527
|
-
/* @__PURE__ */
|
|
2528
|
-
/* @__PURE__ */
|
|
2469
|
+
/* @__PURE__ */ jsx24(ChainIcon, { id: chain.id, name: chain.name, url: chain.relayChain?.icon?.[theme] }),
|
|
2470
|
+
/* @__PURE__ */ jsx24("span", { className: "flex-grow flex-shrink-0", children: chain.name }),
|
|
2471
|
+
/* @__PURE__ */ jsx24("span", { className: "flex-shrink-0 font-mono text-sm text-neutral-400", children: /* @__PURE__ */ jsx24(Balance, { wei: balance }) })
|
|
2529
2472
|
]
|
|
2530
2473
|
},
|
|
2531
2474
|
chain.id
|
|
@@ -2541,13 +2484,13 @@ function ChainSelect({ value, onChange }) {
|
|
|
2541
2484
|
}
|
|
2542
2485
|
|
|
2543
2486
|
// src/onboarding/deposit/AmountInput.tsx
|
|
2544
|
-
import { formatEther as formatEther3, parseEther as
|
|
2487
|
+
import { formatEther as formatEther3, parseEther as parseEther3 } from "viem";
|
|
2545
2488
|
import { twMerge as twMerge13 } from "tailwind-merge";
|
|
2546
2489
|
import { forwardRef as forwardRef3 } from "react";
|
|
2547
|
-
import { jsx as
|
|
2490
|
+
import { jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
2548
2491
|
var AmountInput = forwardRef3(function AmountInput2({ initialAmount, onChange }, forwardedRef) {
|
|
2549
|
-
return /* @__PURE__ */
|
|
2550
|
-
/* @__PURE__ */
|
|
2492
|
+
return /* @__PURE__ */ jsx25(Input, { asChild: true, className: "w-full cursor-text flex items-center", children: /* @__PURE__ */ jsxs15("label", { children: [
|
|
2493
|
+
/* @__PURE__ */ jsx25(
|
|
2551
2494
|
"input",
|
|
2552
2495
|
{
|
|
2553
2496
|
ref: forwardedRef,
|
|
@@ -2568,19 +2511,19 @@ var AmountInput = forwardRef3(function AmountInput2({ initialAmount, onChange },
|
|
|
2568
2511
|
return input.setCustomValidity("Invalid amount.");
|
|
2569
2512
|
}
|
|
2570
2513
|
input.setCustomValidity("");
|
|
2571
|
-
onChange(
|
|
2514
|
+
onChange(parseEther3(value));
|
|
2572
2515
|
}
|
|
2573
2516
|
}
|
|
2574
2517
|
),
|
|
2575
|
-
/* @__PURE__ */
|
|
2518
|
+
/* @__PURE__ */ jsx25("span", { className: twMerge13("flex-shrink-0 text-2xl", "peer-placeholder-shown:text-neutral-500"), children: /* @__PURE__ */ jsx25(EthIcon, {}) })
|
|
2576
2519
|
] }) });
|
|
2577
2520
|
});
|
|
2578
2521
|
|
|
2579
2522
|
// src/onboarding/deposit/SubmitButton.tsx
|
|
2580
2523
|
import { useAccount as useAccount2, useBalance as useBalance3, useSwitchChain as useSwitchChain2 } from "wagmi";
|
|
2581
2524
|
import { twMerge as twMerge14 } from "tailwind-merge";
|
|
2582
|
-
import { parseEther as
|
|
2583
|
-
import { jsx as
|
|
2525
|
+
import { parseEther as parseEther4 } from "viem";
|
|
2526
|
+
import { jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2584
2527
|
var MAX_DEPOSIT_AMOUNT = "0.1";
|
|
2585
2528
|
function SubmitButton({ amount, chainId, className, ...buttonProps }) {
|
|
2586
2529
|
const { chainId: userChainId, address: userAddress } = useAccount2();
|
|
@@ -2588,7 +2531,7 @@ function SubmitButton({ amount, chainId, className, ...buttonProps }) {
|
|
|
2588
2531
|
const shouldSwitchChain = chainId != null && chainId !== userChainId;
|
|
2589
2532
|
const switchChain = useSwitchChain2();
|
|
2590
2533
|
if (shouldSwitchChain) {
|
|
2591
|
-
return /* @__PURE__ */
|
|
2534
|
+
return /* @__PURE__ */ jsx26(
|
|
2592
2535
|
Button,
|
|
2593
2536
|
{
|
|
2594
2537
|
type: "button",
|
|
@@ -2600,23 +2543,23 @@ function SubmitButton({ amount, chainId, className, ...buttonProps }) {
|
|
|
2600
2543
|
}
|
|
2601
2544
|
);
|
|
2602
2545
|
} else if (amount) {
|
|
2603
|
-
if (amount >
|
|
2604
|
-
return /* @__PURE__ */
|
|
2546
|
+
if (amount > parseEther4(MAX_DEPOSIT_AMOUNT)) {
|
|
2547
|
+
return /* @__PURE__ */ jsxs16(Button, { type: "button", className: twMerge14("w-full", className), disabled: true, children: [
|
|
2605
2548
|
"Max amount is ",
|
|
2606
2549
|
MAX_DEPOSIT_AMOUNT,
|
|
2607
2550
|
" ETH"
|
|
2608
2551
|
] });
|
|
2609
2552
|
} else if (amount > (userBalance?.value ?? 0n)) {
|
|
2610
|
-
return /* @__PURE__ */
|
|
2553
|
+
return /* @__PURE__ */ jsx26(Button, { type: "button", className: twMerge14("w-full", className), disabled: true, children: "Insufficient balance" });
|
|
2611
2554
|
}
|
|
2612
2555
|
}
|
|
2613
|
-
return /* @__PURE__ */
|
|
2556
|
+
return /* @__PURE__ */ jsx26(Button, { type: "submit", className: twMerge14("w-full", className), ...buttonProps });
|
|
2614
2557
|
}
|
|
2615
2558
|
|
|
2616
2559
|
// src/icons/WarningIcon.tsx
|
|
2617
|
-
import { jsx as
|
|
2560
|
+
import { jsx as jsx27 } from "react/jsx-runtime";
|
|
2618
2561
|
function WarningIcon(props) {
|
|
2619
|
-
return /* @__PURE__ */
|
|
2562
|
+
return /* @__PURE__ */ jsx27(IconSVG, { fill: "none", ...props, children: /* @__PURE__ */ jsx27(
|
|
2620
2563
|
"path",
|
|
2621
2564
|
{
|
|
2622
2565
|
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",
|
|
@@ -2637,7 +2580,7 @@ function formatGas(wei) {
|
|
|
2637
2580
|
}
|
|
2638
2581
|
|
|
2639
2582
|
// src/onboarding/deposit/DepositForm.tsx
|
|
2640
|
-
import { Fragment as Fragment4, jsx as
|
|
2583
|
+
import { Fragment as Fragment4, jsx as jsx28, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
2641
2584
|
function DepositForm({
|
|
2642
2585
|
sourceChain,
|
|
2643
2586
|
setSourceChainId,
|
|
@@ -2661,10 +2604,10 @@ function DepositForm({
|
|
|
2661
2604
|
});
|
|
2662
2605
|
const minimumBalance = amount != null ? amount + (estimatedFee?.fee ?? 0n) : void 0;
|
|
2663
2606
|
const hasMinimumBalance = balance.data != null ? balance.data.value > (minimumBalance ?? 0n) : void 0;
|
|
2664
|
-
|
|
2607
|
+
useEffect10(() => {
|
|
2665
2608
|
amountInputRef.current?.focus();
|
|
2666
2609
|
}, [userChainId]);
|
|
2667
|
-
return /* @__PURE__ */
|
|
2610
|
+
return /* @__PURE__ */ jsxs17(
|
|
2668
2611
|
"form",
|
|
2669
2612
|
{
|
|
2670
2613
|
className: "flex flex-col gap-5",
|
|
@@ -2685,11 +2628,11 @@ function DepositForm({
|
|
|
2685
2628
|
}
|
|
2686
2629
|
},
|
|
2687
2630
|
children: [
|
|
2688
|
-
/* @__PURE__ */
|
|
2689
|
-
/* @__PURE__ */
|
|
2690
|
-
/* @__PURE__ */
|
|
2631
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex gap-2", children: [
|
|
2632
|
+
/* @__PURE__ */ jsx28(ChainSelect, { value: sourceChain.id, onChange: setSourceChainId }),
|
|
2633
|
+
/* @__PURE__ */ jsx28(AmountInput, { ref: amountInputRef, initialAmount: amount, onChange: setAmount })
|
|
2691
2634
|
] }),
|
|
2692
|
-
/* @__PURE__ */
|
|
2635
|
+
/* @__PURE__ */ jsxs17(
|
|
2693
2636
|
"dl",
|
|
2694
2637
|
{
|
|
2695
2638
|
className: twMerge15(
|
|
@@ -2697,21 +2640,21 @@ function DepositForm({
|
|
|
2697
2640
|
"divide-neutral-700 text-neutral-400"
|
|
2698
2641
|
),
|
|
2699
2642
|
children: [
|
|
2700
|
-
/* @__PURE__ */
|
|
2701
|
-
/* @__PURE__ */
|
|
2702
|
-
/* @__PURE__ */
|
|
2703
|
-
/* @__PURE__ */
|
|
2704
|
-
/* @__PURE__ */
|
|
2705
|
-
/* @__PURE__ */
|
|
2643
|
+
/* @__PURE__ */ jsx28("dt", { children: "Available to deposit" }),
|
|
2644
|
+
/* @__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 }),
|
|
2645
|
+
/* @__PURE__ */ jsx28("dt", { children: "Gas balance after deposit" }),
|
|
2646
|
+
/* @__PURE__ */ jsx28("dd", { children: /* @__PURE__ */ jsx28(Balance, { wei: (quarryBalance.data ?? 0n) + (amount ?? 0n) }) }),
|
|
2647
|
+
/* @__PURE__ */ jsx28("dt", { children: "Estimated fee" }),
|
|
2648
|
+
/* @__PURE__ */ jsx28("dd", { children: estimatedFee.fee ? /* @__PURE__ */ jsxs17(Fragment4, { children: [
|
|
2706
2649
|
formatGas(estimatedFee.fee),
|
|
2707
2650
|
" gwei"
|
|
2708
|
-
] }) : estimatedFee.error ? /* @__PURE__ */
|
|
2709
|
-
/* @__PURE__ */
|
|
2710
|
-
/* @__PURE__ */
|
|
2651
|
+
] }) : 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 }),
|
|
2652
|
+
/* @__PURE__ */ jsx28("dt", { children: "Time to deposit" }),
|
|
2653
|
+
/* @__PURE__ */ jsx28("dd", { children: estimatedTime })
|
|
2711
2654
|
]
|
|
2712
2655
|
}
|
|
2713
2656
|
),
|
|
2714
|
-
hasMinimumBalance ? submitButton : /* @__PURE__ */
|
|
2657
|
+
hasMinimumBalance ? submitButton : /* @__PURE__ */ jsx28(SubmitButton, { disabled: true, children: "Not enough funds" })
|
|
2715
2658
|
]
|
|
2716
2659
|
}
|
|
2717
2660
|
);
|
|
@@ -2765,7 +2708,7 @@ function useDeposits() {
|
|
|
2765
2708
|
}
|
|
2766
2709
|
|
|
2767
2710
|
// src/onboarding/deposit/DepositViaTransferForm.tsx
|
|
2768
|
-
import { jsx as
|
|
2711
|
+
import { jsx as jsx29 } from "react/jsx-runtime";
|
|
2769
2712
|
function DepositViaTransferForm({ amount, setAmount, sourceChain, setSourceChainId }) {
|
|
2770
2713
|
const { chain } = useEntryKitConfig();
|
|
2771
2714
|
const paymaster = getPaymaster(chain);
|
|
@@ -2794,7 +2737,7 @@ function DepositViaTransferForm({ amount, setAmount, sourceChain, setSourceChain
|
|
|
2794
2737
|
}),
|
|
2795
2738
|
value: amount
|
|
2796
2739
|
});
|
|
2797
|
-
const deposit =
|
|
2740
|
+
const deposit = useMutation3({
|
|
2798
2741
|
mutationKey: ["depositViaTransfer", amount?.toString()],
|
|
2799
2742
|
mutationFn: async () => {
|
|
2800
2743
|
if (!paymaster) throw new Error("Paymaster not found");
|
|
@@ -2833,7 +2776,7 @@ function DepositViaTransferForm({ amount, setAmount, sourceChain, setSourceChain
|
|
|
2833
2776
|
}
|
|
2834
2777
|
});
|
|
2835
2778
|
const estimatedFee = prepareData?.gas && gasPrice ? prepareData.gas * gasPrice : void 0;
|
|
2836
|
-
return /* @__PURE__ */
|
|
2779
|
+
return /* @__PURE__ */ jsx29(
|
|
2837
2780
|
DepositForm,
|
|
2838
2781
|
{
|
|
2839
2782
|
sourceChain,
|
|
@@ -2849,7 +2792,7 @@ function DepositViaTransferForm({ amount, setAmount, sourceChain, setSourceChain
|
|
|
2849
2792
|
onSubmit: async () => {
|
|
2850
2793
|
await deposit.mutateAsync();
|
|
2851
2794
|
},
|
|
2852
|
-
submitButton: /* @__PURE__ */
|
|
2795
|
+
submitButton: /* @__PURE__ */ jsx29(
|
|
2853
2796
|
SubmitButton,
|
|
2854
2797
|
{
|
|
2855
2798
|
variant: "primary",
|
|
@@ -2867,8 +2810,8 @@ function DepositViaTransferForm({ amount, setAmount, sourceChain, setSourceChain
|
|
|
2867
2810
|
// src/onboarding/deposit/DepositViaRelayForm.tsx
|
|
2868
2811
|
import { encodeFunctionData as encodeFunctionData3 } from "viem";
|
|
2869
2812
|
import { useAccount as useAccount5, useWalletClient } from "wagmi";
|
|
2870
|
-
import { useMutation as
|
|
2871
|
-
import { jsx as
|
|
2813
|
+
import { useMutation as useMutation4, useQuery as useQuery14 } from "@tanstack/react-query";
|
|
2814
|
+
import { jsx as jsx30 } from "react/jsx-runtime";
|
|
2872
2815
|
var ETH_ADDRESS = "0x0000000000000000000000000000000000000000";
|
|
2873
2816
|
function DepositViaRelayForm({ amount, setAmount, sourceChain, setSourceChainId }) {
|
|
2874
2817
|
const { chain, chainId: destinationChainId } = useEntryKitConfig();
|
|
@@ -2913,7 +2856,7 @@ function DepositViaRelayForm({ amount, setAmount, sourceChain, setSourceChainId
|
|
|
2913
2856
|
refetchInterval: 15e3,
|
|
2914
2857
|
enabled: !!amount && !!userAddress && !!relayClient
|
|
2915
2858
|
});
|
|
2916
|
-
const deposit =
|
|
2859
|
+
const deposit = useMutation4({
|
|
2917
2860
|
mutationKey: ["depositViaRelay", sourceChain.id, amount?.toString()],
|
|
2918
2861
|
mutationFn: async ({ quote: quote2, amount: amount2 }) => {
|
|
2919
2862
|
if (!relayClient) throw new Error("No Relay client found.");
|
|
@@ -2954,7 +2897,7 @@ function DepositViaRelayForm({ amount, setAmount, sourceChain, setSourceChainId
|
|
|
2954
2897
|
const gasFee = BigInt(fees?.gas?.amount ?? 0);
|
|
2955
2898
|
const relayerFee = BigInt(fees?.relayer?.amount ?? 0);
|
|
2956
2899
|
const fee = gasFee + relayerFee;
|
|
2957
|
-
return /* @__PURE__ */
|
|
2900
|
+
return /* @__PURE__ */ jsx30(
|
|
2958
2901
|
DepositForm,
|
|
2959
2902
|
{
|
|
2960
2903
|
sourceChain,
|
|
@@ -2971,7 +2914,7 @@ function DepositViaRelayForm({ amount, setAmount, sourceChain, setSourceChainId
|
|
|
2971
2914
|
if (!quote.data || !amount) return;
|
|
2972
2915
|
await deposit.mutateAsync({ quote: quote.data, amount });
|
|
2973
2916
|
},
|
|
2974
|
-
submitButton: /* @__PURE__ */
|
|
2917
|
+
submitButton: /* @__PURE__ */ jsx30(
|
|
2975
2918
|
SubmitButton,
|
|
2976
2919
|
{
|
|
2977
2920
|
variant: "primary",
|
|
@@ -2987,20 +2930,20 @@ function DepositViaRelayForm({ amount, setAmount, sourceChain, setSourceChainId
|
|
|
2987
2930
|
}
|
|
2988
2931
|
|
|
2989
2932
|
// src/onboarding/deposit/Deposits.tsx
|
|
2990
|
-
import { useEffect as
|
|
2991
|
-
import { useQuery as useQuery17, useQueryClient as
|
|
2933
|
+
import { useEffect as useEffect12 } from "react";
|
|
2934
|
+
import { useQuery as useQuery17, useQueryClient as useQueryClient7 } from "@tanstack/react-query";
|
|
2992
2935
|
|
|
2993
2936
|
// src/onboarding/deposit/TransferDepositStatus.tsx
|
|
2994
2937
|
import { useQuery as useQuery15 } from "@tanstack/react-query";
|
|
2995
2938
|
|
|
2996
2939
|
// src/onboarding/deposit/DepositStatus.tsx
|
|
2997
|
-
import { useEffect as
|
|
2940
|
+
import { useEffect as useEffect11, useState as useState3 } from "react";
|
|
2998
2941
|
import { twMerge as twMerge16 } from "tailwind-merge";
|
|
2999
2942
|
|
|
3000
2943
|
// src/icons/CloseIcon.tsx
|
|
3001
|
-
import { jsx as
|
|
2944
|
+
import { jsx as jsx31 } from "react/jsx-runtime";
|
|
3002
2945
|
function CloseIcon(props) {
|
|
3003
|
-
return /* @__PURE__ */
|
|
2946
|
+
return /* @__PURE__ */ jsx31(IconSVG, { strokeWidth: "2", stroke: "currentColor", ...props, children: /* @__PURE__ */ jsx31(
|
|
3004
2947
|
"path",
|
|
3005
2948
|
{
|
|
3006
2949
|
d: "M6 18L18 6M6 6L18 18",
|
|
@@ -3014,18 +2957,18 @@ function CloseIcon(props) {
|
|
|
3014
2957
|
}
|
|
3015
2958
|
|
|
3016
2959
|
// src/onboarding/deposit/DepositStatus.tsx
|
|
3017
|
-
import { jsx as
|
|
2960
|
+
import { jsx as jsx32, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
3018
2961
|
function DepositStatus({ status, progress, children, onDismiss }) {
|
|
3019
2962
|
const [appear, setAppear] = useState3(false);
|
|
3020
|
-
|
|
2963
|
+
useEffect11(() => {
|
|
3021
2964
|
setAppear(true);
|
|
3022
2965
|
}, []);
|
|
3023
|
-
return /* @__PURE__ */
|
|
3024
|
-
/* @__PURE__ */
|
|
3025
|
-
/* @__PURE__ */
|
|
3026
|
-
/* @__PURE__ */
|
|
3027
|
-
/* @__PURE__ */
|
|
3028
|
-
/* @__PURE__ */
|
|
2966
|
+
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: [
|
|
2967
|
+
/* @__PURE__ */ jsxs18("div", { className: "py-1 text-sm flex items-center gap-2", children: [
|
|
2968
|
+
/* @__PURE__ */ jsx32("div", { className: "flex-grow", children }),
|
|
2969
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex-shrink-0 grid", children: [
|
|
2970
|
+
/* @__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" }) }),
|
|
2971
|
+
/* @__PURE__ */ jsx32(
|
|
3029
2972
|
"button",
|
|
3030
2973
|
{
|
|
3031
2974
|
type: "button",
|
|
@@ -3037,12 +2980,12 @@ function DepositStatus({ status, progress, children, onDismiss }) {
|
|
|
3037
2980
|
),
|
|
3038
2981
|
title: "Dismiss",
|
|
3039
2982
|
onClick: onDismiss,
|
|
3040
|
-
children: /* @__PURE__ */
|
|
2983
|
+
children: /* @__PURE__ */ jsx32(CloseIcon, {})
|
|
3041
2984
|
}
|
|
3042
2985
|
)
|
|
3043
2986
|
] })
|
|
3044
2987
|
] }),
|
|
3045
|
-
/* @__PURE__ */
|
|
2988
|
+
/* @__PURE__ */ jsx32("div", { className: "w-full h-[2px] -mt-full overflow-clip", children: /* @__PURE__ */ jsx32(
|
|
3046
2989
|
"div",
|
|
3047
2990
|
{
|
|
3048
2991
|
className: twMerge16(
|
|
@@ -3062,7 +3005,7 @@ function DepositStatus({ status, progress, children, onDismiss }) {
|
|
|
3062
3005
|
|
|
3063
3006
|
// src/onboarding/deposit/TransferDepositStatus.tsx
|
|
3064
3007
|
import { useChains as useChains2 } from "wagmi";
|
|
3065
|
-
import { Fragment as Fragment5, jsx as
|
|
3008
|
+
import { Fragment as Fragment5, jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
3066
3009
|
function TransferDepositStatus({
|
|
3067
3010
|
amount,
|
|
3068
3011
|
chainL1Id,
|
|
@@ -3078,7 +3021,7 @@ function TransferDepositStatus({
|
|
|
3078
3021
|
queryKey: ["transferDepositStatus", hash],
|
|
3079
3022
|
queryFn: () => receiptPromise
|
|
3080
3023
|
});
|
|
3081
|
-
return /* @__PURE__ */
|
|
3024
|
+
return /* @__PURE__ */ jsx33(
|
|
3082
3025
|
DepositStatus,
|
|
3083
3026
|
{
|
|
3084
3027
|
status: receipt.status,
|
|
@@ -3090,10 +3033,10 @@ function TransferDepositStatus({
|
|
|
3090
3033
|
children: (() => {
|
|
3091
3034
|
const blockExplorer = chain.blockExplorers?.default.url;
|
|
3092
3035
|
if (receipt.status === "pending") {
|
|
3093
|
-
return /* @__PURE__ */
|
|
3036
|
+
return /* @__PURE__ */ jsxs19(Fragment5, { children: [
|
|
3094
3037
|
"Confirming deposit on",
|
|
3095
3038
|
" ",
|
|
3096
|
-
/* @__PURE__ */
|
|
3039
|
+
/* @__PURE__ */ jsx33(
|
|
3097
3040
|
"a",
|
|
3098
3041
|
{
|
|
3099
3042
|
href: blockExplorer ? `${blockExplorer}/tx/${hash}` : void 0,
|
|
@@ -3106,10 +3049,10 @@ function TransferDepositStatus({
|
|
|
3106
3049
|
] });
|
|
3107
3050
|
}
|
|
3108
3051
|
if (receipt.status === "error") {
|
|
3109
|
-
return /* @__PURE__ */
|
|
3052
|
+
return /* @__PURE__ */ jsxs19(Fragment5, { children: [
|
|
3110
3053
|
"Could not find deposit on",
|
|
3111
3054
|
" ",
|
|
3112
|
-
/* @__PURE__ */
|
|
3055
|
+
/* @__PURE__ */ jsx33(
|
|
3113
3056
|
"a",
|
|
3114
3057
|
{
|
|
3115
3058
|
href: blockExplorer ? `${blockExplorer}/tx/${hash}` : void 0,
|
|
@@ -3121,10 +3064,10 @@ function TransferDepositStatus({
|
|
|
3121
3064
|
"."
|
|
3122
3065
|
] });
|
|
3123
3066
|
}
|
|
3124
|
-
return /* @__PURE__ */
|
|
3067
|
+
return /* @__PURE__ */ jsxs19(Fragment5, { children: [
|
|
3125
3068
|
"Successfully",
|
|
3126
3069
|
" ",
|
|
3127
|
-
/* @__PURE__ */
|
|
3070
|
+
/* @__PURE__ */ jsx33(
|
|
3128
3071
|
"a",
|
|
3129
3072
|
{
|
|
3130
3073
|
href: blockExplorer ? `${blockExplorer}/tx/${receipt.data.transactionHash}` : void 0,
|
|
@@ -3134,7 +3077,7 @@ function TransferDepositStatus({
|
|
|
3134
3077
|
}
|
|
3135
3078
|
),
|
|
3136
3079
|
" ",
|
|
3137
|
-
/* @__PURE__ */
|
|
3080
|
+
/* @__PURE__ */ jsx33(Balance, { wei: amount })
|
|
3138
3081
|
] });
|
|
3139
3082
|
})()
|
|
3140
3083
|
}
|
|
@@ -3144,7 +3087,7 @@ function TransferDepositStatus({
|
|
|
3144
3087
|
// src/onboarding/deposit/RelayDepositStatus.tsx
|
|
3145
3088
|
import { useQuery as useQuery16 } from "@tanstack/react-query";
|
|
3146
3089
|
import { useChains as useChains3 } from "wagmi";
|
|
3147
|
-
import { Fragment as Fragment6, jsx as
|
|
3090
|
+
import { Fragment as Fragment6, jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
3148
3091
|
function RelayDepositStatus({
|
|
3149
3092
|
amount,
|
|
3150
3093
|
chainL1Id,
|
|
@@ -3161,7 +3104,7 @@ function RelayDepositStatus({
|
|
|
3161
3104
|
queryKey: ["relayDepositPromise", chainL1Id, chainL2Id, amount.toString(), start.toISOString()],
|
|
3162
3105
|
queryFn: () => depositPromise
|
|
3163
3106
|
});
|
|
3164
|
-
return /* @__PURE__ */
|
|
3107
|
+
return /* @__PURE__ */ jsx34(
|
|
3165
3108
|
DepositStatus,
|
|
3166
3109
|
{
|
|
3167
3110
|
status: deposit.status,
|
|
@@ -3172,22 +3115,22 @@ function RelayDepositStatus({
|
|
|
3172
3115
|
onDismiss,
|
|
3173
3116
|
children: (() => {
|
|
3174
3117
|
if (deposit.status === "pending") {
|
|
3175
|
-
return /* @__PURE__ */
|
|
3118
|
+
return /* @__PURE__ */ jsxs20(Fragment6, { children: [
|
|
3176
3119
|
"Relay bridge deposit pending on ",
|
|
3177
3120
|
chainL1.name,
|
|
3178
3121
|
"\u2026"
|
|
3179
3122
|
] });
|
|
3180
3123
|
}
|
|
3181
3124
|
if (deposit.status === "error") {
|
|
3182
|
-
return /* @__PURE__ */
|
|
3125
|
+
return /* @__PURE__ */ jsxs20(Fragment6, { children: [
|
|
3183
3126
|
"Relay bridge deposit to ",
|
|
3184
3127
|
chainL2.name,
|
|
3185
3128
|
" failed."
|
|
3186
3129
|
] });
|
|
3187
3130
|
}
|
|
3188
|
-
return /* @__PURE__ */
|
|
3131
|
+
return /* @__PURE__ */ jsxs20(Fragment6, { children: [
|
|
3189
3132
|
"Successfully bridged ",
|
|
3190
|
-
/* @__PURE__ */
|
|
3133
|
+
/* @__PURE__ */ jsx34(Balance, { wei: amount }),
|
|
3191
3134
|
" to ",
|
|
3192
3135
|
chainL2.name,
|
|
3193
3136
|
"!"
|
|
@@ -3199,9 +3142,9 @@ function RelayDepositStatus({
|
|
|
3199
3142
|
|
|
3200
3143
|
// src/onboarding/deposit/Deposits.tsx
|
|
3201
3144
|
import { useAccount as useAccount6, useClient as useClient11 } from "wagmi";
|
|
3202
|
-
import { jsx as
|
|
3145
|
+
import { jsx as jsx35 } from "react/jsx-runtime";
|
|
3203
3146
|
function Deposits() {
|
|
3204
|
-
const queryClient =
|
|
3147
|
+
const queryClient = useQueryClient7();
|
|
3205
3148
|
const { chainId } = useEntryKitConfig();
|
|
3206
3149
|
const client = useClient11({ chainId });
|
|
3207
3150
|
const { address: userAddress } = useAccount6();
|
|
@@ -3214,24 +3157,24 @@ function Deposits() {
|
|
|
3214
3157
|
return true;
|
|
3215
3158
|
}
|
|
3216
3159
|
});
|
|
3217
|
-
|
|
3160
|
+
useEffect12(() => {
|
|
3218
3161
|
if (isComplete) {
|
|
3219
3162
|
queryClient.invalidateQueries({ queryKey: ["balance"] });
|
|
3220
3163
|
queryClient.invalidateQueries({ queryKey: ["getBalance", client?.uid, userAddress] });
|
|
3221
3164
|
}
|
|
3222
3165
|
}, [client?.uid, isComplete, queryClient, userAddress]);
|
|
3223
3166
|
if (!deposits.length) return null;
|
|
3224
|
-
return /* @__PURE__ */
|
|
3167
|
+
return /* @__PURE__ */ jsx35("div", { className: "flex flex-col gap-1 mt-4", children: deposits.map((deposit) => {
|
|
3225
3168
|
if (deposit.type === "transfer") {
|
|
3226
|
-
return /* @__PURE__ */
|
|
3169
|
+
return /* @__PURE__ */ jsx35(TransferDepositStatus, { ...deposit, onDismiss: () => removeDeposit(deposit.uid) }, deposit.uid);
|
|
3227
3170
|
} else if (deposit.type === "relay") {
|
|
3228
|
-
return /* @__PURE__ */
|
|
3171
|
+
return /* @__PURE__ */ jsx35(RelayDepositStatus, { ...deposit, onDismiss: () => removeDeposit(deposit.uid) }, deposit.uid);
|
|
3229
3172
|
}
|
|
3230
3173
|
}) });
|
|
3231
3174
|
}
|
|
3232
3175
|
|
|
3233
3176
|
// src/onboarding/deposit/DepositFormContainer.tsx
|
|
3234
|
-
import { jsx as
|
|
3177
|
+
import { jsx as jsx36, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
3235
3178
|
function DepositFormContainer() {
|
|
3236
3179
|
const { chainId: destinationChainId } = useEntryKitConfig();
|
|
3237
3180
|
const chainId = useChainId();
|
|
@@ -3239,8 +3182,8 @@ function DepositFormContainer() {
|
|
|
3239
3182
|
const [amount, setAmount] = useState4(void 0);
|
|
3240
3183
|
const [sourceChainId, setSourceChainId] = useState4(chainId);
|
|
3241
3184
|
const sourceChain = chains.find(({ id }) => id === sourceChainId);
|
|
3242
|
-
return /* @__PURE__ */
|
|
3243
|
-
destinationChainId === sourceChainId ? /* @__PURE__ */
|
|
3185
|
+
return /* @__PURE__ */ jsxs21("div", { className: "pt-10 pb-2", children: [
|
|
3186
|
+
destinationChainId === sourceChainId ? /* @__PURE__ */ jsx36(
|
|
3244
3187
|
DepositViaTransferForm,
|
|
3245
3188
|
{
|
|
3246
3189
|
amount,
|
|
@@ -3248,7 +3191,7 @@ function DepositFormContainer() {
|
|
|
3248
3191
|
sourceChain,
|
|
3249
3192
|
setSourceChainId
|
|
3250
3193
|
}
|
|
3251
|
-
) : /* @__PURE__ */
|
|
3194
|
+
) : /* @__PURE__ */ jsx36(
|
|
3252
3195
|
DepositViaRelayForm,
|
|
3253
3196
|
{
|
|
3254
3197
|
amount,
|
|
@@ -3257,14 +3200,14 @@ function DepositFormContainer() {
|
|
|
3257
3200
|
setSourceChainId
|
|
3258
3201
|
}
|
|
3259
3202
|
),
|
|
3260
|
-
/* @__PURE__ */
|
|
3203
|
+
/* @__PURE__ */ jsx36(Deposits, {})
|
|
3261
3204
|
] });
|
|
3262
3205
|
}
|
|
3263
3206
|
|
|
3264
3207
|
// src/icons/ArrowLeftIcon.tsx
|
|
3265
|
-
import { jsx as
|
|
3208
|
+
import { jsx as jsx37 } from "react/jsx-runtime";
|
|
3266
3209
|
function ArrowLeftIcon(props) {
|
|
3267
|
-
return /* @__PURE__ */
|
|
3210
|
+
return /* @__PURE__ */ jsx37(IconSVG, { ...props, children: /* @__PURE__ */ jsx37(
|
|
3268
3211
|
"path",
|
|
3269
3212
|
{
|
|
3270
3213
|
d: "M19 12H5M12 19l-7-7 7-7",
|
|
@@ -3282,20 +3225,20 @@ import { getAction as getAction6 } from "viem/utils";
|
|
|
3282
3225
|
import { waitForTransactionReceipt as waitForTransactionReceipt3 } from "viem/actions";
|
|
3283
3226
|
import { useAccount as useAccount7, useClient as useClient12, useSwitchChain as useSwitchChain3, useWriteContract as useWriteContract2 } from "wagmi";
|
|
3284
3227
|
import { twMerge as twMerge17 } from "tailwind-merge";
|
|
3285
|
-
import { useMutation as
|
|
3286
|
-
import { useQueryClient as
|
|
3287
|
-
import { jsx as
|
|
3228
|
+
import { useMutation as useMutation5 } from "@tanstack/react-query";
|
|
3229
|
+
import { useQueryClient as useQueryClient8 } from "@tanstack/react-query";
|
|
3230
|
+
import { jsx as jsx38, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
3288
3231
|
function WithdrawGasBalanceButton({ userAddress }) {
|
|
3289
3232
|
const { writeContractAsync } = useWriteContract2();
|
|
3290
3233
|
const { switchChain } = useSwitchChain3();
|
|
3291
3234
|
const { chain, chainId } = useEntryKitConfig();
|
|
3292
3235
|
const { chainId: userChainId } = useAccount7();
|
|
3293
|
-
const queryClient =
|
|
3236
|
+
const queryClient = useQueryClient8();
|
|
3294
3237
|
const client = useClient12({ chainId });
|
|
3295
3238
|
const paymaster = getPaymaster(chain);
|
|
3296
3239
|
const balance = useShowQueryError(useBalance(userAddress));
|
|
3297
3240
|
const shouldSwitchChain = chainId != null && chainId !== userChainId;
|
|
3298
|
-
const withdraw =
|
|
3241
|
+
const withdraw = useMutation5({
|
|
3299
3242
|
mutationKey: ["withdraw", userAddress],
|
|
3300
3243
|
mutationFn: async () => {
|
|
3301
3244
|
if (!client) throw new Error("Client not ready.");
|
|
@@ -3324,7 +3267,7 @@ function WithdrawGasBalanceButton({ userAddress }) {
|
|
|
3324
3267
|
if (balance.data == null || balance.data === 0n) {
|
|
3325
3268
|
return null;
|
|
3326
3269
|
}
|
|
3327
|
-
return /* @__PURE__ */
|
|
3270
|
+
return /* @__PURE__ */ jsx38(
|
|
3328
3271
|
"button",
|
|
3329
3272
|
{
|
|
3330
3273
|
onClick: () => {
|
|
@@ -3338,8 +3281,8 @@ function WithdrawGasBalanceButton({ userAddress }) {
|
|
|
3338
3281
|
withdraw.isPending ? "opacity-50 pointer-events-none" : "cursor-pointer hover:text-white"
|
|
3339
3282
|
),
|
|
3340
3283
|
disabled: withdraw.isPending,
|
|
3341
|
-
children: /* @__PURE__ */
|
|
3342
|
-
/* @__PURE__ */
|
|
3284
|
+
children: /* @__PURE__ */ jsxs22("span", { className: "inline-block", children: [
|
|
3285
|
+
/* @__PURE__ */ jsxs22(
|
|
3343
3286
|
"span",
|
|
3344
3287
|
{
|
|
3345
3288
|
className: twMerge17(
|
|
@@ -3348,76 +3291,160 @@ function WithdrawGasBalanceButton({ userAddress }) {
|
|
|
3348
3291
|
shouldSwitchChain && "group-hover:hidden"
|
|
3349
3292
|
),
|
|
3350
3293
|
children: [
|
|
3351
|
-
withdraw.isPending && /* @__PURE__ */
|
|
3294
|
+
withdraw.isPending && /* @__PURE__ */ jsx38(PendingIcon, { className: "w-3 h-3" }),
|
|
3352
3295
|
"Withdraw"
|
|
3353
3296
|
]
|
|
3354
3297
|
}
|
|
3355
3298
|
),
|
|
3356
|
-
shouldSwitchChain && /* @__PURE__ */
|
|
3299
|
+
shouldSwitchChain && /* @__PURE__ */ jsx38("span", { className: "hidden group-hover:inline-block underline decoration-neutral-500 underline-offset-4 hover:decoration-orange-500", children: "Switch chain" })
|
|
3357
3300
|
] })
|
|
3358
3301
|
}
|
|
3359
3302
|
);
|
|
3360
3303
|
}
|
|
3361
3304
|
|
|
3305
|
+
// src/onboarding/quarry/useRequestAllowance.ts
|
|
3306
|
+
import { useMutation as useMutation6, useQueryClient as useQueryClient9 } from "@tanstack/react-query";
|
|
3307
|
+
|
|
3308
|
+
// src/quarry/transports/quarrySponsor.ts
|
|
3309
|
+
import { http as http2 } from "viem";
|
|
3310
|
+
function quarrySponsor() {
|
|
3311
|
+
return ({ chain }) => {
|
|
3312
|
+
if (!chain) throw new Error("No chain provided to quarrySponsor transport.");
|
|
3313
|
+
const url = "quarrySponsor" in chain.rpcUrls ? chain.rpcUrls.quarrySponsor.http[0] : void 0;
|
|
3314
|
+
if (!url) throw new Error(`No \`quarrySponsor\` RPC URL found for chain ${chain.id}.`);
|
|
3315
|
+
return http2(url)({ chain, retryCount: 0 });
|
|
3316
|
+
};
|
|
3317
|
+
}
|
|
3318
|
+
|
|
3319
|
+
// src/quarry/requestAllowance.ts
|
|
3320
|
+
async function requestAllowance({ chain, userAddress }) {
|
|
3321
|
+
const transport = quarrySponsor()({ chain });
|
|
3322
|
+
debug2("Requesting allowance for", userAddress);
|
|
3323
|
+
await transport.request({
|
|
3324
|
+
method: "sponsor_requestAllowance",
|
|
3325
|
+
params: [userAddress]
|
|
3326
|
+
});
|
|
3327
|
+
}
|
|
3328
|
+
|
|
3329
|
+
// src/onboarding/quarry/useRequestAllowance.ts
|
|
3330
|
+
function useRequestAllowance() {
|
|
3331
|
+
const queryClient = useQueryClient9();
|
|
3332
|
+
const { chain } = useEntryKitConfig();
|
|
3333
|
+
const mutationKey = ["requestAllowance", chain.id];
|
|
3334
|
+
return useMutation6({
|
|
3335
|
+
retry: 0,
|
|
3336
|
+
mutationKey,
|
|
3337
|
+
mutationFn: async (userAddress) => {
|
|
3338
|
+
await requestAllowance({ chain, userAddress });
|
|
3339
|
+
await Promise.all([
|
|
3340
|
+
queryClient.invalidateQueries({ queryKey: ["getAllowance"] }),
|
|
3341
|
+
queryClient.invalidateQueries({ queryKey: ["getFunds"] }),
|
|
3342
|
+
queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] })
|
|
3343
|
+
]);
|
|
3344
|
+
}
|
|
3345
|
+
});
|
|
3346
|
+
}
|
|
3347
|
+
|
|
3362
3348
|
// src/onboarding/quarry/GasBalance.tsx
|
|
3363
|
-
import { jsx as
|
|
3364
|
-
function GasBalance2({ isActive, isExpanded, isFocused, setFocused, userAddress }) {
|
|
3349
|
+
import { jsx as jsx39, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
3350
|
+
function GasBalance2({ isActive, isExpanded, isFocused, setFocused, userAddress, paymaster }) {
|
|
3365
3351
|
const queryClient = useQueryClient10();
|
|
3366
3352
|
const balance = useShowQueryError(useBalance(userAddress));
|
|
3367
3353
|
const prevBalance = usePrevious(balance.data || 0n);
|
|
3368
|
-
|
|
3354
|
+
const allowance = useShowQueryError(useAllowance(userAddress));
|
|
3355
|
+
const prevAllowance = usePrevious(allowance.data || 0n);
|
|
3356
|
+
const requestAllowance2 = useRequestAllowance();
|
|
3357
|
+
useEffect13(() => {
|
|
3369
3358
|
if (balance.data != null && prevBalance === 0n && balance.data > 0n) {
|
|
3370
3359
|
queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] });
|
|
3371
3360
|
setFocused(false);
|
|
3372
3361
|
}
|
|
3373
3362
|
}, [balance.data, prevBalance, setFocused, queryClient, userAddress]);
|
|
3363
|
+
useEffect13(() => {
|
|
3364
|
+
if (allowance.data != null && prevAllowance === 0n && allowance.data > 0n) {
|
|
3365
|
+
queryClient.invalidateQueries({ queryKey: ["getPrerequisites"] });
|
|
3366
|
+
setFocused(false);
|
|
3367
|
+
}
|
|
3368
|
+
}, [allowance.data, prevAllowance, setFocused, queryClient, userAddress]);
|
|
3369
|
+
const gasBalance = balance.data != null && allowance.data != null ? balance.data + allowance.data : null;
|
|
3370
|
+
useEffect13(() => {
|
|
3371
|
+
if (!isActive) return;
|
|
3372
|
+
if (!paymaster.canSponsor) return;
|
|
3373
|
+
if (gasBalance !== 0n) return;
|
|
3374
|
+
if (requestAllowance2.status !== "idle") return;
|
|
3375
|
+
const timer = setTimeout(() => {
|
|
3376
|
+
console.log("no funds, requesting allowance");
|
|
3377
|
+
requestAllowance2.mutate(userAddress, {
|
|
3378
|
+
onSuccess(data) {
|
|
3379
|
+
console.log("got allowance", data);
|
|
3380
|
+
},
|
|
3381
|
+
onError(error2) {
|
|
3382
|
+
console.log("failed to get allowance", error2);
|
|
3383
|
+
}
|
|
3384
|
+
});
|
|
3385
|
+
});
|
|
3386
|
+
return () => clearTimeout(timer);
|
|
3387
|
+
}, [isActive, paymaster.canSponsor, gasBalance, requestAllowance2, userAddress]);
|
|
3374
3388
|
if (isFocused) {
|
|
3375
|
-
return /* @__PURE__ */
|
|
3376
|
-
isFocused && /* @__PURE__ */
|
|
3389
|
+
return /* @__PURE__ */ jsxs23("div", { children: [
|
|
3390
|
+
isFocused && /* @__PURE__ */ jsx39("div", { className: "absolute top-0 left-0", children: /* @__PURE__ */ jsx39(
|
|
3377
3391
|
"div",
|
|
3378
3392
|
{
|
|
3379
3393
|
className: "flex items-center justify-center w-10 h-10 text-white/20 hover:text-white/40 cursor-pointer",
|
|
3380
3394
|
onClick: () => setFocused(false),
|
|
3381
|
-
children: /* @__PURE__ */
|
|
3395
|
+
children: /* @__PURE__ */ jsx39(ArrowLeftIcon, { className: "m-0" })
|
|
3382
3396
|
}
|
|
3383
3397
|
) }),
|
|
3384
|
-
/* @__PURE__ */
|
|
3398
|
+
/* @__PURE__ */ jsx39(DepositFormContainer, {})
|
|
3385
3399
|
] });
|
|
3386
3400
|
}
|
|
3387
|
-
return /* @__PURE__ */
|
|
3388
|
-
/* @__PURE__ */
|
|
3389
|
-
/* @__PURE__ */
|
|
3390
|
-
/* @__PURE__ */
|
|
3391
|
-
/* @__PURE__ */
|
|
3401
|
+
return /* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-4", children: [
|
|
3402
|
+
/* @__PURE__ */ jsxs23("div", { className: "flex justify-between gap-4", children: [
|
|
3403
|
+
/* @__PURE__ */ jsxs23("div", { children: [
|
|
3404
|
+
/* @__PURE__ */ jsx39("div", { children: "Gas balance" }),
|
|
3405
|
+
/* @__PURE__ */ jsx39("div", { className: "font-mono text-white", children: gasBalance != null ? /* @__PURE__ */ jsx39(Balance, { wei: gasBalance }) : /* @__PURE__ */ jsx39(PendingIcon, { className: "text-sm" }) })
|
|
3392
3406
|
] }),
|
|
3393
|
-
/* @__PURE__ */
|
|
3394
|
-
/* @__PURE__ */
|
|
3407
|
+
/* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-1 justify-center items-center", children: [
|
|
3408
|
+
/* @__PURE__ */ jsx39(
|
|
3395
3409
|
Button,
|
|
3396
3410
|
{
|
|
3397
3411
|
variant: isActive ? "primary" : "tertiary",
|
|
3398
3412
|
className: "flex-shrink-0 text-sm p-1 w-28",
|
|
3399
3413
|
autoFocus: isActive || isExpanded,
|
|
3400
|
-
pending: balance.status === "pending",
|
|
3414
|
+
pending: balance.status === "pending" || allowance.status === "pending" || requestAllowance2.status === "pending",
|
|
3401
3415
|
onClick: () => setFocused(true),
|
|
3402
3416
|
children: "Top up"
|
|
3403
3417
|
}
|
|
3404
3418
|
),
|
|
3405
|
-
/* @__PURE__ */
|
|
3419
|
+
/* @__PURE__ */ jsx39(WithdrawGasBalanceButton, { userAddress })
|
|
3406
3420
|
] })
|
|
3407
3421
|
] }),
|
|
3408
|
-
isExpanded ? /* @__PURE__ */
|
|
3422
|
+
isExpanded ? /* @__PURE__ */ jsxs23("div", { className: "text-sm space-y-2", children: [
|
|
3423
|
+
/* @__PURE__ */ jsx39("p", { children: "Your gas balance is used to pay for onchain computation." }),
|
|
3424
|
+
/* @__PURE__ */ jsxs23("p", { children: [
|
|
3425
|
+
"You have",
|
|
3426
|
+
" ",
|
|
3427
|
+
/* @__PURE__ */ jsx39("span", { className: "font-mono", children: balance.data != null ? /* @__PURE__ */ jsx39(Balance, { wei: balance.data }) : /* @__PURE__ */ jsx39(PendingIcon, { className: "text-sm" }) }),
|
|
3428
|
+
" ",
|
|
3429
|
+
"in gas deposits and",
|
|
3430
|
+
" ",
|
|
3431
|
+
/* @__PURE__ */ jsx39("span", { className: "font-mono", children: allowance.data != null ? /* @__PURE__ */ jsx39(Balance, { wei: allowance.data }) : /* @__PURE__ */ jsx39(PendingIcon, { className: "text-sm" }) }),
|
|
3432
|
+
" ",
|
|
3433
|
+
"in gas grants."
|
|
3434
|
+
] })
|
|
3435
|
+
] }) : null
|
|
3409
3436
|
] });
|
|
3410
3437
|
}
|
|
3411
3438
|
|
|
3412
3439
|
// src/onboarding/ConnectedSteps.tsx
|
|
3413
|
-
import { jsx as
|
|
3440
|
+
import { jsx as jsx40 } from "react/jsx-runtime";
|
|
3414
3441
|
function ConnectedSteps({ connector, userClient, initialUserAddress }) {
|
|
3415
3442
|
const { chain } = useEntryKitConfig();
|
|
3416
3443
|
const paymaster = getPaymaster(chain);
|
|
3417
3444
|
const [focusedId, setFocusedId] = useState5(null);
|
|
3418
3445
|
const userAddress = userClient.account.address;
|
|
3419
3446
|
const { data: prerequisites, error: prerequisitesError } = usePrerequisites(userAddress);
|
|
3420
|
-
|
|
3447
|
+
useEffect14(() => {
|
|
3421
3448
|
if (prerequisitesError) {
|
|
3422
3449
|
console.error("Could not get prerequisites", prerequisitesError);
|
|
3423
3450
|
}
|
|
@@ -3425,7 +3452,7 @@ function ConnectedSteps({ connector, userClient, initialUserAddress }) {
|
|
|
3425
3452
|
const { closeAccountModal } = useAccountModal();
|
|
3426
3453
|
const isNewConnection = userAddress !== initialUserAddress;
|
|
3427
3454
|
const initialPrerequisites = useRef5(prerequisites);
|
|
3428
|
-
|
|
3455
|
+
useEffect14(() => {
|
|
3429
3456
|
if (prerequisites == null) return;
|
|
3430
3457
|
if (initialPrerequisites.current == null) {
|
|
3431
3458
|
initialPrerequisites.current = prerequisites;
|
|
@@ -3451,7 +3478,7 @@ function ConnectedSteps({ connector, userClient, initialUserAddress }) {
|
|
|
3451
3478
|
{
|
|
3452
3479
|
id: "wallet",
|
|
3453
3480
|
isComplete: true,
|
|
3454
|
-
content: (props) => /* @__PURE__ */
|
|
3481
|
+
content: (props) => /* @__PURE__ */ jsx40(Wallet, { ...props, userAddress })
|
|
3455
3482
|
}
|
|
3456
3483
|
];
|
|
3457
3484
|
if (!paymaster) {
|
|
@@ -3459,28 +3486,20 @@ function ConnectedSteps({ connector, userClient, initialUserAddress }) {
|
|
|
3459
3486
|
steps2.push({
|
|
3460
3487
|
id: "gasBalance",
|
|
3461
3488
|
isComplete: !!hasGasBalance,
|
|
3462
|
-
content: (props) => /* @__PURE__ */
|
|
3489
|
+
content: (props) => /* @__PURE__ */ jsx40(GasBalance, { ...props, sessionAddress })
|
|
3463
3490
|
});
|
|
3464
3491
|
}
|
|
3465
3492
|
} else if (paymaster.type === "quarry") {
|
|
3466
|
-
|
|
3467
|
-
|
|
3468
|
-
|
|
3469
|
-
|
|
3470
|
-
|
|
3471
|
-
});
|
|
3472
|
-
} else {
|
|
3473
|
-
steps2.push({
|
|
3474
|
-
id: "gasBalanceQuarry",
|
|
3475
|
-
isComplete: !!hasQuarryGasBalance,
|
|
3476
|
-
content: (props) => /* @__PURE__ */ jsx41(GasBalance2, { ...props, userAddress })
|
|
3477
|
-
});
|
|
3478
|
-
}
|
|
3493
|
+
steps2.push({
|
|
3494
|
+
id: "gasBalanceQuarry",
|
|
3495
|
+
isComplete: !!hasQuarryGasBalance || !!hasAllowance,
|
|
3496
|
+
content: (props) => /* @__PURE__ */ jsx40(GasBalance2, { ...props, userAddress, paymaster })
|
|
3497
|
+
});
|
|
3479
3498
|
}
|
|
3480
3499
|
steps2.push({
|
|
3481
3500
|
id: "session",
|
|
3482
3501
|
isComplete: !!isSpender && !!hasDelegation,
|
|
3483
|
-
content: (props) => /* @__PURE__ */
|
|
3502
|
+
content: (props) => /* @__PURE__ */ jsx40(
|
|
3484
3503
|
Session,
|
|
3485
3504
|
{
|
|
3486
3505
|
...props,
|
|
@@ -3509,7 +3528,7 @@ function ConnectedSteps({ connector, userClient, initialUserAddress }) {
|
|
|
3509
3528
|
const completedSteps = steps.filter((step) => step.isComplete);
|
|
3510
3529
|
const activeStep = (selectedStepId != null ? steps.find((step) => step.id === selectedStepId) : null) ?? nextStep ?? (completedSteps.length < steps.length ? completedSteps.at(-1) : null);
|
|
3511
3530
|
const activeStepIndex = activeStep ? steps.indexOf(activeStep) : -1;
|
|
3512
|
-
return /* @__PURE__ */
|
|
3531
|
+
return /* @__PURE__ */ jsx40(
|
|
3513
3532
|
"div",
|
|
3514
3533
|
{
|
|
3515
3534
|
className: twMerge18(
|
|
@@ -3534,7 +3553,7 @@ function ConnectedSteps({ connector, userClient, initialUserAddress }) {
|
|
|
3534
3553
|
}
|
|
3535
3554
|
return null;
|
|
3536
3555
|
}
|
|
3537
|
-
return /* @__PURE__ */
|
|
3556
|
+
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);
|
|
3538
3557
|
})
|
|
3539
3558
|
}
|
|
3540
3559
|
);
|
|
@@ -3542,16 +3561,16 @@ function ConnectedSteps({ connector, userClient, initialUserAddress }) {
|
|
|
3542
3561
|
|
|
3543
3562
|
// src/AccountModalContent.tsx
|
|
3544
3563
|
import { useRef as useRef6 } from "react";
|
|
3545
|
-
import { jsx as
|
|
3564
|
+
import { jsx as jsx41 } from "react/jsx-runtime";
|
|
3546
3565
|
function AccountModalContent() {
|
|
3547
3566
|
const { chainId } = useEntryKitConfig();
|
|
3548
3567
|
const { address: userAddress, connector } = useAccount8();
|
|
3549
3568
|
const userClient = useConnectorClient({ chainId, connector });
|
|
3550
3569
|
const initialUserAddress = useRef6(userAddress);
|
|
3551
3570
|
if (userClient.status !== "success") {
|
|
3552
|
-
return /* @__PURE__ */
|
|
3571
|
+
return /* @__PURE__ */ jsx41(ConnectWallet, {});
|
|
3553
3572
|
}
|
|
3554
|
-
return /* @__PURE__ */
|
|
3573
|
+
return /* @__PURE__ */ jsx41(
|
|
3555
3574
|
ConnectedSteps,
|
|
3556
3575
|
{
|
|
3557
3576
|
connector,
|
|
@@ -3567,17 +3586,17 @@ import { ErrorBoundary } from "react-error-boundary";
|
|
|
3567
3586
|
|
|
3568
3587
|
// src/errors/ErrorOverlay.tsx
|
|
3569
3588
|
import { wait } from "@latticexyz/common/utils";
|
|
3570
|
-
import { useEffect as
|
|
3589
|
+
import { useEffect as useEffect15 } from "react";
|
|
3571
3590
|
import { twMerge as twMerge19 } from "tailwind-merge";
|
|
3572
|
-
import { Fragment as Fragment7, jsx as
|
|
3591
|
+
import { Fragment as Fragment7, jsx as jsx42, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
3573
3592
|
function ErrorOverlay({ error: error2, retry, dismiss }) {
|
|
3574
|
-
|
|
3593
|
+
useEffect15(() => {
|
|
3575
3594
|
if (error2) {
|
|
3576
3595
|
console.error(error2);
|
|
3577
3596
|
}
|
|
3578
3597
|
}, [error2]);
|
|
3579
|
-
return /* @__PURE__ */
|
|
3580
|
-
/* @__PURE__ */
|
|
3598
|
+
return /* @__PURE__ */ jsxs24("div", { className: "pointer-events-none absolute inset-0 overflow-clip", children: [
|
|
3599
|
+
/* @__PURE__ */ jsx42(
|
|
3581
3600
|
"div",
|
|
3582
3601
|
{
|
|
3583
3602
|
className: twMerge19(
|
|
@@ -3587,7 +3606,7 @@ function ErrorOverlay({ error: error2, retry, dismiss }) {
|
|
|
3587
3606
|
)
|
|
3588
3607
|
}
|
|
3589
3608
|
),
|
|
3590
|
-
/* @__PURE__ */
|
|
3609
|
+
/* @__PURE__ */ jsx42(
|
|
3591
3610
|
"div",
|
|
3592
3611
|
{
|
|
3593
3612
|
className: twMerge19(
|
|
@@ -3595,15 +3614,15 @@ function ErrorOverlay({ error: error2, retry, dismiss }) {
|
|
|
3595
3614
|
"transition duration-300",
|
|
3596
3615
|
error2 ? "translate-y-0 opacity-100 pointer-events-auto" : "-translate-y-4 opacity-0"
|
|
3597
3616
|
),
|
|
3598
|
-
children: error2 ? /* @__PURE__ */
|
|
3599
|
-
/* @__PURE__ */
|
|
3600
|
-
/* @__PURE__ */
|
|
3601
|
-
/* @__PURE__ */
|
|
3602
|
-
/* @__PURE__ */
|
|
3617
|
+
children: error2 ? /* @__PURE__ */ jsx42(Fragment7, { children: /* @__PURE__ */ jsxs24("div", { className: "w-full max-h-full bg-blue-700 text-white/80 overflow-auto", children: [
|
|
3618
|
+
/* @__PURE__ */ jsxs24("div", { className: "space-y-6 px-8 pt-8", children: [
|
|
3619
|
+
/* @__PURE__ */ jsx42("div", { className: "text-white text-lg font-bold", children: "Oops! It broke :(" }),
|
|
3620
|
+
/* @__PURE__ */ jsx42("div", { className: "font-mono text-xs whitespace-pre-wrap", children: error2.message.trim() }),
|
|
3621
|
+
/* @__PURE__ */ jsx42("div", { className: "text-sm", children: "See the console for more info." })
|
|
3603
3622
|
] }),
|
|
3604
|
-
/* @__PURE__ */
|
|
3605
|
-
/* @__PURE__ */
|
|
3606
|
-
retry ? /* @__PURE__ */
|
|
3623
|
+
/* @__PURE__ */ jsxs24("div", { className: "pointer-events-none sticky bottom-0 left-0 -mt-2", children: [
|
|
3624
|
+
/* @__PURE__ */ jsx42("div", { className: "w-full h-12 bg-gradient-to-b from-transparent to-blue-700" }),
|
|
3625
|
+
retry ? /* @__PURE__ */ jsx42("div", { className: "bg-blue-700 text-center", children: /* @__PURE__ */ jsxs24(
|
|
3607
3626
|
"button",
|
|
3608
3627
|
{
|
|
3609
3628
|
type: "button",
|
|
@@ -3622,11 +3641,11 @@ function ErrorOverlay({ error: error2, retry, dismiss }) {
|
|
|
3622
3641
|
}
|
|
3623
3642
|
},
|
|
3624
3643
|
children: [
|
|
3625
|
-
/* @__PURE__ */
|
|
3626
|
-
/* @__PURE__ */
|
|
3644
|
+
/* @__PURE__ */ jsx42("span", { className: "group-aria-busy:hidden", children: "Retry" }),
|
|
3645
|
+
/* @__PURE__ */ jsx42("span", { className: "hidden group-aria-busy:inline", children: "Retrying\u2026" })
|
|
3627
3646
|
]
|
|
3628
3647
|
}
|
|
3629
|
-
) }) : dismiss ? /* @__PURE__ */
|
|
3648
|
+
) }) : dismiss ? /* @__PURE__ */ jsx42("div", { className: "bg-blue-700 text-center", children: /* @__PURE__ */ jsx42(
|
|
3630
3649
|
"button",
|
|
3631
3650
|
{
|
|
3632
3651
|
type: "button",
|
|
@@ -3648,24 +3667,24 @@ function ErrorOverlay({ error: error2, retry, dismiss }) {
|
|
|
3648
3667
|
}
|
|
3649
3668
|
|
|
3650
3669
|
// src/errors/ErrorFallback.tsx
|
|
3651
|
-
import { jsx as
|
|
3670
|
+
import { jsx as jsx43 } from "react/jsx-runtime";
|
|
3652
3671
|
function ErrorFallback({ error: error2, resetErrorBoundary }) {
|
|
3653
|
-
return /* @__PURE__ */
|
|
3672
|
+
return /* @__PURE__ */ jsx43("div", { className: "h-64", children: /* @__PURE__ */ jsx43(ErrorOverlay, { error: error2, retry: resetErrorBoundary }) });
|
|
3654
3673
|
}
|
|
3655
3674
|
|
|
3656
3675
|
// src/errors/ErrorsOverlay.tsx
|
|
3657
3676
|
import { useStore as useStore3 } from "zustand";
|
|
3658
|
-
import { jsx as
|
|
3677
|
+
import { jsx as jsx44 } from "react/jsx-runtime";
|
|
3659
3678
|
function ErrorsOverlay() {
|
|
3660
3679
|
const error2 = useStore3(store3, (state) => state.errors.at(0));
|
|
3661
|
-
return /* @__PURE__ */
|
|
3680
|
+
return /* @__PURE__ */ jsx44(ErrorOverlay, { error: error2?.error, retry: error2?.retry, dismiss: error2?.dismiss });
|
|
3662
3681
|
}
|
|
3663
3682
|
|
|
3664
3683
|
// src/AccountModal.tsx
|
|
3665
|
-
import { jsx as
|
|
3684
|
+
import { jsx as jsx45, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
3666
3685
|
function AccountModal() {
|
|
3667
3686
|
const { accountModalOpen, toggleAccountModal } = useAccountModal();
|
|
3668
|
-
return /* @__PURE__ */
|
|
3687
|
+
return /* @__PURE__ */ jsx45(Modal, { open: accountModalOpen, onOpenChange: toggleAccountModal, children: accountModalOpen ? /* @__PURE__ */ jsxs25(
|
|
3669
3688
|
"div",
|
|
3670
3689
|
{
|
|
3671
3690
|
className: twMerge20(
|
|
@@ -3676,11 +3695,11 @@ function AccountModal() {
|
|
|
3676
3695
|
"links:decoration-neutral-500 hover:links:decoration-orange-500"
|
|
3677
3696
|
),
|
|
3678
3697
|
children: [
|
|
3679
|
-
/* @__PURE__ */
|
|
3680
|
-
/* @__PURE__ */
|
|
3681
|
-
/* @__PURE__ */
|
|
3698
|
+
/* @__PURE__ */ jsxs25(ErrorBoundary, { FallbackComponent: ErrorFallback, children: [
|
|
3699
|
+
/* @__PURE__ */ jsx45(AccountModalContent, {}),
|
|
3700
|
+
/* @__PURE__ */ jsx45(ErrorsOverlay, {})
|
|
3682
3701
|
] }),
|
|
3683
|
-
/* @__PURE__ */
|
|
3702
|
+
/* @__PURE__ */ jsxs25(
|
|
3684
3703
|
"a",
|
|
3685
3704
|
{
|
|
3686
3705
|
href: "https://mud.dev",
|
|
@@ -3688,12 +3707,12 @@ function AccountModal() {
|
|
|
3688
3707
|
rel: "noreferrer noopener",
|
|
3689
3708
|
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",
|
|
3690
3709
|
children: [
|
|
3691
|
-
/* @__PURE__ */
|
|
3692
|
-
/* @__PURE__ */
|
|
3710
|
+
/* @__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" }) }),
|
|
3711
|
+
/* @__PURE__ */ jsx45("span", { children: "Powered by MUD" })
|
|
3693
3712
|
]
|
|
3694
3713
|
}
|
|
3695
3714
|
),
|
|
3696
|
-
/* @__PURE__ */
|
|
3715
|
+
/* @__PURE__ */ jsx45("div", { className: "absolute top-0 right-0", children: /* @__PURE__ */ jsx45(
|
|
3697
3716
|
DialogClose,
|
|
3698
3717
|
{
|
|
3699
3718
|
className: twMerge20(
|
|
@@ -3701,7 +3720,7 @@ function AccountModal() {
|
|
|
3701
3720
|
"text-white/20 hover:text-white/40"
|
|
3702
3721
|
),
|
|
3703
3722
|
title: "Close",
|
|
3704
|
-
children: /* @__PURE__ */
|
|
3723
|
+
children: /* @__PURE__ */ jsx45(CloseIcon, { className: "m-0" })
|
|
3705
3724
|
}
|
|
3706
3725
|
) })
|
|
3707
3726
|
]
|
|
@@ -3710,11 +3729,11 @@ function AccountModal() {
|
|
|
3710
3729
|
}
|
|
3711
3730
|
|
|
3712
3731
|
// src/EntryKitProvider.tsx
|
|
3713
|
-
import { jsx as
|
|
3732
|
+
import { jsx as jsx46, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3714
3733
|
function EntryKitProvider({ config, children }) {
|
|
3715
|
-
return /* @__PURE__ */
|
|
3734
|
+
return /* @__PURE__ */ jsxs26(EntryKitConfigProvider, { config, children: [
|
|
3716
3735
|
children,
|
|
3717
|
-
/* @__PURE__ */
|
|
3736
|
+
/* @__PURE__ */ jsx46(AccountModal, {})
|
|
3718
3737
|
] });
|
|
3719
3738
|
}
|
|
3720
3739
|
|
|
@@ -3724,13 +3743,13 @@ import { twMerge as twMerge22 } from "tailwind-merge";
|
|
|
3724
3743
|
|
|
3725
3744
|
// src/AccountName.tsx
|
|
3726
3745
|
import { twMerge as twMerge21 } from "tailwind-merge";
|
|
3727
|
-
import { Fragment as Fragment8, jsx as
|
|
3746
|
+
import { Fragment as Fragment8, jsx as jsx47, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3728
3747
|
function AccountName({ address }) {
|
|
3729
3748
|
const { data: ens } = useENS(address);
|
|
3730
3749
|
const avatar = usePreloadImage(ens?.avatar);
|
|
3731
|
-
return /* @__PURE__ */
|
|
3732
|
-
/* @__PURE__ */
|
|
3733
|
-
/* @__PURE__ */
|
|
3750
|
+
return /* @__PURE__ */ jsxs27(Fragment8, { children: [
|
|
3751
|
+
/* @__PURE__ */ jsxs27("span", { className: "flex-shrink-0 w-6 h-6 -my-1 -mx-0.5 grid place-items-center", children: [
|
|
3752
|
+
/* @__PURE__ */ jsx47(
|
|
3734
3753
|
"img",
|
|
3735
3754
|
{
|
|
3736
3755
|
src: ens?.avatar && avatar.isSuccess ? ens.avatar : void 0,
|
|
@@ -3742,7 +3761,7 @@ function AccountName({ address }) {
|
|
|
3742
3761
|
)
|
|
3743
3762
|
}
|
|
3744
3763
|
),
|
|
3745
|
-
/* @__PURE__ */
|
|
3764
|
+
/* @__PURE__ */ jsx47(
|
|
3746
3765
|
Logo,
|
|
3747
3766
|
{
|
|
3748
3767
|
className: twMerge21(
|
|
@@ -3753,13 +3772,13 @@ function AccountName({ address }) {
|
|
|
3753
3772
|
}
|
|
3754
3773
|
)
|
|
3755
3774
|
] }),
|
|
3756
|
-
/* @__PURE__ */
|
|
3775
|
+
/* @__PURE__ */ jsx47("span", { className: "flex-grow", children: ens?.name ?? /* @__PURE__ */ jsx47(TruncatedHex, { hex: address }) })
|
|
3757
3776
|
] });
|
|
3758
3777
|
}
|
|
3759
3778
|
|
|
3760
3779
|
// src/AccountButton.tsx
|
|
3761
3780
|
import { useRef as useRef7 } from "react";
|
|
3762
|
-
import { jsx as
|
|
3781
|
+
import { jsx as jsx48, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
3763
3782
|
var containerClassNames = twMerge22(
|
|
3764
3783
|
"w-48 p-3 inline-flex outline-none transition",
|
|
3765
3784
|
"border border-transparent",
|
|
@@ -3787,16 +3806,16 @@ function AccountButton2() {
|
|
|
3787
3806
|
}
|
|
3788
3807
|
return "Sign in";
|
|
3789
3808
|
})();
|
|
3790
|
-
return /* @__PURE__ */
|
|
3809
|
+
return /* @__PURE__ */ jsx48(Shadow, { mode: "child", children: isSignedIn ? /* @__PURE__ */ jsx48(
|
|
3791
3810
|
"button",
|
|
3792
3811
|
{
|
|
3793
3812
|
type: "button",
|
|
3794
3813
|
className: twMerge22(containerClassNames, secondaryClassNames, secondaryInteractiveClassNames),
|
|
3795
3814
|
onClick: openAccountModal,
|
|
3796
|
-
children: /* @__PURE__ */
|
|
3815
|
+
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 })
|
|
3797
3816
|
},
|
|
3798
3817
|
"connected"
|
|
3799
|
-
) : /* @__PURE__ */
|
|
3818
|
+
) : /* @__PURE__ */ jsxs28(
|
|
3800
3819
|
"button",
|
|
3801
3820
|
{
|
|
3802
3821
|
type: "button",
|
|
@@ -3811,8 +3830,8 @@ function AccountButton2() {
|
|
|
3811
3830
|
"aria-busy": accountModalOpen || prereqs.isPending,
|
|
3812
3831
|
onClick: openAccountModal,
|
|
3813
3832
|
children: [
|
|
3814
|
-
/* @__PURE__ */
|
|
3815
|
-
/* @__PURE__ */
|
|
3833
|
+
/* @__PURE__ */ jsxs28("span", { className: "pointer-events-none inline-grid place-items-center -ml-3", children: [
|
|
3834
|
+
/* @__PURE__ */ jsx48(
|
|
3816
3835
|
"span",
|
|
3817
3836
|
{
|
|
3818
3837
|
className: twMerge22(
|
|
@@ -3820,10 +3839,10 @@ function AccountButton2() {
|
|
|
3820
3839
|
"scale-100 opacity-100 transition duration-300",
|
|
3821
3840
|
"group-aria-busy:scale-125 group-aria-busy:opacity-0"
|
|
3822
3841
|
),
|
|
3823
|
-
children: /* @__PURE__ */
|
|
3842
|
+
children: /* @__PURE__ */ jsx48(Logo, {})
|
|
3824
3843
|
}
|
|
3825
3844
|
),
|
|
3826
|
-
/* @__PURE__ */
|
|
3845
|
+
/* @__PURE__ */ jsx48(
|
|
3827
3846
|
"span",
|
|
3828
3847
|
{
|
|
3829
3848
|
"aria-hidden": true,
|
|
@@ -3832,11 +3851,11 @@ function AccountButton2() {
|
|
|
3832
3851
|
"scale-50 opacity-0 transition duration-300 delay-50",
|
|
3833
3852
|
"group-aria-busy:scale-100 group-aria-busy:opacity-100"
|
|
3834
3853
|
),
|
|
3835
|
-
children: /* @__PURE__ */
|
|
3854
|
+
children: /* @__PURE__ */ jsx48(PendingIcon, {})
|
|
3836
3855
|
}
|
|
3837
3856
|
)
|
|
3838
3857
|
] }),
|
|
3839
|
-
/* @__PURE__ */
|
|
3858
|
+
/* @__PURE__ */ jsx48("span", { className: "font-medium", children: buttonLabel })
|
|
3840
3859
|
]
|
|
3841
3860
|
},
|
|
3842
3861
|
"sign in"
|