@volr/react-ui 0.1.116 → 0.1.117
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/index.cjs +1835 -1789
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1835 -1789
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
package/dist/index.cjs
CHANGED
|
@@ -564,6 +564,7 @@ var en = {
|
|
|
564
564
|
noAssets: "No assets configured",
|
|
565
565
|
menu: {
|
|
566
566
|
assets: "Assets",
|
|
567
|
+
deposit: "Deposit",
|
|
567
568
|
withdraw: "Withdraw",
|
|
568
569
|
payments: "Payment History",
|
|
569
570
|
account: "Account"
|
|
@@ -757,6 +758,7 @@ var ko = {
|
|
|
757
758
|
noAssets: "\uC124\uC815\uB41C \uC790\uC0B0\uC774 \uC5C6\uC2B5\uB2C8\uB2E4",
|
|
758
759
|
menu: {
|
|
759
760
|
assets: "\uC790\uC0B0",
|
|
761
|
+
deposit: "\uC785\uAE08",
|
|
760
762
|
withdraw: "\uCD9C\uAE08",
|
|
761
763
|
payments: "\uACB0\uC81C \uAE30\uB85D",
|
|
762
764
|
account: "\uACC4\uC815 \uC815\uBCF4"
|
|
@@ -986,7 +988,7 @@ function useMediaQuery(query) {
|
|
|
986
988
|
}
|
|
987
989
|
|
|
988
990
|
// src/generated/volr-sdk-css.ts
|
|
989
|
-
var VOLR_SDK_CSS = '/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--volr-tw-translate-x:0;--volr-tw-translate-y:0;--volr-tw-translate-z:0;--volr-tw-space-y-reverse:0;--volr-tw-border-style:solid;--volr-tw-gradient-position:initial;--volr-tw-gradient-from:#0000;--volr-tw-gradient-via:#0000;--volr-tw-gradient-to:#0000;--volr-tw-gradient-stops:initial;--volr-tw-gradient-via-stops:initial;--volr-tw-gradient-from-position:0%;--volr-tw-gradient-via-position:50%;--volr-tw-gradient-to-position:100%;--volr-tw-leading:initial;--volr-tw-font-weight:initial;--volr-tw-tracking:initial;--volr-tw-shadow:0 0 #0000;--volr-tw-shadow-color:initial;--volr-tw-shadow-alpha:100%;--volr-tw-inset-shadow:0 0 #0000;--volr-tw-inset-shadow-color:initial;--volr-tw-inset-shadow-alpha:100%;--volr-tw-ring-color:initial;--volr-tw-ring-shadow:0 0 #0000;--volr-tw-inset-ring-color:initial;--volr-tw-inset-ring-shadow:0 0 #0000;--volr-tw-ring-inset:initial;--volr-tw-ring-offset-width:0px;--volr-tw-ring-offset-color:#fff;--volr-tw-ring-offset-shadow:0 0 #0000;--volr-tw-blur:initial;--volr-tw-brightness:initial;--volr-tw-contrast:initial;--volr-tw-grayscale:initial;--volr-tw-hue-rotate:initial;--volr-tw-invert:initial;--volr-tw-opacity:initial;--volr-tw-saturate:initial;--volr-tw-sepia:initial;--volr-tw-drop-shadow:initial;--volr-tw-drop-shadow-color:initial;--volr-tw-drop-shadow-alpha:100%;--volr-tw-drop-shadow-size:initial;--volr-tw-duration:initial;--volr-tw-ease:initial}}}@layer theme{:root,:host{--volr-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--volr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--volr-color-red-50:oklch(97.1% .013 17.38);--volr-color-red-100:oklch(93.6% .032 17.717);--volr-color-red-200:oklch(88.5% .062 18.334);--volr-color-red-500:oklch(63.7% .237 25.331);--volr-color-red-600:oklch(57.7% .245 27.325);--volr-color-red-700:oklch(50.5% .213 27.518);--volr-color-amber-50:oklch(98.7% .022 95.277);--volr-color-amber-200:oklch(92.4% .12 95.746);--volr-color-amber-700:oklch(55.5% .163 48.998);--volr-color-yellow-100:oklch(97.3% .071 103.193);--volr-color-yellow-700:oklch(55.4% .135 66.442);--volr-color-green-50:oklch(98.2% .018 155.826);--volr-color-green-100:oklch(96.2% .044 156.743);--volr-color-green-600:oklch(62.7% .194 149.214);--volr-color-green-700:oklch(52.7% .154 150.069);--volr-color-emerald-300:oklch(84.5% .143 164.978);--volr-color-emerald-400:oklch(76.5% .177 163.223);--volr-color-emerald-500:oklch(69.6% .17 162.48);--volr-color-emerald-600:oklch(59.6% .145 163.225);--volr-color-teal-400:oklch(77.7% .152 181.912);--volr-color-teal-500:oklch(70.4% .14 182.503);--volr-color-cyan-400:oklch(78.9% .154 211.53);--volr-color-blue-100:oklch(93.2% .032 255.585);--volr-color-blue-700:oklch(48.8% .243 264.376);--volr-color-slate-50:oklch(98.4% .003 247.858);--volr-color-slate-100:oklch(96.8% .007 247.896);--volr-color-slate-200:oklch(92.9% .013 255.508);--volr-color-slate-300:oklch(86.9% .022 252.894);--volr-color-slate-400:oklch(70.4% .04 256.788);--volr-color-slate-500:oklch(55.4% .046 257.417);--volr-color-slate-600:oklch(44.6% .043 257.281);--volr-color-slate-700:oklch(37.2% .044 257.287);--volr-color-slate-900:oklch(20.8% .042 265.755);--volr-color-gray-500:oklch(55.1% .027 264.364);--volr-color-black:#000;--volr-color-white:#fff;--volr-spacing:.25rem;--volr-container-md:28rem;--volr-container-4xl:56rem;--volr-text-xs:.75rem;--volr-text-xs--line-height:calc(1/.75);--volr-text-sm:.875rem;--volr-text-sm--line-height:calc(1.25/.875);--volr-text-base:1rem;--volr-text-base--line-height:calc(1.5/1);--volr-text-lg:1.125rem;--volr-text-lg--line-height:calc(1.75/1.125);--volr-text-xl:1.25rem;--volr-text-xl--line-height:calc(1.75/1.25);--volr-text-2xl:1.5rem;--volr-text-2xl--line-height:calc(2/1.5);--volr-text-3xl:1.875rem;--volr-text-3xl--line-height:calc(2.25/1.875);--volr-text-8xl:6rem;--volr-text-8xl--line-height:1;--volr-font-weight-medium:500;--volr-font-weight-semibold:600;--volr-font-weight-bold:700;--volr-tracking-wide:.025em;--volr-leading-relaxed:1.625;--volr-radius-md:.375rem;--volr-radius-lg:.5rem;--volr-radius-xl:.75rem;--volr-radius-2xl:1rem;--volr-radius-3xl:1.5rem;--volr-ease-out:cubic-bezier(0,0,.2,1);--volr-animate-spin:spin 1s linear infinite;--volr-animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--volr-blur-2xl:40px;--volr-default-transition-duration:.15s;--volr-default-transition-timing-function:cubic-bezier(.4,0,.2,1);--volr-default-font-family:var(--volr-font-sans);--volr-default-mono-font-family:var(--volr-font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--volr-default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--volr-default-font-feature-settings,normal);font-variation-settings:var(--volr-default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--volr-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--volr-default-mono-font-feature-settings,normal);font-variation-settings:var(--volr-default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}:host{--volr-primary-color:var(--volr-accent-color,#303030);--volr-font-family:var(--volr-custom-font,inherit);--volr-bg:#fff;--volr-bg-secondary:#f8fafc;--volr-bg-tertiary:#f1f5f9;--volr-text:#0f172a;--volr-text-secondary:#475569;--volr-text-muted:#94a3b8;--volr-border:#e2e8f0;--volr-border-strong:#cbd5e1;--volr-hover-bg:#f8fafc;--volr-error-bg:#fef2f2;--volr-error-border:#fecaca;--volr-error-text:#991b1b}:host([data-theme=dark]){--volr-bg:#1c1c1e;--volr-bg-secondary:#2c2c2e;--volr-bg-tertiary:#3a3a3c;--volr-text:#f5f5f7;--volr-text-secondary:#c7c7cc;--volr-text-muted:#8e8e93;--volr-border:#3a3a3c;--volr-border-strong:#48484a;--volr-hover-bg:#2c2c2e;--volr-error-bg:#3c1f1f;--volr-error-border:#7f1d1d;--volr-error-text:#fca5a5}*,:before,:after{box-sizing:border-box}*{font-family:var(--volr-font-family);color:var(--volr-text)}button,input,select,textarea{color:var(--volr-text);background-color:#0000}button{cursor:pointer;background-color:#0000}input::placeholder{color:var(--volr-text-muted)}h1,h2,h3{color:var(--volr-text);margin:0;font-weight:700}h1{font-size:1.875rem;line-height:2.25rem}h2{font-size:1.5rem;line-height:2rem}h3{font-size:1.25rem;line-height:1.75rem}p{margin:0}}@layer components{.volr-dialog-overlay{inset:calc(var(--volr-spacing)*0);z-index:40;background-color:var(--volr-color-black);position:fixed}@supports (color:color-mix(in lab, red, red)){.volr-dialog-overlay{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr-dialog-content{z-index:50;border-radius:var(--volr-radius-2xl);border-style:var(--volr-tw-border-style);padding:calc(var(--volr-spacing)*7);--volr-tw-shadow:0 20px 25px -5px var(--volr-tw-shadow-color,#0000001a),0 8px 10px -6px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow);background-color:var(--volr-bg);border-width:1px;border-color:var(--volr-border-strong);width:calc(100% - 2rem);max-width:28rem;max-height:85vh;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}@media (max-width:640px){.volr-dialog-content{top:auto;right:calc(var(--volr-spacing)*0);bottom:calc(var(--volr-spacing)*0);left:calc(var(--volr-spacing)*0);border-radius:1.25rem 1.25rem 0 0;width:100%;max-width:100%;margin:0 auto;transform:translateY(0)}}.volr-dialog-close{top:calc(var(--volr-spacing)*4);right:calc(var(--volr-spacing)*4);height:calc(var(--volr-spacing)*8);width:calc(var(--volr-spacing)*8);color:var(--volr-text-muted);cursor:pointer;background-color:#0000;border:none;border-radius:3.40282e38px;justify-content:center;align-items:center;display:inline-flex;position:absolute}.volr-dialog-close:hover{background-color:var(--volr-hover-bg);color:var(--volr-text-secondary)}.volr-dialog-close:focus-visible{box-shadow:0 0 0 2px var(--volr-border-strong);outline:none}.volr-dialog-close-icon{height:calc(var(--volr-spacing)*4);width:calc(var(--volr-spacing)*4)}.volr-email-input{border:1px solid var(--volr-border-strong);background-color:var(--volr-bg);width:100%;color:var(--volr-text);border-radius:.5rem;outline:none;padding:.75rem .75rem .75rem 2.75rem;font-size:1rem;line-height:1.5}.volr-email-input::placeholder{color:var(--volr-text-muted)}.volr-email-input:focus{border-color:var(--volr-border-strong);box-shadow:0 0 0 2px var(--volr-border-strong)}.volr-option-button{border:1px solid var(--volr-border);background-color:var(--volr-bg);width:100%;color:var(--volr-text);cursor:pointer;border-radius:.5rem;align-items:center;gap:.75rem;padding:.75rem;transition:background-color .15s ease-out,border-color .15s ease-out,box-shadow .15s ease-out;display:flex}.volr-option-button:hover{background-color:var(--volr-hover-bg);border-color:var(--volr-border)}.volr-option-button:focus-visible{box-shadow:0 0 0 2px var(--volr-border-strong);outline:none}}@layer utilities{.volr\\:pointer-events-auto{pointer-events:auto}.volr\\:pointer-events-none{pointer-events:none}.volr\\:sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.volr\\:absolute{position:absolute}.volr\\:fixed{position:fixed}.volr\\:relative{position:relative}.volr\\:inset-0{inset:calc(var(--volr-spacing)*0)}.volr\\:-top-3{top:calc(var(--volr-spacing)*-3)}.volr\\:top-1\\/2{top:50%}.volr\\:-right-3{right:calc(var(--volr-spacing)*-3)}.volr\\:right-2{right:calc(var(--volr-spacing)*2)}.volr\\:right-3{right:calc(var(--volr-spacing)*3)}.volr\\:bottom-3{bottom:calc(var(--volr-spacing)*3)}.volr\\:left-3{left:calc(var(--volr-spacing)*3)}.volr\\:-z-10{z-index:calc(10*-1)}.volr\\:z-10{z-index:10}.volr\\:z-20{z-index:20}.volr\\:z-40{z-index:40}.volr\\:z-50{z-index:50}.volr\\:mx-auto{margin-inline:auto}.volr\\:my-6{margin-block:calc(var(--volr-spacing)*6)}.volr\\:mt-0\\.5{margin-top:calc(var(--volr-spacing)*.5)}.volr\\:mt-1{margin-top:calc(var(--volr-spacing)*1)}.volr\\:mt-2{margin-top:calc(var(--volr-spacing)*2)}.volr\\:mt-3{margin-top:calc(var(--volr-spacing)*3)}.volr\\:mt-4{margin-top:calc(var(--volr-spacing)*4)}.volr\\:mt-6{margin-top:calc(var(--volr-spacing)*6)}.volr\\:mt-8{margin-top:calc(var(--volr-spacing)*8)}.volr\\:mb-1{margin-bottom:calc(var(--volr-spacing)*1)}.volr\\:mb-2{margin-bottom:calc(var(--volr-spacing)*2)}.volr\\:mb-3{margin-bottom:calc(var(--volr-spacing)*3)}.volr\\:mb-4{margin-bottom:calc(var(--volr-spacing)*4)}.volr\\:mb-5{margin-bottom:calc(var(--volr-spacing)*5)}.volr\\:mb-6{margin-bottom:calc(var(--volr-spacing)*6)}.volr\\:mb-8{margin-bottom:calc(var(--volr-spacing)*8)}.volr\\:-ml-2{margin-left:calc(var(--volr-spacing)*-2)}.volr\\:line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.volr\\:block{display:block}.volr\\:flex{display:flex}.volr\\:grid{display:grid}.volr\\:inline-block{display:inline-block}.volr\\:inline-flex{display:inline-flex}.volr\\:h-1{height:calc(var(--volr-spacing)*1)}.volr\\:h-1\\.5{height:calc(var(--volr-spacing)*1.5)}.volr\\:h-2{height:calc(var(--volr-spacing)*2)}.volr\\:h-3{height:calc(var(--volr-spacing)*3)}.volr\\:h-4{height:calc(var(--volr-spacing)*4)}.volr\\:h-5{height:calc(var(--volr-spacing)*5)}.volr\\:h-6{height:calc(var(--volr-spacing)*6)}.volr\\:h-7{height:calc(var(--volr-spacing)*7)}.volr\\:h-8{height:calc(var(--volr-spacing)*8)}.volr\\:h-9{height:calc(var(--volr-spacing)*9)}.volr\\:h-10{height:calc(var(--volr-spacing)*10)}.volr\\:h-12{height:calc(var(--volr-spacing)*12)}.volr\\:h-14{height:calc(var(--volr-spacing)*14)}.volr\\:h-16{height:calc(var(--volr-spacing)*16)}.volr\\:h-20{height:calc(var(--volr-spacing)*20)}.volr\\:h-24{height:calc(var(--volr-spacing)*24)}.volr\\:h-40{height:calc(var(--volr-spacing)*40)}.volr\\:h-44{height:calc(var(--volr-spacing)*44)}.volr\\:h-48{height:calc(var(--volr-spacing)*48)}.volr\\:h-\\[0\\.8em\\]{height:.8em}.volr\\:h-\\[200px\\]{height:200px}.volr\\:h-full{height:100%}.volr\\:h-px{height:1px}.volr\\:max-h-48{max-height:calc(var(--volr-spacing)*48)}.volr\\:max-h-60{max-height:calc(var(--volr-spacing)*60)}.volr\\:max-h-64{max-height:calc(var(--volr-spacing)*64)}.volr\\:max-h-\\[85vh\\]{max-height:85vh}.volr\\:max-h-\\[90vh\\]{max-height:90vh}.volr\\:min-h-\\[120px\\]{min-height:120px}.volr\\:min-h-\\[500px\\]{min-height:500px}.volr\\:w-1\\.5{width:calc(var(--volr-spacing)*1.5)}.volr\\:w-2{width:calc(var(--volr-spacing)*2)}.volr\\:w-3{width:calc(var(--volr-spacing)*3)}.volr\\:w-4{width:calc(var(--volr-spacing)*4)}.volr\\:w-5{width:calc(var(--volr-spacing)*5)}.volr\\:w-6{width:calc(var(--volr-spacing)*6)}.volr\\:w-7{width:calc(var(--volr-spacing)*7)}.volr\\:w-8{width:calc(var(--volr-spacing)*8)}.volr\\:w-10{width:calc(var(--volr-spacing)*10)}.volr\\:w-12{width:calc(var(--volr-spacing)*12)}.volr\\:w-14{width:calc(var(--volr-spacing)*14)}.volr\\:w-16{width:calc(var(--volr-spacing)*16)}.volr\\:w-20{width:calc(var(--volr-spacing)*20)}.volr\\:w-24{width:calc(var(--volr-spacing)*24)}.volr\\:w-32{width:calc(var(--volr-spacing)*32)}.volr\\:w-36{width:calc(var(--volr-spacing)*36)}.volr\\:w-40{width:calc(var(--volr-spacing)*40)}.volr\\:w-44{width:calc(var(--volr-spacing)*44)}.volr\\:w-48{width:calc(var(--volr-spacing)*48)}.volr\\:w-\\[200px\\]{width:200px}.volr\\:w-auto{width:auto}.volr\\:w-full{width:100%}.volr\\:max-w-4xl{max-width:var(--volr-container-4xl)}.volr\\:max-w-full{max-width:100%}.volr\\:max-w-md{max-width:var(--volr-container-md)}.volr\\:max-w-none{max-width:none}.volr\\:min-w-0{min-width:calc(var(--volr-spacing)*0)}.volr\\:flex-1{flex:1}.volr\\:flex-shrink-0,.volr\\:shrink-0{flex-shrink:0}.volr\\:-translate-y-1\\/2{--volr-tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--volr-tw-translate-x)var(--volr-tw-translate-y)}.volr\\:rotate-90{rotate:90deg}.volr\\:rotate-180{rotate:180deg}.volr\\:animate-pulse{animation:var(--volr-animate-pulse)}.volr\\:animate-spin{animation:var(--volr-animate-spin)}.volr\\:cursor-not-allowed{cursor:not-allowed}.volr\\:cursor-pointer{cursor:pointer}.volr\\:list-inside{list-style-position:inside}.volr\\:list-decimal{list-style-type:decimal}.volr\\:grid-cols-\\[minmax\\(0\\,1\\.1fr\\)_minmax\\(0\\,1fr\\)\\]{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.volr\\:flex-col{flex-direction:column}.volr\\:items-baseline{align-items:baseline}.volr\\:items-center{align-items:center}.volr\\:items-end{align-items:flex-end}.volr\\:items-start{align-items:flex-start}.volr\\:justify-between{justify-content:space-between}.volr\\:justify-center{justify-content:center}.volr\\:gap-1{gap:calc(var(--volr-spacing)*1)}.volr\\:gap-2{gap:calc(var(--volr-spacing)*2)}.volr\\:gap-3{gap:calc(var(--volr-spacing)*3)}.volr\\:gap-4{gap:calc(var(--volr-spacing)*4)}:where(.volr\\:space-y-1>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*1)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*1)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-2>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*2)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*2)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-3>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*3)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*3)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-4>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*4)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*4)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-6>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*6)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*6)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-8>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*8)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*8)*calc(1 - var(--volr-tw-space-y-reverse)))}.volr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.volr\\:overflow-auto{overflow:auto}.volr\\:overflow-hidden{overflow:hidden}.volr\\:overflow-visible{overflow:visible}.volr\\:overflow-x-auto{overflow-x:auto}.volr\\:overflow-y-auto{overflow-y:auto}.volr\\:rounded{border-radius:.25rem}.volr\\:rounded-2xl{border-radius:var(--volr-radius-2xl)}.volr\\:rounded-full{border-radius:3.40282e38px}.volr\\:rounded-lg{border-radius:var(--volr-radius-lg)}.volr\\:rounded-md{border-radius:var(--volr-radius-md)}.volr\\:rounded-xl{border-radius:var(--volr-radius-xl)}.volr\\:rounded-t-2xl{border-top-left-radius:var(--volr-radius-2xl);border-top-right-radius:var(--volr-radius-2xl)}.volr\\:rounded-t-3xl{border-top-left-radius:var(--volr-radius-3xl);border-top-right-radius:var(--volr-radius-3xl)}.volr\\:border{border-style:var(--volr-tw-border-style);border-width:1px}.volr\\:border-2{border-style:var(--volr-tw-border-style);border-width:2px}.volr\\:border-4{border-style:var(--volr-tw-border-style);border-width:4px}.volr\\:border-y{border-block-style:var(--volr-tw-border-style);border-block-width:1px}.volr\\:border-t{border-top-style:var(--volr-tw-border-style);border-top-width:1px}.volr\\:border-b{border-bottom-style:var(--volr-tw-border-style);border-bottom-width:1px}.volr\\:border-amber-200{border-color:var(--volr-color-amber-200)}.volr\\:border-red-200{border-color:var(--volr-color-red-200)}.volr\\:border-red-500{border-color:var(--volr-color-red-500)}.volr\\:border-slate-100{border-color:var(--volr-color-slate-100)}.volr\\:border-slate-200{border-color:var(--volr-color-slate-200)}.volr\\:border-slate-300{border-color:var(--volr-color-slate-300)}.volr\\:border-white{border-color:var(--volr-color-white)}.volr\\:border-t-slate-600{border-top-color:var(--volr-color-slate-600)}.volr\\:bg-amber-50{background-color:var(--volr-color-amber-50)}.volr\\:bg-black\\/40{background-color:var(--volr-color-black)}@supports (color:color-mix(in lab, red, red)){.volr\\:bg-black\\/40{background-color:color-mix(in oklab,var(--volr-color-black)40%,transparent)}}.volr\\:bg-black\\/45{background-color:var(--volr-color-black)}@supports (color:color-mix(in lab, red, red)){.volr\\:bg-black\\/45{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr\\:bg-blue-100{background-color:var(--volr-color-blue-100)}.volr\\:bg-cyan-400{background-color:var(--volr-color-cyan-400)}.volr\\:bg-emerald-300{background-color:var(--volr-color-emerald-300)}.volr\\:bg-emerald-400{background-color:var(--volr-color-emerald-400)}.volr\\:bg-green-50{background-color:var(--volr-color-green-50)}.volr\\:bg-green-100{background-color:var(--volr-color-green-100)}.volr\\:bg-red-50{background-color:var(--volr-color-red-50)}.volr\\:bg-red-100{background-color:var(--volr-color-red-100)}.volr\\:bg-slate-50{background-color:var(--volr-color-slate-50)}.volr\\:bg-slate-100{background-color:var(--volr-color-slate-100)}.volr\\:bg-slate-200{background-color:var(--volr-color-slate-200)}.volr\\:bg-slate-900{background-color:var(--volr-color-slate-900)}.volr\\:bg-teal-400{background-color:var(--volr-color-teal-400)}.volr\\:bg-white{background-color:var(--volr-color-white)}.volr\\:bg-yellow-100{background-color:var(--volr-color-yellow-100)}.volr\\:bg-linear-to-br{--volr-tw-gradient-position:to bottom right}@supports (background-image:linear-gradient(in lab, red, red)){.volr\\:bg-linear-to-br{--volr-tw-gradient-position:to bottom right in oklab}}.volr\\:bg-linear-to-br{background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:bg-linear-to-r{--volr-tw-gradient-position:to right}@supports (background-image:linear-gradient(in lab, red, red)){.volr\\:bg-linear-to-r{--volr-tw-gradient-position:to right in oklab}}.volr\\:bg-linear-to-r{background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:bg-gradient-to-br{--volr-tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:from-emerald-400{--volr-tw-gradient-from:var(--volr-color-emerald-400);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:from-emerald-500{--volr-tw-gradient-from:var(--volr-color-emerald-500);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:from-slate-50{--volr-tw-gradient-from:var(--volr-color-slate-50);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:to-slate-100{--volr-tw-gradient-to:var(--volr-color-slate-100);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:to-teal-500{--volr-tw-gradient-to:var(--volr-color-teal-500);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:object-cover{object-fit:cover}.volr\\:p-1{padding:calc(var(--volr-spacing)*1)}.volr\\:p-2{padding:calc(var(--volr-spacing)*2)}.volr\\:p-3{padding:calc(var(--volr-spacing)*3)}.volr\\:p-4{padding:calc(var(--volr-spacing)*4)}.volr\\:p-5{padding:calc(var(--volr-spacing)*5)}.volr\\:p-6{padding:calc(var(--volr-spacing)*6)}.volr\\:p-8{padding:calc(var(--volr-spacing)*8)}.volr\\:px-1\\.5{padding-inline:calc(var(--volr-spacing)*1.5)}.volr\\:px-2{padding-inline:calc(var(--volr-spacing)*2)}.volr\\:px-3{padding-inline:calc(var(--volr-spacing)*3)}.volr\\:px-4{padding-inline:calc(var(--volr-spacing)*4)}.volr\\:py-0\\.5{padding-block:calc(var(--volr-spacing)*.5)}.volr\\:py-1{padding-block:calc(var(--volr-spacing)*1)}.volr\\:py-1\\.5{padding-block:calc(var(--volr-spacing)*1.5)}.volr\\:py-2{padding-block:calc(var(--volr-spacing)*2)}.volr\\:py-2\\.5{padding-block:calc(var(--volr-spacing)*2.5)}.volr\\:py-3{padding-block:calc(var(--volr-spacing)*3)}.volr\\:py-4{padding-block:calc(var(--volr-spacing)*4)}.volr\\:py-6{padding-block:calc(var(--volr-spacing)*6)}.volr\\:py-8{padding-block:calc(var(--volr-spacing)*8)}.volr\\:py-12{padding-block:calc(var(--volr-spacing)*12)}.volr\\:pt-2{padding-top:calc(var(--volr-spacing)*2)}.volr\\:pt-3{padding-top:calc(var(--volr-spacing)*3)}.volr\\:pt-4{padding-top:calc(var(--volr-spacing)*4)}.volr\\:pr-3{padding-right:calc(var(--volr-spacing)*3)}.volr\\:pr-16{padding-right:calc(var(--volr-spacing)*16)}.volr\\:pl-11{padding-left:calc(var(--volr-spacing)*11)}.volr\\:text-center{text-align:center}.volr\\:text-left{text-align:left}.volr\\:text-right{text-align:right}.volr\\:align-baseline{vertical-align:baseline}.volr\\:font-mono{font-family:var(--volr-font-mono)}.volr\\:text-2xl{font-size:var(--volr-text-2xl);line-height:var(--volr-tw-leading,var(--volr-text-2xl--line-height))}.volr\\:text-3xl{font-size:var(--volr-text-3xl);line-height:var(--volr-tw-leading,var(--volr-text-3xl--line-height))}.volr\\:text-8xl{font-size:var(--volr-text-8xl);line-height:var(--volr-tw-leading,var(--volr-text-8xl--line-height))}.volr\\:text-base{font-size:var(--volr-text-base);line-height:var(--volr-tw-leading,var(--volr-text-base--line-height))}.volr\\:text-lg{font-size:var(--volr-text-lg);line-height:var(--volr-tw-leading,var(--volr-text-lg--line-height))}.volr\\:text-sm{font-size:var(--volr-text-sm);line-height:var(--volr-tw-leading,var(--volr-text-sm--line-height))}.volr\\:text-xl{font-size:var(--volr-text-xl);line-height:var(--volr-tw-leading,var(--volr-text-xl--line-height))}.volr\\:text-xs{font-size:var(--volr-text-xs);line-height:var(--volr-tw-leading,var(--volr-text-xs--line-height))}.volr\\:leading-relaxed{--volr-tw-leading:var(--volr-leading-relaxed);line-height:var(--volr-leading-relaxed)}.volr\\:font-bold{--volr-tw-font-weight:var(--volr-font-weight-bold);font-weight:var(--volr-font-weight-bold)}.volr\\:font-medium{--volr-tw-font-weight:var(--volr-font-weight-medium);font-weight:var(--volr-font-weight-medium)}.volr\\:font-semibold{--volr-tw-font-weight:var(--volr-font-weight-semibold);font-weight:var(--volr-font-weight-semibold)}.volr\\:tracking-wide{--volr-tw-tracking:var(--volr-tracking-wide);letter-spacing:var(--volr-tracking-wide)}.volr\\:break-all{word-break:break-all}.volr\\:text-amber-700{color:var(--volr-color-amber-700)}.volr\\:text-blue-700{color:var(--volr-color-blue-700)}.volr\\:text-emerald-600{color:var(--volr-color-emerald-600)}.volr\\:text-gray-500{color:var(--volr-color-gray-500)}.volr\\:text-green-600{color:var(--volr-color-green-600)}.volr\\:text-green-700{color:var(--volr-color-green-700)}.volr\\:text-red-500{color:var(--volr-color-red-500)}.volr\\:text-red-600{color:var(--volr-color-red-600)}.volr\\:text-red-700{color:var(--volr-color-red-700)}.volr\\:text-slate-100{color:var(--volr-color-slate-100)}.volr\\:text-slate-300{color:var(--volr-color-slate-300)}.volr\\:text-slate-400{color:var(--volr-color-slate-400)}.volr\\:text-slate-500{color:var(--volr-color-slate-500)}.volr\\:text-slate-600{color:var(--volr-color-slate-600)}.volr\\:text-slate-700{color:var(--volr-color-slate-700)}.volr\\:text-slate-900{color:var(--volr-color-slate-900)}.volr\\:text-white{color:var(--volr-color-white)}.volr\\:text-yellow-700{color:var(--volr-color-yellow-700)}.volr\\:capitalize{text-transform:capitalize}.volr\\:uppercase{text-transform:uppercase}.volr\\:underline{text-decoration-line:underline}.volr\\:opacity-0{opacity:0}.volr\\:opacity-25{opacity:.25}.volr\\:opacity-30{opacity:.3}.volr\\:opacity-50{opacity:.5}.volr\\:opacity-75{opacity:.75}.volr\\:shadow-2xl{--volr-tw-shadow:0 25px 50px -12px var(--volr-tw-shadow-color,#00000040);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-lg{--volr-tw-shadow:0 10px 15px -3px var(--volr-tw-shadow-color,#0000001a),0 4px 6px -4px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-md{--volr-tw-shadow:0 4px 6px -1px var(--volr-tw-shadow-color,#0000001a),0 2px 4px -2px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-sm{--volr-tw-shadow:0 1px 3px 0 var(--volr-tw-shadow-color,#0000001a),0 1px 2px -1px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-xl{--volr-tw-shadow:0 20px 25px -5px var(--volr-tw-shadow-color,#0000001a),0 8px 10px -6px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-emerald-500\\/50{--volr-tw-shadow-color:var(--volr-color-emerald-500)}@supports (color:color-mix(in lab, red, red)){.volr\\:shadow-emerald-500\\/50{--volr-tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--volr-color-emerald-500)50%,transparent)var(--volr-tw-shadow-alpha),transparent)}}.volr\\:blur-2xl{--volr-tw-blur:blur(var(--volr-blur-2xl));filter:var(--volr-tw-blur,)var(--volr-tw-brightness,)var(--volr-tw-contrast,)var(--volr-tw-grayscale,)var(--volr-tw-hue-rotate,)var(--volr-tw-invert,)var(--volr-tw-saturate,)var(--volr-tw-sepia,)var(--volr-tw-drop-shadow,)}.volr\\:transition-all{transition-property:all;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--volr-tw-gradient-from,--volr-tw-gradient-via,--volr-tw-gradient-to;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:duration-300{--volr-tw-duration:.3s;transition-duration:.3s}.volr\\:duration-500{--volr-tw-duration:.5s;transition-duration:.5s}.volr\\:ease-out{--volr-tw-ease:var(--volr-ease-out);transition-timing-function:var(--volr-ease-out)}.volr\\:outline-none{--volr-tw-outline-style:none;outline-style:none}@media (hover:hover){.volr\\:hover\\:border-slate-300:hover{border-color:var(--volr-color-slate-300)}.volr\\:hover\\:bg-slate-50:hover{background-color:var(--volr-color-slate-50)}.volr\\:hover\\:bg-slate-200:hover{background-color:var(--volr-color-slate-200)}.volr\\:hover\\:text-slate-700:hover{color:var(--volr-color-slate-700)}}.volr\\:focus\\:ring-2:focus{--volr-tw-ring-shadow:var(--volr-tw-ring-inset,)0 0 0 calc(2px + var(--volr-tw-ring-offset-width))var(--volr-tw-ring-color,currentcolor);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:focus\\:ring-slate-300:focus{--volr-tw-ring-color:var(--volr-color-slate-300)}.volr\\:focus\\:outline-none:focus{--volr-tw-outline-style:none;outline-style:none}.volr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.volr\\:disabled\\:bg-slate-100:disabled{background-color:var(--volr-color-slate-100)}.volr\\:disabled\\:text-slate-400:disabled{color:var(--volr-color-slate-400)}.volr\\:disabled\\:opacity-50:disabled{opacity:.5}.volr-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.volr-text-secondary{color:var(--volr-text-secondary)}.volr-text-muted{color:var(--volr-text-muted)}.volr-bg-secondary{background-color:var(--volr-bg-secondary)}.volr-bg-tertiary{background-color:var(--volr-bg-tertiary)}.volr-border{border-color:var(--volr-border)}.volr-border-strong{border-color:var(--volr-border-strong)}.volr-divider-line{background-color:var(--volr-border)}.volr-error{background-color:var(--volr-error-bg);border-color:var(--volr-error-border);color:var(--volr-error-text)}.volr-hover:hover{background-color:var(--volr-hover-bg)}.volr-surface{background-color:var(--volr-bg)}}@property --volr-tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --volr-tw-gradient-position{syntax:"*";inherits:false}@property --volr-tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-stops{syntax:"*";inherits:false}@property --volr-tw-gradient-via-stops{syntax:"*";inherits:false}@property --volr-tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --volr-tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --volr-tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --volr-tw-leading{syntax:"*";inherits:false}@property --volr-tw-font-weight{syntax:"*";inherits:false}@property --volr-tw-tracking{syntax:"*";inherits:false}@property --volr-tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-shadow-color{syntax:"*";inherits:false}@property --volr-tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-inset-shadow-color{syntax:"*";inherits:false}@property --volr-tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-ring-color{syntax:"*";inherits:false}@property --volr-tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-inset-ring-color{syntax:"*";inherits:false}@property --volr-tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-ring-inset{syntax:"*";inherits:false}@property --volr-tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --volr-tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --volr-tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-blur{syntax:"*";inherits:false}@property --volr-tw-brightness{syntax:"*";inherits:false}@property --volr-tw-contrast{syntax:"*";inherits:false}@property --volr-tw-grayscale{syntax:"*";inherits:false}@property --volr-tw-hue-rotate{syntax:"*";inherits:false}@property --volr-tw-invert{syntax:"*";inherits:false}@property --volr-tw-opacity{syntax:"*";inherits:false}@property --volr-tw-saturate{syntax:"*";inherits:false}@property --volr-tw-sepia{syntax:"*";inherits:false}@property --volr-tw-drop-shadow{syntax:"*";inherits:false}@property --volr-tw-drop-shadow-color{syntax:"*";inherits:false}@property --volr-tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-drop-shadow-size{syntax:"*";inherits:false}@property --volr-tw-duration{syntax:"*";inherits:false}@property --volr-tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.5}}';
|
|
991
|
+
var VOLR_SDK_CSS = '/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--volr-tw-translate-x:0;--volr-tw-translate-y:0;--volr-tw-translate-z:0;--volr-tw-space-y-reverse:0;--volr-tw-border-style:solid;--volr-tw-gradient-position:initial;--volr-tw-gradient-from:#0000;--volr-tw-gradient-via:#0000;--volr-tw-gradient-to:#0000;--volr-tw-gradient-stops:initial;--volr-tw-gradient-via-stops:initial;--volr-tw-gradient-from-position:0%;--volr-tw-gradient-via-position:50%;--volr-tw-gradient-to-position:100%;--volr-tw-leading:initial;--volr-tw-font-weight:initial;--volr-tw-tracking:initial;--volr-tw-shadow:0 0 #0000;--volr-tw-shadow-color:initial;--volr-tw-shadow-alpha:100%;--volr-tw-inset-shadow:0 0 #0000;--volr-tw-inset-shadow-color:initial;--volr-tw-inset-shadow-alpha:100%;--volr-tw-ring-color:initial;--volr-tw-ring-shadow:0 0 #0000;--volr-tw-inset-ring-color:initial;--volr-tw-inset-ring-shadow:0 0 #0000;--volr-tw-ring-inset:initial;--volr-tw-ring-offset-width:0px;--volr-tw-ring-offset-color:#fff;--volr-tw-ring-offset-shadow:0 0 #0000;--volr-tw-blur:initial;--volr-tw-brightness:initial;--volr-tw-contrast:initial;--volr-tw-grayscale:initial;--volr-tw-hue-rotate:initial;--volr-tw-invert:initial;--volr-tw-opacity:initial;--volr-tw-saturate:initial;--volr-tw-sepia:initial;--volr-tw-drop-shadow:initial;--volr-tw-drop-shadow-color:initial;--volr-tw-drop-shadow-alpha:100%;--volr-tw-drop-shadow-size:initial;--volr-tw-duration:initial;--volr-tw-ease:initial}}}@layer theme{:root,:host{--volr-font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--volr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--volr-color-red-50:oklch(97.1% .013 17.38);--volr-color-red-100:oklch(93.6% .032 17.717);--volr-color-red-200:oklch(88.5% .062 18.334);--volr-color-red-500:oklch(63.7% .237 25.331);--volr-color-red-600:oklch(57.7% .245 27.325);--volr-color-red-700:oklch(50.5% .213 27.518);--volr-color-amber-50:oklch(98.7% .022 95.277);--volr-color-amber-200:oklch(92.4% .12 95.746);--volr-color-amber-700:oklch(55.5% .163 48.998);--volr-color-yellow-100:oklch(97.3% .071 103.193);--volr-color-yellow-700:oklch(55.4% .135 66.442);--volr-color-green-50:oklch(98.2% .018 155.826);--volr-color-green-100:oklch(96.2% .044 156.743);--volr-color-green-600:oklch(62.7% .194 149.214);--volr-color-green-700:oklch(52.7% .154 150.069);--volr-color-emerald-300:oklch(84.5% .143 164.978);--volr-color-emerald-400:oklch(76.5% .177 163.223);--volr-color-emerald-500:oklch(69.6% .17 162.48);--volr-color-emerald-600:oklch(59.6% .145 163.225);--volr-color-teal-400:oklch(77.7% .152 181.912);--volr-color-teal-500:oklch(70.4% .14 182.503);--volr-color-cyan-400:oklch(78.9% .154 211.53);--volr-color-blue-100:oklch(93.2% .032 255.585);--volr-color-blue-700:oklch(48.8% .243 264.376);--volr-color-slate-50:oklch(98.4% .003 247.858);--volr-color-slate-100:oklch(96.8% .007 247.896);--volr-color-slate-200:oklch(92.9% .013 255.508);--volr-color-slate-300:oklch(86.9% .022 252.894);--volr-color-slate-400:oklch(70.4% .04 256.788);--volr-color-slate-500:oklch(55.4% .046 257.417);--volr-color-slate-600:oklch(44.6% .043 257.281);--volr-color-slate-700:oklch(37.2% .044 257.287);--volr-color-slate-900:oklch(20.8% .042 265.755);--volr-color-gray-500:oklch(55.1% .027 264.364);--volr-color-black:#000;--volr-color-white:#fff;--volr-spacing:.25rem;--volr-container-md:28rem;--volr-container-4xl:56rem;--volr-text-xs:.75rem;--volr-text-xs--line-height:calc(1/.75);--volr-text-sm:.875rem;--volr-text-sm--line-height:calc(1.25/.875);--volr-text-base:1rem;--volr-text-base--line-height:calc(1.5/1);--volr-text-lg:1.125rem;--volr-text-lg--line-height:calc(1.75/1.125);--volr-text-xl:1.25rem;--volr-text-xl--line-height:calc(1.75/1.25);--volr-text-2xl:1.5rem;--volr-text-2xl--line-height:calc(2/1.5);--volr-text-8xl:6rem;--volr-text-8xl--line-height:1;--volr-font-weight-medium:500;--volr-font-weight-semibold:600;--volr-font-weight-bold:700;--volr-tracking-wide:.025em;--volr-leading-relaxed:1.625;--volr-radius-md:.375rem;--volr-radius-lg:.5rem;--volr-radius-xl:.75rem;--volr-radius-2xl:1rem;--volr-radius-3xl:1.5rem;--volr-ease-out:cubic-bezier(0,0,.2,1);--volr-animate-spin:spin 1s linear infinite;--volr-animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--volr-blur-2xl:40px;--volr-default-transition-duration:.15s;--volr-default-transition-timing-function:cubic-bezier(.4,0,.2,1);--volr-default-font-family:var(--volr-font-sans);--volr-default-mono-font-family:var(--volr-font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--volr-default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--volr-default-font-feature-settings,normal);font-variation-settings:var(--volr-default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--volr-default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--volr-default-mono-font-feature-settings,normal);font-variation-settings:var(--volr-default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}:host{--volr-primary-color:var(--volr-accent-color,#303030);--volr-font-family:var(--volr-custom-font,inherit);--volr-bg:#fff;--volr-bg-secondary:#f8fafc;--volr-bg-tertiary:#f1f5f9;--volr-text:#0f172a;--volr-text-secondary:#475569;--volr-text-muted:#94a3b8;--volr-border:#e2e8f0;--volr-border-strong:#cbd5e1;--volr-hover-bg:#f8fafc;--volr-error-bg:#fef2f2;--volr-error-border:#fecaca;--volr-error-text:#991b1b}:host([data-theme=dark]){--volr-bg:#1c1c1e;--volr-bg-secondary:#2c2c2e;--volr-bg-tertiary:#3a3a3c;--volr-text:#f5f5f7;--volr-text-secondary:#c7c7cc;--volr-text-muted:#8e8e93;--volr-border:#3a3a3c;--volr-border-strong:#48484a;--volr-hover-bg:#2c2c2e;--volr-error-bg:#3c1f1f;--volr-error-border:#7f1d1d;--volr-error-text:#fca5a5}*,:before,:after{box-sizing:border-box}*{font-family:var(--volr-font-family);color:var(--volr-text)}button,input,select,textarea{color:var(--volr-text);background-color:#0000}button{cursor:pointer;background-color:#0000}input::placeholder{color:var(--volr-text-muted)}h1,h2,h3{color:var(--volr-text);margin:0;font-weight:700}h1{font-size:1.875rem;line-height:2.25rem}h2{font-size:1.5rem;line-height:2rem}h3{font-size:1.25rem;line-height:1.75rem}p{margin:0}}@layer components{.volr-dialog-overlay{inset:calc(var(--volr-spacing)*0);z-index:40;background-color:var(--volr-color-black);position:fixed}@supports (color:color-mix(in lab, red, red)){.volr-dialog-overlay{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr-dialog-content{z-index:50;border-radius:var(--volr-radius-2xl);border-style:var(--volr-tw-border-style);padding:calc(var(--volr-spacing)*7);--volr-tw-shadow:0 20px 25px -5px var(--volr-tw-shadow-color,#0000001a),0 8px 10px -6px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow);background-color:var(--volr-bg);border-width:1px;border-color:var(--volr-border-strong);width:calc(100% - 2rem);max-width:28rem;max-height:85vh;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}@media (max-width:640px){.volr-dialog-content{top:auto;right:calc(var(--volr-spacing)*0);bottom:calc(var(--volr-spacing)*0);left:calc(var(--volr-spacing)*0);border-radius:1.25rem 1.25rem 0 0;width:100%;max-width:100%;margin:0 auto;transform:translateY(0)}}.volr-dialog-close{top:calc(var(--volr-spacing)*4);right:calc(var(--volr-spacing)*4);height:calc(var(--volr-spacing)*8);width:calc(var(--volr-spacing)*8);color:var(--volr-text-muted);cursor:pointer;background-color:#0000;border:none;border-radius:3.40282e38px;justify-content:center;align-items:center;display:inline-flex;position:absolute}.volr-dialog-close:hover{background-color:var(--volr-hover-bg);color:var(--volr-text-secondary)}.volr-dialog-close:focus-visible{box-shadow:0 0 0 2px var(--volr-border-strong);outline:none}.volr-dialog-close-icon{height:calc(var(--volr-spacing)*4);width:calc(var(--volr-spacing)*4)}.volr-email-input{border:1px solid var(--volr-border-strong);background-color:var(--volr-bg);width:100%;color:var(--volr-text);border-radius:.5rem;outline:none;padding:.75rem .75rem .75rem 2.75rem;font-size:1rem;line-height:1.5}.volr-email-input::placeholder{color:var(--volr-text-muted)}.volr-email-input:focus{border-color:var(--volr-border-strong);box-shadow:0 0 0 2px var(--volr-border-strong)}.volr-option-button{border:1px solid var(--volr-border);background-color:var(--volr-bg);width:100%;color:var(--volr-text);cursor:pointer;border-radius:.5rem;align-items:center;gap:.75rem;padding:.75rem;transition:background-color .15s ease-out,border-color .15s ease-out,box-shadow .15s ease-out;display:flex}.volr-option-button:hover{background-color:var(--volr-hover-bg);border-color:var(--volr-border)}.volr-option-button:focus-visible{box-shadow:0 0 0 2px var(--volr-border-strong);outline:none}}@layer utilities{.volr\\:pointer-events-auto{pointer-events:auto}.volr\\:pointer-events-none{pointer-events:none}.volr\\:sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.volr\\:absolute{position:absolute}.volr\\:fixed{position:fixed}.volr\\:relative{position:relative}.volr\\:inset-0{inset:calc(var(--volr-spacing)*0)}.volr\\:-top-3{top:calc(var(--volr-spacing)*-3)}.volr\\:top-1\\/2{top:50%}.volr\\:-right-3{right:calc(var(--volr-spacing)*-3)}.volr\\:right-0{right:calc(var(--volr-spacing)*0)}.volr\\:right-2{right:calc(var(--volr-spacing)*2)}.volr\\:right-3{right:calc(var(--volr-spacing)*3)}.volr\\:bottom-3{bottom:calc(var(--volr-spacing)*3)}.volr\\:left-0{left:calc(var(--volr-spacing)*0)}.volr\\:left-3{left:calc(var(--volr-spacing)*3)}.volr\\:-z-10{z-index:calc(10*-1)}.volr\\:z-10{z-index:10}.volr\\:z-20{z-index:20}.volr\\:z-40{z-index:40}.volr\\:z-50{z-index:50}.volr\\:mx-auto{margin-inline:auto}.volr\\:my-6{margin-block:calc(var(--volr-spacing)*6)}.volr\\:mt-0\\.5{margin-top:calc(var(--volr-spacing)*.5)}.volr\\:mt-1{margin-top:calc(var(--volr-spacing)*1)}.volr\\:mt-2{margin-top:calc(var(--volr-spacing)*2)}.volr\\:mt-3{margin-top:calc(var(--volr-spacing)*3)}.volr\\:mt-4{margin-top:calc(var(--volr-spacing)*4)}.volr\\:mt-6{margin-top:calc(var(--volr-spacing)*6)}.volr\\:mt-8{margin-top:calc(var(--volr-spacing)*8)}.volr\\:mb-0\\.5{margin-bottom:calc(var(--volr-spacing)*.5)}.volr\\:mb-1{margin-bottom:calc(var(--volr-spacing)*1)}.volr\\:mb-2{margin-bottom:calc(var(--volr-spacing)*2)}.volr\\:mb-3{margin-bottom:calc(var(--volr-spacing)*3)}.volr\\:mb-4{margin-bottom:calc(var(--volr-spacing)*4)}.volr\\:mb-5{margin-bottom:calc(var(--volr-spacing)*5)}.volr\\:mb-6{margin-bottom:calc(var(--volr-spacing)*6)}.volr\\:mb-8{margin-bottom:calc(var(--volr-spacing)*8)}.volr\\:-ml-2{margin-left:calc(var(--volr-spacing)*-2)}.volr\\:line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.volr\\:block{display:block}.volr\\:flex{display:flex}.volr\\:grid{display:grid}.volr\\:inline-block{display:inline-block}.volr\\:inline-flex{display:inline-flex}.volr\\:h-1{height:calc(var(--volr-spacing)*1)}.volr\\:h-1\\.5{height:calc(var(--volr-spacing)*1.5)}.volr\\:h-2{height:calc(var(--volr-spacing)*2)}.volr\\:h-3{height:calc(var(--volr-spacing)*3)}.volr\\:h-4{height:calc(var(--volr-spacing)*4)}.volr\\:h-5{height:calc(var(--volr-spacing)*5)}.volr\\:h-6{height:calc(var(--volr-spacing)*6)}.volr\\:h-7{height:calc(var(--volr-spacing)*7)}.volr\\:h-8{height:calc(var(--volr-spacing)*8)}.volr\\:h-10{height:calc(var(--volr-spacing)*10)}.volr\\:h-12{height:calc(var(--volr-spacing)*12)}.volr\\:h-14{height:calc(var(--volr-spacing)*14)}.volr\\:h-16{height:calc(var(--volr-spacing)*16)}.volr\\:h-20{height:calc(var(--volr-spacing)*20)}.volr\\:h-24{height:calc(var(--volr-spacing)*24)}.volr\\:h-40{height:calc(var(--volr-spacing)*40)}.volr\\:h-44{height:calc(var(--volr-spacing)*44)}.volr\\:h-48{height:calc(var(--volr-spacing)*48)}.volr\\:h-\\[0\\.8em\\]{height:.8em}.volr\\:h-\\[200px\\]{height:200px}.volr\\:h-full{height:100%}.volr\\:h-px{height:1px}.volr\\:max-h-48{max-height:calc(var(--volr-spacing)*48)}.volr\\:max-h-60{max-height:calc(var(--volr-spacing)*60)}.volr\\:max-h-64{max-height:calc(var(--volr-spacing)*64)}.volr\\:max-h-\\[85vh\\]{max-height:85vh}.volr\\:max-h-\\[90vh\\]{max-height:90vh}.volr\\:min-h-\\[120px\\]{min-height:120px}.volr\\:min-h-\\[500px\\]{min-height:500px}.volr\\:w-1\\.5{width:calc(var(--volr-spacing)*1.5)}.volr\\:w-2{width:calc(var(--volr-spacing)*2)}.volr\\:w-3{width:calc(var(--volr-spacing)*3)}.volr\\:w-4{width:calc(var(--volr-spacing)*4)}.volr\\:w-5{width:calc(var(--volr-spacing)*5)}.volr\\:w-6{width:calc(var(--volr-spacing)*6)}.volr\\:w-7{width:calc(var(--volr-spacing)*7)}.volr\\:w-8{width:calc(var(--volr-spacing)*8)}.volr\\:w-10{width:calc(var(--volr-spacing)*10)}.volr\\:w-12{width:calc(var(--volr-spacing)*12)}.volr\\:w-14{width:calc(var(--volr-spacing)*14)}.volr\\:w-16{width:calc(var(--volr-spacing)*16)}.volr\\:w-20{width:calc(var(--volr-spacing)*20)}.volr\\:w-24{width:calc(var(--volr-spacing)*24)}.volr\\:w-32{width:calc(var(--volr-spacing)*32)}.volr\\:w-36{width:calc(var(--volr-spacing)*36)}.volr\\:w-40{width:calc(var(--volr-spacing)*40)}.volr\\:w-44{width:calc(var(--volr-spacing)*44)}.volr\\:w-48{width:calc(var(--volr-spacing)*48)}.volr\\:w-\\[200px\\]{width:200px}.volr\\:w-auto{width:auto}.volr\\:w-full{width:100%}.volr\\:max-w-4xl{max-width:var(--volr-container-4xl)}.volr\\:max-w-full{max-width:100%}.volr\\:max-w-md{max-width:var(--volr-container-md)}.volr\\:max-w-none{max-width:none}.volr\\:min-w-0{min-width:calc(var(--volr-spacing)*0)}.volr\\:flex-1{flex:1}.volr\\:flex-shrink-0,.volr\\:shrink-0{flex-shrink:0}.volr\\:-translate-y-1\\/2{--volr-tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--volr-tw-translate-x)var(--volr-tw-translate-y)}.volr\\:rotate-90{rotate:90deg}.volr\\:rotate-180{rotate:180deg}.volr\\:animate-pulse{animation:var(--volr-animate-pulse)}.volr\\:animate-spin{animation:var(--volr-animate-spin)}.volr\\:cursor-not-allowed{cursor:not-allowed}.volr\\:cursor-pointer{cursor:pointer}.volr\\:list-inside{list-style-position:inside}.volr\\:list-decimal{list-style-type:decimal}.volr\\:grid-cols-\\[minmax\\(0\\,1\\.1fr\\)_minmax\\(0\\,1fr\\)\\]{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.volr\\:flex-col{flex-direction:column}.volr\\:items-baseline{align-items:baseline}.volr\\:items-center{align-items:center}.volr\\:items-end{align-items:flex-end}.volr\\:items-start{align-items:flex-start}.volr\\:justify-between{justify-content:space-between}.volr\\:justify-center{justify-content:center}.volr\\:gap-1{gap:calc(var(--volr-spacing)*1)}.volr\\:gap-2{gap:calc(var(--volr-spacing)*2)}.volr\\:gap-3{gap:calc(var(--volr-spacing)*3)}.volr\\:gap-4{gap:calc(var(--volr-spacing)*4)}:where(.volr\\:space-y-1>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*1)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*1)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-2>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*2)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*2)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-3>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*3)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*3)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-4>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*4)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*4)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-6>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*6)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*6)*calc(1 - var(--volr-tw-space-y-reverse)))}:where(.volr\\:space-y-8>:not(:last-child)){--volr-tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*8)*var(--volr-tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*8)*calc(1 - var(--volr-tw-space-y-reverse)))}.volr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.volr\\:overflow-auto{overflow:auto}.volr\\:overflow-hidden{overflow:hidden}.volr\\:overflow-visible{overflow:visible}.volr\\:overflow-x-auto{overflow-x:auto}.volr\\:overflow-y-auto{overflow-y:auto}.volr\\:rounded{border-radius:.25rem}.volr\\:rounded-2xl{border-radius:var(--volr-radius-2xl)}.volr\\:rounded-full{border-radius:3.40282e38px}.volr\\:rounded-lg{border-radius:var(--volr-radius-lg)}.volr\\:rounded-md{border-radius:var(--volr-radius-md)}.volr\\:rounded-xl{border-radius:var(--volr-radius-xl)}.volr\\:rounded-t-2xl{border-top-left-radius:var(--volr-radius-2xl);border-top-right-radius:var(--volr-radius-2xl)}.volr\\:rounded-t-3xl{border-top-left-radius:var(--volr-radius-3xl);border-top-right-radius:var(--volr-radius-3xl)}.volr\\:rounded-t-xl{border-top-left-radius:var(--volr-radius-xl);border-top-right-radius:var(--volr-radius-xl)}.volr\\:rounded-b-xl{border-bottom-right-radius:var(--volr-radius-xl);border-bottom-left-radius:var(--volr-radius-xl)}.volr\\:border{border-style:var(--volr-tw-border-style);border-width:1px}.volr\\:border-2{border-style:var(--volr-tw-border-style);border-width:2px}.volr\\:border-4{border-style:var(--volr-tw-border-style);border-width:4px}.volr\\:border-x{border-inline-style:var(--volr-tw-border-style);border-inline-width:1px}.volr\\:border-y{border-block-style:var(--volr-tw-border-style);border-block-width:1px}.volr\\:border-t{border-top-style:var(--volr-tw-border-style);border-top-width:1px}.volr\\:border-b{border-bottom-style:var(--volr-tw-border-style);border-bottom-width:1px}.volr\\:border-amber-200{border-color:var(--volr-color-amber-200)}.volr\\:border-red-200{border-color:var(--volr-color-red-200)}.volr\\:border-red-500{border-color:var(--volr-color-red-500)}.volr\\:border-slate-100{border-color:var(--volr-color-slate-100)}.volr\\:border-slate-200{border-color:var(--volr-color-slate-200)}.volr\\:border-slate-300{border-color:var(--volr-color-slate-300)}.volr\\:border-white{border-color:var(--volr-color-white)}.volr\\:border-t-slate-600{border-top-color:var(--volr-color-slate-600)}.volr\\:bg-amber-50{background-color:var(--volr-color-amber-50)}.volr\\:bg-black\\/45{background-color:var(--volr-color-black)}@supports (color:color-mix(in lab, red, red)){.volr\\:bg-black\\/45{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr\\:bg-blue-100{background-color:var(--volr-color-blue-100)}.volr\\:bg-cyan-400{background-color:var(--volr-color-cyan-400)}.volr\\:bg-emerald-300{background-color:var(--volr-color-emerald-300)}.volr\\:bg-emerald-400{background-color:var(--volr-color-emerald-400)}.volr\\:bg-emerald-500{background-color:var(--volr-color-emerald-500)}.volr\\:bg-green-50{background-color:var(--volr-color-green-50)}.volr\\:bg-green-100{background-color:var(--volr-color-green-100)}.volr\\:bg-red-50{background-color:var(--volr-color-red-50)}.volr\\:bg-red-100{background-color:var(--volr-color-red-100)}.volr\\:bg-slate-50{background-color:var(--volr-color-slate-50)}.volr\\:bg-slate-100{background-color:var(--volr-color-slate-100)}.volr\\:bg-slate-200{background-color:var(--volr-color-slate-200)}.volr\\:bg-slate-900{background-color:var(--volr-color-slate-900)}.volr\\:bg-teal-400{background-color:var(--volr-color-teal-400)}.volr\\:bg-white{background-color:var(--volr-color-white)}.volr\\:bg-yellow-100{background-color:var(--volr-color-yellow-100)}.volr\\:bg-linear-to-br{--volr-tw-gradient-position:to bottom right}@supports (background-image:linear-gradient(in lab, red, red)){.volr\\:bg-linear-to-br{--volr-tw-gradient-position:to bottom right in oklab}}.volr\\:bg-linear-to-br{background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:bg-linear-to-r{--volr-tw-gradient-position:to right}@supports (background-image:linear-gradient(in lab, red, red)){.volr\\:bg-linear-to-r{--volr-tw-gradient-position:to right in oklab}}.volr\\:bg-linear-to-r{background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:bg-gradient-to-br{--volr-tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--volr-tw-gradient-stops))}.volr\\:from-emerald-400{--volr-tw-gradient-from:var(--volr-color-emerald-400);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:from-slate-50{--volr-tw-gradient-from:var(--volr-color-slate-50);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:to-slate-100{--volr-tw-gradient-to:var(--volr-color-slate-100);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:to-teal-500{--volr-tw-gradient-to:var(--volr-color-teal-500);--volr-tw-gradient-stops:var(--volr-tw-gradient-via-stops,var(--volr-tw-gradient-position),var(--volr-tw-gradient-from)var(--volr-tw-gradient-from-position),var(--volr-tw-gradient-to)var(--volr-tw-gradient-to-position))}.volr\\:object-cover{object-fit:cover}.volr\\:p-1{padding:calc(var(--volr-spacing)*1)}.volr\\:p-2{padding:calc(var(--volr-spacing)*2)}.volr\\:p-3{padding:calc(var(--volr-spacing)*3)}.volr\\:p-4{padding:calc(var(--volr-spacing)*4)}.volr\\:p-5{padding:calc(var(--volr-spacing)*5)}.volr\\:p-8{padding:calc(var(--volr-spacing)*8)}.volr\\:px-1\\.5{padding-inline:calc(var(--volr-spacing)*1.5)}.volr\\:px-2{padding-inline:calc(var(--volr-spacing)*2)}.volr\\:px-3{padding-inline:calc(var(--volr-spacing)*3)}.volr\\:px-4{padding-inline:calc(var(--volr-spacing)*4)}.volr\\:py-0\\.5{padding-block:calc(var(--volr-spacing)*.5)}.volr\\:py-1{padding-block:calc(var(--volr-spacing)*1)}.volr\\:py-1\\.5{padding-block:calc(var(--volr-spacing)*1.5)}.volr\\:py-2{padding-block:calc(var(--volr-spacing)*2)}.volr\\:py-2\\.5{padding-block:calc(var(--volr-spacing)*2.5)}.volr\\:py-3{padding-block:calc(var(--volr-spacing)*3)}.volr\\:py-4{padding-block:calc(var(--volr-spacing)*4)}.volr\\:py-6{padding-block:calc(var(--volr-spacing)*6)}.volr\\:py-8{padding-block:calc(var(--volr-spacing)*8)}.volr\\:py-12{padding-block:calc(var(--volr-spacing)*12)}.volr\\:pt-2{padding-top:calc(var(--volr-spacing)*2)}.volr\\:pt-3{padding-top:calc(var(--volr-spacing)*3)}.volr\\:pt-4{padding-top:calc(var(--volr-spacing)*4)}.volr\\:pr-3{padding-right:calc(var(--volr-spacing)*3)}.volr\\:pr-16{padding-right:calc(var(--volr-spacing)*16)}.volr\\:pl-11{padding-left:calc(var(--volr-spacing)*11)}.volr\\:text-center{text-align:center}.volr\\:text-left{text-align:left}.volr\\:text-right{text-align:right}.volr\\:align-baseline{vertical-align:baseline}.volr\\:font-mono{font-family:var(--volr-font-mono)}.volr\\:text-2xl{font-size:var(--volr-text-2xl);line-height:var(--volr-tw-leading,var(--volr-text-2xl--line-height))}.volr\\:text-8xl{font-size:var(--volr-text-8xl);line-height:var(--volr-tw-leading,var(--volr-text-8xl--line-height))}.volr\\:text-base{font-size:var(--volr-text-base);line-height:var(--volr-tw-leading,var(--volr-text-base--line-height))}.volr\\:text-lg{font-size:var(--volr-text-lg);line-height:var(--volr-tw-leading,var(--volr-text-lg--line-height))}.volr\\:text-sm{font-size:var(--volr-text-sm);line-height:var(--volr-tw-leading,var(--volr-text-sm--line-height))}.volr\\:text-xl{font-size:var(--volr-text-xl);line-height:var(--volr-tw-leading,var(--volr-text-xl--line-height))}.volr\\:text-xs{font-size:var(--volr-text-xs);line-height:var(--volr-tw-leading,var(--volr-text-xs--line-height))}.volr\\:leading-relaxed{--volr-tw-leading:var(--volr-leading-relaxed);line-height:var(--volr-leading-relaxed)}.volr\\:font-bold{--volr-tw-font-weight:var(--volr-font-weight-bold);font-weight:var(--volr-font-weight-bold)}.volr\\:font-medium{--volr-tw-font-weight:var(--volr-font-weight-medium);font-weight:var(--volr-font-weight-medium)}.volr\\:font-semibold{--volr-tw-font-weight:var(--volr-font-weight-semibold);font-weight:var(--volr-font-weight-semibold)}.volr\\:tracking-wide{--volr-tw-tracking:var(--volr-tracking-wide);letter-spacing:var(--volr-tracking-wide)}.volr\\:break-all{word-break:break-all}.volr\\:text-amber-700{color:var(--volr-color-amber-700)}.volr\\:text-blue-700{color:var(--volr-color-blue-700)}.volr\\:text-emerald-600{color:var(--volr-color-emerald-600)}.volr\\:text-gray-500{color:var(--volr-color-gray-500)}.volr\\:text-green-600{color:var(--volr-color-green-600)}.volr\\:text-green-700{color:var(--volr-color-green-700)}.volr\\:text-red-500{color:var(--volr-color-red-500)}.volr\\:text-red-600{color:var(--volr-color-red-600)}.volr\\:text-red-700{color:var(--volr-color-red-700)}.volr\\:text-slate-100{color:var(--volr-color-slate-100)}.volr\\:text-slate-300{color:var(--volr-color-slate-300)}.volr\\:text-slate-400{color:var(--volr-color-slate-400)}.volr\\:text-slate-500{color:var(--volr-color-slate-500)}.volr\\:text-slate-600{color:var(--volr-color-slate-600)}.volr\\:text-slate-700{color:var(--volr-color-slate-700)}.volr\\:text-slate-900{color:var(--volr-color-slate-900)}.volr\\:text-white{color:var(--volr-color-white)}.volr\\:text-yellow-700{color:var(--volr-color-yellow-700)}.volr\\:capitalize{text-transform:capitalize}.volr\\:uppercase{text-transform:uppercase}.volr\\:underline{text-decoration-line:underline}.volr\\:opacity-0{opacity:0}.volr\\:opacity-25{opacity:.25}.volr\\:opacity-30{opacity:.3}.volr\\:opacity-50{opacity:.5}.volr\\:opacity-75{opacity:.75}.volr\\:shadow-2xl{--volr-tw-shadow:0 25px 50px -12px var(--volr-tw-shadow-color,#00000040);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-lg{--volr-tw-shadow:0 10px 15px -3px var(--volr-tw-shadow-color,#0000001a),0 4px 6px -4px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-sm{--volr-tw-shadow:0 1px 3px 0 var(--volr-tw-shadow-color,#0000001a),0 1px 2px -1px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-xl{--volr-tw-shadow:0 20px 25px -5px var(--volr-tw-shadow-color,#0000001a),0 8px 10px -6px var(--volr-tw-shadow-color,#0000001a);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:shadow-emerald-500\\/50{--volr-tw-shadow-color:var(--volr-color-emerald-500)}@supports (color:color-mix(in lab, red, red)){.volr\\:shadow-emerald-500\\/50{--volr-tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--volr-color-emerald-500)50%,transparent)var(--volr-tw-shadow-alpha),transparent)}}.volr\\:blur-2xl{--volr-tw-blur:blur(var(--volr-blur-2xl));filter:var(--volr-tw-blur,)var(--volr-tw-brightness,)var(--volr-tw-contrast,)var(--volr-tw-grayscale,)var(--volr-tw-hue-rotate,)var(--volr-tw-invert,)var(--volr-tw-saturate,)var(--volr-tw-sepia,)var(--volr-tw-drop-shadow,)}.volr\\:transition-all{transition-property:all;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--volr-tw-gradient-from,--volr-tw-gradient-via,--volr-tw-gradient-to;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--volr-tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--volr-tw-duration,var(--volr-default-transition-duration))}.volr\\:duration-300{--volr-tw-duration:.3s;transition-duration:.3s}.volr\\:duration-500{--volr-tw-duration:.5s;transition-duration:.5s}.volr\\:ease-out{--volr-tw-ease:var(--volr-ease-out);transition-timing-function:var(--volr-ease-out)}.volr\\:outline-none{--volr-tw-outline-style:none;outline-style:none}@media (hover:hover){.volr\\:hover\\:border-slate-300:hover{border-color:var(--volr-color-slate-300)}.volr\\:hover\\:bg-slate-50:hover{background-color:var(--volr-color-slate-50)}.volr\\:hover\\:bg-slate-200:hover{background-color:var(--volr-color-slate-200)}.volr\\:hover\\:text-slate-700:hover{color:var(--volr-color-slate-700)}}.volr\\:focus\\:ring-2:focus{--volr-tw-ring-shadow:var(--volr-tw-ring-inset,)0 0 0 calc(2px + var(--volr-tw-ring-offset-width))var(--volr-tw-ring-color,currentcolor);box-shadow:var(--volr-tw-inset-shadow),var(--volr-tw-inset-ring-shadow),var(--volr-tw-ring-offset-shadow),var(--volr-tw-ring-shadow),var(--volr-tw-shadow)}.volr\\:focus\\:ring-slate-300:focus{--volr-tw-ring-color:var(--volr-color-slate-300)}.volr\\:focus\\:outline-none:focus{--volr-tw-outline-style:none;outline-style:none}.volr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.volr\\:disabled\\:bg-slate-100:disabled{background-color:var(--volr-color-slate-100)}.volr\\:disabled\\:text-slate-400:disabled{color:var(--volr-color-slate-400)}.volr\\:disabled\\:opacity-50:disabled{opacity:.5}.volr-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.volr-text-secondary{color:var(--volr-text-secondary)}.volr-text-muted{color:var(--volr-text-muted)}.volr-bg-secondary{background-color:var(--volr-bg-secondary)}.volr-bg-tertiary{background-color:var(--volr-bg-tertiary)}.volr-border{border-color:var(--volr-border)}.volr-border-strong{border-color:var(--volr-border-strong)}.volr-divider-line{background-color:var(--volr-border)}.volr-error{background-color:var(--volr-error-bg);border-color:var(--volr-error-border);color:var(--volr-error-text)}.volr-hover:hover{background-color:var(--volr-hover-bg)}.volr-surface{background-color:var(--volr-bg)}}@property --volr-tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --volr-tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --volr-tw-gradient-position{syntax:"*";inherits:false}@property --volr-tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --volr-tw-gradient-stops{syntax:"*";inherits:false}@property --volr-tw-gradient-via-stops{syntax:"*";inherits:false}@property --volr-tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --volr-tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --volr-tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --volr-tw-leading{syntax:"*";inherits:false}@property --volr-tw-font-weight{syntax:"*";inherits:false}@property --volr-tw-tracking{syntax:"*";inherits:false}@property --volr-tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-shadow-color{syntax:"*";inherits:false}@property --volr-tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-inset-shadow-color{syntax:"*";inherits:false}@property --volr-tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-ring-color{syntax:"*";inherits:false}@property --volr-tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-inset-ring-color{syntax:"*";inherits:false}@property --volr-tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-ring-inset{syntax:"*";inherits:false}@property --volr-tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --volr-tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --volr-tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --volr-tw-blur{syntax:"*";inherits:false}@property --volr-tw-brightness{syntax:"*";inherits:false}@property --volr-tw-contrast{syntax:"*";inherits:false}@property --volr-tw-grayscale{syntax:"*";inherits:false}@property --volr-tw-hue-rotate{syntax:"*";inherits:false}@property --volr-tw-invert{syntax:"*";inherits:false}@property --volr-tw-opacity{syntax:"*";inherits:false}@property --volr-tw-saturate{syntax:"*";inherits:false}@property --volr-tw-sepia{syntax:"*";inherits:false}@property --volr-tw-drop-shadow{syntax:"*";inherits:false}@property --volr-tw-drop-shadow-color{syntax:"*";inherits:false}@property --volr-tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --volr-tw-drop-shadow-size{syntax:"*";inherits:false}@property --volr-tw-duration{syntax:"*";inherits:false}@property --volr-tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.5}}';
|
|
990
992
|
function useResolvedTheme(theme = "light") {
|
|
991
993
|
const [resolvedTheme, setResolvedTheme] = React13.useState(() => {
|
|
992
994
|
if (theme !== "system") return theme;
|
|
@@ -2892,1963 +2894,2007 @@ function SigninModal({ isOpen, onClose, onError }) {
|
|
|
2892
2894
|
}
|
|
2893
2895
|
);
|
|
2894
2896
|
}
|
|
2895
|
-
function
|
|
2896
|
-
|
|
2897
|
-
|
|
2898
|
-
|
|
2899
|
-
|
|
2900
|
-
|
|
2901
|
-
|
|
2902
|
-
|
|
2903
|
-
|
|
2904
|
-
|
|
2897
|
+
function AssetSelectView({
|
|
2898
|
+
assets,
|
|
2899
|
+
onSelect
|
|
2900
|
+
}) {
|
|
2901
|
+
const { t } = useI18n();
|
|
2902
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
2903
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xl volr:font-semibold volr:mb-1", children: t("deposit.selectTitle") }),
|
|
2904
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:mb-4 volr-text-secondary", children: "Supported token" }),
|
|
2905
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:space-y-3", children: assets.map((a, idx) => {
|
|
2906
|
+
const isNative = a.token === "native";
|
|
2907
|
+
const tokenSymbol = isNative ? "ETH" : a.token.symbol;
|
|
2908
|
+
const tokenName = isNative ? "Ethereum" : a.token.symbol;
|
|
2909
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2910
|
+
"button",
|
|
2905
2911
|
{
|
|
2906
|
-
|
|
2907
|
-
|
|
2908
|
-
|
|
2909
|
-
|
|
2910
|
-
|
|
2911
|
-
|
|
2912
|
-
|
|
2913
|
-
|
|
2914
|
-
|
|
2915
|
-
|
|
2916
|
-
|
|
2917
|
-
|
|
2918
|
-
|
|
2919
|
-
|
|
2920
|
-
|
|
2921
|
-
|
|
2922
|
-
|
|
2923
|
-
|
|
2924
|
-
|
|
2912
|
+
className: cn(
|
|
2913
|
+
"volr:w-full volr:p-4 volr:rounded-xl volr:border-2",
|
|
2914
|
+
"volr:text-left volr:transition-all",
|
|
2915
|
+
"volr:flex volr:items-center volr:gap-4",
|
|
2916
|
+
"volr-border volr-hover"
|
|
2917
|
+
),
|
|
2918
|
+
onClick: () => onSelect(idx),
|
|
2919
|
+
children: [
|
|
2920
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:shrink-0", children: !isNative && a.token.iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
2921
|
+
"img",
|
|
2922
|
+
{
|
|
2923
|
+
alt: a.token.symbol,
|
|
2924
|
+
src: a.token.iconUrl,
|
|
2925
|
+
className: "volr:w-10 volr:h-10 volr:rounded-full volr:border volr-border"
|
|
2926
|
+
}
|
|
2927
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-10 volr:h-10 volr:rounded-full volr:flex volr:items-center volr:justify-center volr:text-white volr:font-bold volr:text-sm volr-bg-tertiary", children: tokenSymbol.slice(0, 2) }) }),
|
|
2928
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1 volr:min-w-0", children: [
|
|
2929
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2 volr:mb-1", children: [
|
|
2930
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-base volr:font-semibold", children: tokenSymbol }),
|
|
2931
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:text-xs volr:px-2 volr:py-0.5 volr:rounded-full volr:font-medium volr-bg-secondary volr-text-secondary", children: [
|
|
2932
|
+
"Chain ",
|
|
2933
|
+
a.chainId
|
|
2934
|
+
] })
|
|
2935
|
+
] }),
|
|
2936
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-sm volr-text-secondary", children: tokenName }),
|
|
2937
|
+
!isNative && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-xs volr:font-mono volr:truncate volr:mt-1 volr-text-muted", children: a.token.address })
|
|
2938
|
+
] }),
|
|
2939
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:shrink-0 volr-text-muted", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "9 18 15 12 9 6" }) }) })
|
|
2940
|
+
]
|
|
2941
|
+
},
|
|
2942
|
+
`${a.chainId}-${idx}`
|
|
2943
|
+
);
|
|
2944
|
+
}) })
|
|
2945
|
+
] });
|
|
2925
2946
|
}
|
|
2926
|
-
|
|
2947
|
+
var TextLinkButton = React13__default.default.forwardRef(({ showArrow = false, className, children, ...props }, ref) => {
|
|
2927
2948
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2928
2949
|
"button",
|
|
2929
2950
|
{
|
|
2951
|
+
ref,
|
|
2930
2952
|
type: "button",
|
|
2931
|
-
|
|
2932
|
-
|
|
2953
|
+
className: cn(
|
|
2954
|
+
"volr:underline volr:transition-colors volr-text-secondary",
|
|
2955
|
+
className
|
|
2956
|
+
),
|
|
2957
|
+
...props,
|
|
2933
2958
|
children: [
|
|
2934
|
-
|
|
2935
|
-
|
|
2936
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: label }),
|
|
2937
|
-
description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-400 volr:mt-0.5", children: description })
|
|
2938
|
-
] }),
|
|
2939
|
-
/* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-300" })
|
|
2959
|
+
children,
|
|
2960
|
+
showArrow && " \u2192"
|
|
2940
2961
|
]
|
|
2941
2962
|
}
|
|
2942
2963
|
);
|
|
2964
|
+
});
|
|
2965
|
+
TextLinkButton.displayName = "TextLinkButton";
|
|
2966
|
+
var OtherTokenModal = ({
|
|
2967
|
+
open,
|
|
2968
|
+
onOpenChange
|
|
2969
|
+
}) => {
|
|
2970
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(Modal, { open, onOpenChange, children: [
|
|
2971
|
+
/* @__PURE__ */ jsxRuntime.jsx(ModalHeader, { onClose: () => onOpenChange(false) }),
|
|
2972
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-center", children: [
|
|
2973
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-lg volr:font-semibold volr:mb-2", children: "Coming Soon" }),
|
|
2974
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr-text-secondary", children: "Swap and bridge recommendations will be available here soon." })
|
|
2975
|
+
] })
|
|
2976
|
+
] });
|
|
2977
|
+
};
|
|
2978
|
+
|
|
2979
|
+
// ../node_modules/viem/_esm/errors/unit.js
|
|
2980
|
+
init_base();
|
|
2981
|
+
var InvalidDecimalNumberError = class extends BaseError {
|
|
2982
|
+
constructor({ value }) {
|
|
2983
|
+
super(`Number \`${value}\` is not a valid decimal number.`, {
|
|
2984
|
+
name: "InvalidDecimalNumberError"
|
|
2985
|
+
});
|
|
2986
|
+
}
|
|
2987
|
+
};
|
|
2988
|
+
|
|
2989
|
+
// ../node_modules/viem/_esm/utils/unit/parseUnits.js
|
|
2990
|
+
function parseUnits(value, decimals) {
|
|
2991
|
+
if (!/^(-?)([0-9]*)\.?([0-9]*)$/.test(value))
|
|
2992
|
+
throw new InvalidDecimalNumberError({ value });
|
|
2993
|
+
let [integer, fraction = "0"] = value.split(".");
|
|
2994
|
+
const negative = integer.startsWith("-");
|
|
2995
|
+
if (negative)
|
|
2996
|
+
integer = integer.slice(1);
|
|
2997
|
+
fraction = fraction.replace(/(0+)$/, "");
|
|
2998
|
+
if (decimals === 0) {
|
|
2999
|
+
if (Math.round(Number(`.${fraction}`)) === 1)
|
|
3000
|
+
integer = `${BigInt(integer) + 1n}`;
|
|
3001
|
+
fraction = "";
|
|
3002
|
+
} else if (fraction.length > decimals) {
|
|
3003
|
+
const [left, unit, right] = [
|
|
3004
|
+
fraction.slice(0, decimals - 1),
|
|
3005
|
+
fraction.slice(decimals - 1, decimals),
|
|
3006
|
+
fraction.slice(decimals)
|
|
3007
|
+
];
|
|
3008
|
+
const rounded = Math.round(Number(`${unit}.${right}`));
|
|
3009
|
+
if (rounded > 9)
|
|
3010
|
+
fraction = `${BigInt(left) + BigInt(1)}0`.padStart(left.length + 1, "0");
|
|
3011
|
+
else
|
|
3012
|
+
fraction = `${left}${rounded}`;
|
|
3013
|
+
if (fraction.length > decimals) {
|
|
3014
|
+
fraction = fraction.slice(1);
|
|
3015
|
+
integer = `${BigInt(integer) + 1n}`;
|
|
3016
|
+
}
|
|
3017
|
+
fraction = fraction.slice(0, decimals);
|
|
3018
|
+
} else {
|
|
3019
|
+
fraction = fraction.padEnd(decimals, "0");
|
|
3020
|
+
}
|
|
3021
|
+
return BigInt(`${negative ? "-" : ""}${integer}${fraction}`);
|
|
2943
3022
|
}
|
|
2944
|
-
|
|
2945
|
-
|
|
2946
|
-
|
|
2947
|
-
|
|
2948
|
-
|
|
2949
|
-
|
|
2950
|
-
|
|
2951
|
-
|
|
2952
|
-
|
|
2953
|
-
|
|
2954
|
-
|
|
2955
|
-
|
|
2956
|
-
currency: "USD",
|
|
2957
|
-
minimumFractionDigits: 2,
|
|
2958
|
-
maximumFractionDigits: 2
|
|
2959
|
-
});
|
|
2960
|
-
const tokensWithBalance = balances.filter((b) => b.balanceRaw > 0n).length;
|
|
2961
|
-
const assetsDescription = isLoading ? void 0 : tokensWithBalance > 0 ? `${tokensWithBalance} ${tokensWithBalance === 1 ? "token" : "tokens"}` : void 0;
|
|
2962
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
2963
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:rounded-2xl volr:bg-gradient-to-br volr:from-slate-50 volr:to-slate-100 volr:p-6 volr:mb-4", children: [
|
|
2964
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-500 volr:mb-1", children: t("account.totalBalance") }),
|
|
2965
|
-
isLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-9 volr:w-36 volr:bg-slate-200 volr:rounded" }) }) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-3xl volr:font-semibold volr:text-slate-900", children: formattedUsd })
|
|
2966
|
-
] }),
|
|
2967
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-1", children: [
|
|
3023
|
+
|
|
3024
|
+
// ../node_modules/viem/_esm/index.js
|
|
3025
|
+
init_abis();
|
|
3026
|
+
init_formatUnits();
|
|
3027
|
+
var DefaultWalletIcon2 = () => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3028
|
+
"svg",
|
|
3029
|
+
{
|
|
3030
|
+
className: "volr:w-6 volr:h-6",
|
|
3031
|
+
viewBox: "0 0 24 24",
|
|
3032
|
+
fill: "none",
|
|
3033
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
3034
|
+
children: [
|
|
2968
3035
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2969
|
-
|
|
3036
|
+
"rect",
|
|
2970
3037
|
{
|
|
2971
|
-
|
|
2972
|
-
|
|
2973
|
-
|
|
2974
|
-
|
|
3038
|
+
x: "2",
|
|
3039
|
+
y: "6",
|
|
3040
|
+
width: "20",
|
|
3041
|
+
height: "14",
|
|
3042
|
+
rx: "2",
|
|
3043
|
+
stroke: "currentColor",
|
|
3044
|
+
strokeWidth: "1.5"
|
|
2975
3045
|
}
|
|
2976
3046
|
),
|
|
2977
3047
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2978
|
-
|
|
2979
|
-
{
|
|
2980
|
-
icon: /* @__PURE__ */ jsxRuntime.jsx(ArrowUpIcon, { className: "volr:w-5 volr:h-5 volr:text-slate-600" }),
|
|
2981
|
-
label: t("account.menu.withdraw"),
|
|
2982
|
-
onClick: () => onNavigate("withdraw")
|
|
2983
|
-
}
|
|
2984
|
-
),
|
|
2985
|
-
paymentEnabled && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2986
|
-
MenuItem,
|
|
3048
|
+
"path",
|
|
2987
3049
|
{
|
|
2988
|
-
|
|
2989
|
-
|
|
2990
|
-
onClick: () => onNavigate("payments")
|
|
3050
|
+
d: "M17 12.5C17 13.3284 16.3284 14 15.5 14C14.6716 14 14 13.3284 14 12.5C14 11.6716 14.6716 11 15.5 11C16.3284 11 17 11.6716 17 12.5Z",
|
|
3051
|
+
fill: "currentColor"
|
|
2991
3052
|
}
|
|
2992
3053
|
),
|
|
2993
3054
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2994
|
-
|
|
3055
|
+
"path",
|
|
2995
3056
|
{
|
|
2996
|
-
|
|
2997
|
-
|
|
2998
|
-
|
|
3057
|
+
d: "M6 6V5C6 3.89543 6.89543 3 8 3H16C17.1046 3 18 3.89543 18 5V6",
|
|
3058
|
+
stroke: "currentColor",
|
|
3059
|
+
strokeWidth: "1.5"
|
|
2999
3060
|
}
|
|
3000
3061
|
)
|
|
3001
|
-
]
|
|
3002
|
-
|
|
3003
|
-
|
|
3004
|
-
|
|
3005
|
-
|
|
3006
|
-
|
|
3007
|
-
|
|
3008
|
-
|
|
3009
|
-
|
|
3010
|
-
}
|
|
3011
|
-
) })
|
|
3012
|
-
] });
|
|
3013
|
-
}
|
|
3014
|
-
function TokenRow({ token }) {
|
|
3015
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:py-3 volr:border-b volr:border-slate-100 last:volr:border-b-0", children: [
|
|
3016
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-3", children: [
|
|
3017
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-8 volr:h-8 volr:rounded-full volr:bg-slate-100 volr:flex volr:items-center volr:justify-center volr:overflow-hidden volr:shrink-0", children: token.iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
3018
|
-
"img",
|
|
3019
|
-
{
|
|
3020
|
-
src: token.iconUrl,
|
|
3021
|
-
alt: token.symbol,
|
|
3022
|
-
className: "volr:w-full volr:h-full volr:object-cover"
|
|
3023
|
-
}
|
|
3024
|
-
) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:font-medium volr:text-slate-500", children: token.symbol.slice(0, 2) }) }),
|
|
3025
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3026
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: token.symbol }),
|
|
3027
|
-
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
|
|
3028
|
-
"Chain ",
|
|
3029
|
-
token.chainId
|
|
3030
|
-
] })
|
|
3031
|
-
] })
|
|
3032
|
-
] }),
|
|
3033
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-right", children: token.isLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-16 volr:bg-slate-200 volr:rounded" }) }) : token.error ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-red-500", children: "Error" }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
3034
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: token.balance }),
|
|
3035
|
-
token.balanceUsd !== void 0 && token.balanceUsd > 0 && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
|
|
3036
|
-
"$",
|
|
3037
|
-
token.balanceUsd.toFixed(2)
|
|
3038
|
-
] })
|
|
3039
|
-
] }) })
|
|
3040
|
-
] });
|
|
3041
|
-
}
|
|
3042
|
-
function BalanceDetailView({
|
|
3043
|
-
balances,
|
|
3044
|
-
isLoading
|
|
3062
|
+
]
|
|
3063
|
+
}
|
|
3064
|
+
);
|
|
3065
|
+
function WalletTransferView({
|
|
3066
|
+
chainId,
|
|
3067
|
+
asset,
|
|
3068
|
+
destinationAddress,
|
|
3069
|
+
onBack,
|
|
3070
|
+
onSuccess
|
|
3045
3071
|
}) {
|
|
3046
3072
|
const { t } = useI18n();
|
|
3047
|
-
|
|
3048
|
-
|
|
3049
|
-
|
|
3050
|
-
|
|
3051
|
-
|
|
3052
|
-
|
|
3053
|
-
|
|
3054
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-16 volr:bg-slate-200 volr:rounded" })
|
|
3055
|
-
] }, i)) }) });
|
|
3056
|
-
}
|
|
3057
|
-
if (balances.length === 0) {
|
|
3058
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-12 volr:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-400", children: t("account.noAssets") }) });
|
|
3059
|
-
}
|
|
3060
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3061
|
-
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.menu.assets") }),
|
|
3062
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { children: balances.map((token) => /* @__PURE__ */ jsxRuntime.jsx(TokenRow, { token }, token.id)) })
|
|
3063
|
-
] });
|
|
3064
|
-
}
|
|
3065
|
-
var Input = React13__default.default.forwardRef(
|
|
3066
|
-
({ leftIcon, error, className, style, disabled, ...props }, ref) => {
|
|
3067
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3068
|
-
leftIcon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:absolute volr:left-3 volr:top-1/2 volr:-translate-y-1/2 volr:pointer-events-none volr-text-muted", children: leftIcon }),
|
|
3069
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3070
|
-
"input",
|
|
3071
|
-
{
|
|
3072
|
-
ref,
|
|
3073
|
-
disabled,
|
|
3074
|
-
className: cn(
|
|
3075
|
-
"volr:w-full volr:text-base volr:outline-none volr:transition-all volr:rounded-lg volr:py-3 volr:disabled:cursor-not-allowed volr:bg-white",
|
|
3076
|
-
"volr:border volr:border-slate-300 focus:volr:border-slate-400 focus:volr:ring-1 focus:volr:ring-slate-400",
|
|
3077
|
-
leftIcon ? "volr:pl-11 volr:pr-3" : "volr:px-3",
|
|
3078
|
-
error && "volr:border-red-500 focus:volr:border-red-500 focus:volr:ring-red-500",
|
|
3079
|
-
className
|
|
3080
|
-
),
|
|
3081
|
-
style,
|
|
3082
|
-
...props
|
|
3083
|
-
}
|
|
3084
|
-
)
|
|
3085
|
-
] });
|
|
3086
|
-
}
|
|
3087
|
-
);
|
|
3088
|
-
Input.displayName = "Input";
|
|
3089
|
-
function WithdrawView({
|
|
3090
|
-
balances,
|
|
3091
|
-
connectedWallet,
|
|
3092
|
-
onSuccess
|
|
3093
|
-
}) {
|
|
3094
|
-
const { t } = useI18n();
|
|
3095
|
-
const { withdraw, isWithdrawing, result, error, reset } = react.useWithdraw();
|
|
3096
|
-
const [step, setStep] = React13.useState("select");
|
|
3097
|
-
const [selectedTokenId, setSelectedTokenId] = React13.useState(null);
|
|
3098
|
-
const [toAddress, setToAddress] = React13.useState("");
|
|
3073
|
+
const { config } = react.useVolrContext();
|
|
3074
|
+
const { client } = react.useInternalAuth();
|
|
3075
|
+
const { isDetecting, getWalletsForDisplay, hasWallet } = react.useEIP6963();
|
|
3076
|
+
const [viewState, setViewState] = React13.useState("select-wallet");
|
|
3077
|
+
const [selectedWallet, setSelectedWallet] = React13.useState(null);
|
|
3078
|
+
const [connectedAddress, setConnectedAddress] = React13.useState(null);
|
|
3079
|
+
const [balance, setBalance] = React13.useState(null);
|
|
3099
3080
|
const [amount, setAmount] = React13.useState("");
|
|
3100
|
-
const [
|
|
3101
|
-
const
|
|
3102
|
-
|
|
3103
|
-
|
|
3081
|
+
const [isConnecting, setIsConnecting] = React13.useState(false);
|
|
3082
|
+
const [isTransferring, setIsTransferring] = React13.useState(false);
|
|
3083
|
+
const [error, setError] = React13.useState(null);
|
|
3084
|
+
const [chainName, setChainName] = React13.useState(null);
|
|
3085
|
+
const [currentChainId, setCurrentChainId] = React13.useState(null);
|
|
3086
|
+
const tokenSymbol = asset === "native" ? "ETH" : asset.symbol;
|
|
3087
|
+
const decimals = asset === "native" ? 18 : asset.decimals;
|
|
3088
|
+
const getNetworkInfo = React13.useCallback(
|
|
3089
|
+
react.createGetNetworkInfo({ client, rpcOverrides: config.rpcOverrides }),
|
|
3090
|
+
[client, config.rpcOverrides]
|
|
3104
3091
|
);
|
|
3105
|
-
|
|
3106
|
-
|
|
3107
|
-
const
|
|
3108
|
-
|
|
3109
|
-
|
|
3110
|
-
|
|
3111
|
-
|
|
3112
|
-
|
|
3113
|
-
|
|
3114
|
-
|
|
3115
|
-
|
|
3116
|
-
|
|
3117
|
-
|
|
3092
|
+
React13.useEffect(() => {
|
|
3093
|
+
let cancelled = false;
|
|
3094
|
+
const loadChainName = async () => {
|
|
3095
|
+
try {
|
|
3096
|
+
const info = await getNetworkInfo(chainId, false);
|
|
3097
|
+
if (!cancelled) setChainName(info.name);
|
|
3098
|
+
} catch {
|
|
3099
|
+
if (!cancelled) setChainName(`Chain ${chainId}`);
|
|
3100
|
+
}
|
|
3101
|
+
};
|
|
3102
|
+
loadChainName();
|
|
3103
|
+
return () => {
|
|
3104
|
+
cancelled = true;
|
|
3105
|
+
};
|
|
3106
|
+
}, [getNetworkInfo, chainId]);
|
|
3107
|
+
const connectWallet = React13.useCallback(async (wallet) => {
|
|
3108
|
+
setIsConnecting(true);
|
|
3109
|
+
setError(null);
|
|
3110
|
+
try {
|
|
3111
|
+
const provider = wallet.provider;
|
|
3112
|
+
const accounts = await provider.request({ method: "eth_requestAccounts" });
|
|
3113
|
+
if (!accounts || accounts.length === 0) {
|
|
3114
|
+
throw new Error("No accounts found");
|
|
3115
|
+
}
|
|
3116
|
+
const address = accounts[0];
|
|
3117
|
+
setConnectedAddress(address);
|
|
3118
|
+
setSelectedWallet(wallet);
|
|
3119
|
+
const chainIdHex = await provider.request({ method: "eth_chainId" });
|
|
3120
|
+
const currentChain = parseInt(chainIdHex, 16);
|
|
3121
|
+
setCurrentChainId(currentChain);
|
|
3122
|
+
await fetchBalance(provider, address, currentChain);
|
|
3123
|
+
setViewState("transfer");
|
|
3124
|
+
} catch (err) {
|
|
3125
|
+
console.error("Failed to connect wallet:", err);
|
|
3126
|
+
setError(err instanceof Error ? err.message : "Connection failed");
|
|
3127
|
+
} finally {
|
|
3128
|
+
setIsConnecting(false);
|
|
3118
3129
|
}
|
|
3119
|
-
};
|
|
3120
|
-
const
|
|
3121
|
-
if (!selectedToken || !toAddress || !amount) return;
|
|
3122
|
-
setStep("confirm");
|
|
3130
|
+
}, [chainId, asset]);
|
|
3131
|
+
const fetchBalance = React13.useCallback(async (provider, address, currentChain) => {
|
|
3123
3132
|
try {
|
|
3124
|
-
|
|
3125
|
-
|
|
3126
|
-
|
|
3127
|
-
|
|
3128
|
-
|
|
3129
|
-
|
|
3133
|
+
if (currentChain !== chainId) {
|
|
3134
|
+
setBalance(null);
|
|
3135
|
+
return;
|
|
3136
|
+
}
|
|
3137
|
+
if (asset === "native") {
|
|
3138
|
+
const balanceHex = await provider.request({
|
|
3139
|
+
method: "eth_getBalance",
|
|
3140
|
+
params: [address, "latest"]
|
|
3141
|
+
});
|
|
3142
|
+
setBalance(BigInt(balanceHex));
|
|
3143
|
+
} else {
|
|
3144
|
+
const data = `0x70a08231000000000000000000000000${address.slice(2)}`;
|
|
3145
|
+
const result = await provider.request({
|
|
3146
|
+
method: "eth_call",
|
|
3147
|
+
params: [{ to: asset.address, data }, "latest"]
|
|
3148
|
+
});
|
|
3149
|
+
setBalance(BigInt(result));
|
|
3150
|
+
}
|
|
3151
|
+
} catch (err) {
|
|
3152
|
+
console.error("Failed to fetch balance:", err);
|
|
3153
|
+
setBalance(BigInt(0));
|
|
3154
|
+
}
|
|
3155
|
+
}, [chainId, asset]);
|
|
3156
|
+
const switchNetwork = React13.useCallback(async () => {
|
|
3157
|
+
if (!selectedWallet?.provider) return;
|
|
3158
|
+
try {
|
|
3159
|
+
await selectedWallet.provider.request({
|
|
3160
|
+
method: "wallet_switchEthereumChain",
|
|
3161
|
+
params: [{ chainId: `0x${chainId.toString(16)}` }]
|
|
3130
3162
|
});
|
|
3131
|
-
|
|
3132
|
-
|
|
3133
|
-
|
|
3163
|
+
const chainIdHex = await selectedWallet.provider.request({ method: "eth_chainId" });
|
|
3164
|
+
const currentChain = parseInt(chainIdHex, 16);
|
|
3165
|
+
setCurrentChainId(currentChain);
|
|
3166
|
+
if (connectedAddress) {
|
|
3167
|
+
await fetchBalance(selectedWallet.provider, connectedAddress, currentChain);
|
|
3168
|
+
}
|
|
3169
|
+
} catch (err) {
|
|
3170
|
+
console.error("Failed to switch network:", err);
|
|
3171
|
+
setError(err instanceof Error ? err.message : "Failed to switch network");
|
|
3134
3172
|
}
|
|
3135
|
-
};
|
|
3136
|
-
const
|
|
3137
|
-
|
|
3138
|
-
|
|
3139
|
-
|
|
3140
|
-
|
|
3141
|
-
|
|
3142
|
-
|
|
3143
|
-
|
|
3144
|
-
|
|
3145
|
-
|
|
3146
|
-
|
|
3147
|
-
|
|
3148
|
-
|
|
3149
|
-
|
|
3150
|
-
|
|
3151
|
-
|
|
3152
|
-
|
|
3173
|
+
}, [selectedWallet, chainId, connectedAddress, fetchBalance]);
|
|
3174
|
+
const executeTransfer = React13.useCallback(async () => {
|
|
3175
|
+
if (!selectedWallet?.provider || !connectedAddress || !amount) return;
|
|
3176
|
+
setIsTransferring(true);
|
|
3177
|
+
setError(null);
|
|
3178
|
+
try {
|
|
3179
|
+
const amountWei = parseUnits(amount, decimals);
|
|
3180
|
+
if (balance !== null && amountWei > balance) {
|
|
3181
|
+
setError(t("deposit.walletTransfer.insufficientBalance"));
|
|
3182
|
+
setIsTransferring(false);
|
|
3183
|
+
return;
|
|
3184
|
+
}
|
|
3185
|
+
let txHash;
|
|
3186
|
+
if (asset === "native") {
|
|
3187
|
+
txHash = await selectedWallet.provider.request({
|
|
3188
|
+
method: "eth_sendTransaction",
|
|
3189
|
+
params: [{
|
|
3190
|
+
from: connectedAddress,
|
|
3191
|
+
to: destinationAddress,
|
|
3192
|
+
value: `0x${amountWei.toString(16)}`
|
|
3193
|
+
}]
|
|
3194
|
+
});
|
|
3195
|
+
} else {
|
|
3196
|
+
const paddedTo = destinationAddress.slice(2).padStart(64, "0");
|
|
3197
|
+
const paddedAmount = amountWei.toString(16).padStart(64, "0");
|
|
3198
|
+
const data = `0xa9059cbb${paddedTo}${paddedAmount}`;
|
|
3199
|
+
txHash = await selectedWallet.provider.request({
|
|
3200
|
+
method: "eth_sendTransaction",
|
|
3201
|
+
params: [{
|
|
3202
|
+
from: connectedAddress,
|
|
3203
|
+
to: asset.address,
|
|
3204
|
+
data
|
|
3205
|
+
}]
|
|
3206
|
+
});
|
|
3207
|
+
}
|
|
3208
|
+
console.log("Transfer tx hash:", txHash);
|
|
3209
|
+
onSuccess?.();
|
|
3210
|
+
} catch (err) {
|
|
3211
|
+
console.error("Transfer failed:", err);
|
|
3212
|
+
setError(err instanceof Error ? err.message : "Transfer failed");
|
|
3213
|
+
} finally {
|
|
3214
|
+
setIsTransferring(false);
|
|
3215
|
+
}
|
|
3216
|
+
}, [selectedWallet, connectedAddress, amount, decimals, balance, asset, destinationAddress, onSuccess, t]);
|
|
3217
|
+
const setMaxAmount = React13.useCallback(() => {
|
|
3218
|
+
if (balance !== null) {
|
|
3219
|
+
const formatted = formatUnits(balance, decimals);
|
|
3220
|
+
setAmount(formatted);
|
|
3221
|
+
}
|
|
3222
|
+
}, [balance, decimals]);
|
|
3223
|
+
const wallets = getWalletsForDisplay();
|
|
3224
|
+
const isWrongNetwork = currentChainId !== null && currentChainId !== chainId;
|
|
3225
|
+
const formattedBalance = balance !== null ? formatUnits(balance, decimals) : null;
|
|
3226
|
+
if (viewState === "select-wallet") {
|
|
3153
3227
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3154
|
-
/* @__PURE__ */ jsxRuntime.
|
|
3155
|
-
|
|
3228
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
3229
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xl volr:font-semibold volr:mb-1", children: t("deposit.walletTransfer.title") }),
|
|
3230
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500", children: t("deposit.walletTransfer.selectWallet") })
|
|
3231
|
+
] }),
|
|
3232
|
+
isDetecting && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-center volr:py-8", children: [
|
|
3233
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-spin volr:w-6 volr:h-6 volr:border-2 volr:border-slate-300 volr:border-t-slate-600 volr:rounded-full volr:mx-auto" }),
|
|
3234
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500 volr:mt-3", children: t("common.loading") })
|
|
3235
|
+
] }),
|
|
3236
|
+
!isDetecting && !hasWallet && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-center volr:py-8", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500", children: t("deposit.walletTransfer.noWallets") }) }),
|
|
3237
|
+
!isDetecting && wallets.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:space-y-2", children: wallets.map((wallet) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3156
3238
|
"button",
|
|
3157
3239
|
{
|
|
3158
3240
|
type: "button",
|
|
3159
|
-
onClick: () =>
|
|
3160
|
-
disabled:
|
|
3161
|
-
className: "volr:w-full volr:flex volr:items-center volr:
|
|
3241
|
+
onClick: () => connectWallet(wallet),
|
|
3242
|
+
disabled: isConnecting,
|
|
3243
|
+
className: "volr:w-full volr:flex volr:items-center volr:gap-3 volr:p-3 volr:border volr:border-slate-200 volr:rounded-xl volr:hover:bg-slate-50 volr:transition-colors volr:disabled:opacity-50",
|
|
3162
3244
|
children: [
|
|
3163
|
-
/* @__PURE__ */ jsxRuntime.
|
|
3164
|
-
|
|
3165
|
-
|
|
3166
|
-
|
|
3167
|
-
|
|
3168
|
-
|
|
3169
|
-
|
|
3170
|
-
|
|
3171
|
-
|
|
3172
|
-
|
|
3173
|
-
|
|
3174
|
-
|
|
3245
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-10 volr:h-10 volr:rounded-lg volr:bg-slate-100 volr:flex volr:items-center volr:justify-center volr:overflow-hidden volr:flex-shrink-0", children: wallet.icon ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
3246
|
+
"img",
|
|
3247
|
+
{
|
|
3248
|
+
src: wallet.icon,
|
|
3249
|
+
alt: wallet.name,
|
|
3250
|
+
className: "volr:w-7 volr:h-7"
|
|
3251
|
+
}
|
|
3252
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-slate-400", children: /* @__PURE__ */ jsxRuntime.jsx(DefaultWalletIcon2, {}) }) }),
|
|
3253
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:flex-1 volr:text-left volr:font-medium volr:text-slate-900", children: wallet.name }),
|
|
3254
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3255
|
+
"svg",
|
|
3256
|
+
{
|
|
3257
|
+
className: "volr:w-5 volr:h-5 volr:text-slate-400",
|
|
3258
|
+
fill: "none",
|
|
3259
|
+
viewBox: "0 0 24 24",
|
|
3260
|
+
stroke: "currentColor",
|
|
3261
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" })
|
|
3262
|
+
}
|
|
3263
|
+
)
|
|
3175
3264
|
]
|
|
3176
3265
|
},
|
|
3177
|
-
|
|
3178
|
-
)) })
|
|
3266
|
+
wallet.id
|
|
3267
|
+
)) }),
|
|
3268
|
+
error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-4 volr:p-3 volr:bg-red-50 volr:border volr:border-red-200 volr:rounded-lg", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-red-600", children: error }) }),
|
|
3269
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-6 volr:pt-4 volr:border-t volr:border-slate-200", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", onClick: onBack, className: "volr:w-full", children: t("common.back") }) })
|
|
3179
3270
|
] });
|
|
3180
3271
|
}
|
|
3181
|
-
|
|
3182
|
-
|
|
3183
|
-
/* @__PURE__ */ jsxRuntime.jsx("
|
|
3184
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-
|
|
3185
|
-
/* @__PURE__ */ jsxRuntime.jsx("
|
|
3186
|
-
|
|
3187
|
-
|
|
3188
|
-
|
|
3189
|
-
|
|
3190
|
-
className: "volr:w-full volr:h-full volr:object-cover"
|
|
3191
|
-
}
|
|
3192
|
-
) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:font-medium volr:text-slate-500", children: selectedToken.symbol.slice(0, 2) }) }),
|
|
3193
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3194
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: selectedToken.symbol }),
|
|
3195
|
-
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
|
|
3196
|
-
t("account.withdraw.available"),
|
|
3197
|
-
": ",
|
|
3198
|
-
selectedToken.balance
|
|
3199
|
-
] })
|
|
3272
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3273
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
3274
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xl volr:font-semibold volr:mb-1", children: t("deposit.walletTransfer.title") }),
|
|
3275
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2", children: [
|
|
3276
|
+
selectedWallet?.icon && /* @__PURE__ */ jsxRuntime.jsx("img", { src: selectedWallet.icon, alt: "", className: "volr:w-5 volr:h-5 volr:rounded" }),
|
|
3277
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:text-sm volr:text-slate-500", children: [
|
|
3278
|
+
connectedAddress?.slice(0, 6),
|
|
3279
|
+
"...",
|
|
3280
|
+
connectedAddress?.slice(-4)
|
|
3200
3281
|
] })
|
|
3282
|
+
] })
|
|
3283
|
+
] }),
|
|
3284
|
+
isWrongNetwork && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4 volr:p-3 volr:bg-amber-50 volr:border volr:border-amber-200 volr:rounded-lg", children: [
|
|
3285
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-amber-700 volr:mb-2", children: t("deposit.walletTransfer.wrongNetwork", { network: chainName || `Chain ${chainId}` }) }),
|
|
3286
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3287
|
+
Button,
|
|
3288
|
+
{
|
|
3289
|
+
variant: "secondary",
|
|
3290
|
+
size: "sm",
|
|
3291
|
+
onClick: switchNetwork,
|
|
3292
|
+
className: "volr:w-full",
|
|
3293
|
+
children: t("deposit.walletTransfer.switchNetwork")
|
|
3294
|
+
}
|
|
3295
|
+
)
|
|
3296
|
+
] }),
|
|
3297
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-4 volr:p-4 volr:bg-slate-50 volr:rounded-xl volr:border volr:border-slate-200", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between", children: [
|
|
3298
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2", children: [
|
|
3299
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-base volr:font-semibold", children: tokenSymbol }),
|
|
3300
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:px-2 volr:py-0.5 volr:rounded-full volr:bg-slate-200 volr:text-slate-600", children: chainName || `Chain ${chainId}` })
|
|
3201
3301
|
] }),
|
|
3202
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:
|
|
3203
|
-
/* @__PURE__ */ jsxRuntime.jsx("
|
|
3302
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-right", children: [
|
|
3303
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-500", children: t("deposit.walletTransfer.balance") }),
|
|
3304
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-mono volr:font-medium", children: isWrongNetwork ? "-" : formattedBalance ? `${Number(formattedBalance).toFixed(4)}` : "..." })
|
|
3305
|
+
] })
|
|
3306
|
+
] }) }),
|
|
3307
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
3308
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { className: "volr:block volr:text-sm volr:font-medium volr:text-slate-700 volr:mb-2", children: t("deposit.walletTransfer.amount") }),
|
|
3309
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3204
3310
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3205
|
-
|
|
3311
|
+
"input",
|
|
3206
3312
|
{
|
|
3207
3313
|
type: "text",
|
|
3208
|
-
|
|
3209
|
-
value:
|
|
3210
|
-
onChange: (e) =>
|
|
3211
|
-
|
|
3212
|
-
|
|
3213
|
-
|
|
3314
|
+
inputMode: "decimal",
|
|
3315
|
+
value: amount,
|
|
3316
|
+
onChange: (e) => setAmount(e.target.value),
|
|
3317
|
+
placeholder: t("deposit.walletTransfer.amountPlaceholder"),
|
|
3318
|
+
disabled: isWrongNetwork,
|
|
3319
|
+
className: "volr:w-full volr:px-4 volr:py-3 volr:pr-16 volr:border volr:border-slate-300 volr:rounded-xl volr:text-base volr:font-mono volr:focus:outline-none volr:focus:ring-2 volr:focus:ring-slate-300 volr:disabled:bg-slate-100 volr:disabled:text-slate-400"
|
|
3214
3320
|
}
|
|
3215
3321
|
),
|
|
3216
|
-
|
|
3322
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3217
3323
|
"button",
|
|
3218
3324
|
{
|
|
3219
3325
|
type: "button",
|
|
3220
|
-
onClick:
|
|
3221
|
-
|
|
3222
|
-
|
|
3326
|
+
onClick: setMaxAmount,
|
|
3327
|
+
disabled: isWrongNetwork || balance === null,
|
|
3328
|
+
className: "volr:absolute volr:right-3 volr:top-1/2 volr:-translate-y-1/2 volr:px-2 volr:py-1 volr:text-xs volr:font-semibold volr:text-slate-600 volr:bg-slate-100 volr:rounded volr:hover:bg-slate-200 volr:disabled:opacity-50",
|
|
3329
|
+
children: t("deposit.walletTransfer.max")
|
|
3223
3330
|
}
|
|
3224
3331
|
)
|
|
3225
|
-
] })
|
|
3226
|
-
|
|
3227
|
-
|
|
3228
|
-
|
|
3229
|
-
|
|
3230
|
-
|
|
3231
|
-
|
|
3232
|
-
|
|
3233
|
-
|
|
3234
|
-
|
|
3235
|
-
|
|
3236
|
-
|
|
3237
|
-
|
|
3238
|
-
|
|
3239
|
-
|
|
3240
|
-
|
|
3241
|
-
|
|
3242
|
-
|
|
3243
|
-
|
|
3244
|
-
|
|
3245
|
-
|
|
3246
|
-
|
|
3247
|
-
|
|
3248
|
-
|
|
3249
|
-
|
|
3332
|
+
] })
|
|
3333
|
+
] }),
|
|
3334
|
+
error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-4 volr:p-3 volr:bg-red-50 volr:border volr:border-red-200 volr:rounded-lg", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-red-600", children: error }) }),
|
|
3335
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3336
|
+
Button,
|
|
3337
|
+
{
|
|
3338
|
+
onClick: executeTransfer,
|
|
3339
|
+
disabled: isTransferring || !amount || isWrongNetwork,
|
|
3340
|
+
className: "volr:w-full",
|
|
3341
|
+
children: isTransferring ? t("deposit.walletTransfer.transferring") : t("deposit.walletTransfer.transfer")
|
|
3342
|
+
}
|
|
3343
|
+
),
|
|
3344
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-3", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3345
|
+
Button,
|
|
3346
|
+
{
|
|
3347
|
+
variant: "ghost",
|
|
3348
|
+
onClick: () => setViewState("select-wallet"),
|
|
3349
|
+
className: "volr:w-full",
|
|
3350
|
+
children: t("common.back")
|
|
3351
|
+
}
|
|
3352
|
+
) })
|
|
3353
|
+
] });
|
|
3354
|
+
}
|
|
3355
|
+
var DepositQRStatusOverlay = ({
|
|
3356
|
+
status
|
|
3357
|
+
}) => {
|
|
3358
|
+
if (status !== "detected") return null;
|
|
3359
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
3360
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3361
|
+
"div",
|
|
3362
|
+
{
|
|
3363
|
+
className: "volr:absolute volr:inset-0 volr:rounded-2xl volr:pointer-events-none",
|
|
3364
|
+
style: {
|
|
3365
|
+
boxShadow: "0 0 0 4px rgba(16, 185, 129, 0.3), 0 0 30px rgba(16, 185, 129, 0.4)",
|
|
3366
|
+
animation: "volrPulseGlow 1.5s ease-out infinite"
|
|
3367
|
+
}
|
|
3368
|
+
}
|
|
3369
|
+
),
|
|
3370
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:absolute volr:inset-0 volr:overflow-visible volr:pointer-events-none volr:-z-10", children: [
|
|
3250
3371
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3251
|
-
|
|
3372
|
+
"div",
|
|
3252
3373
|
{
|
|
3253
|
-
|
|
3254
|
-
|
|
3255
|
-
|
|
3256
|
-
|
|
3374
|
+
className: "volr:absolute volr:w-48 volr:h-48 volr:rounded-full volr:opacity-0",
|
|
3375
|
+
style: {
|
|
3376
|
+
background: "radial-gradient(circle, rgba(16,185,129,0.7) 0%, rgba(16,185,129,0) 60%)",
|
|
3377
|
+
filter: "blur(50px)",
|
|
3378
|
+
top: "5%",
|
|
3379
|
+
left: "0%",
|
|
3380
|
+
animation: "volrGlowPulse 1.8s ease-out forwards"
|
|
3381
|
+
}
|
|
3382
|
+
}
|
|
3383
|
+
),
|
|
3384
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3385
|
+
"div",
|
|
3386
|
+
{
|
|
3387
|
+
className: "volr:absolute volr:w-44 volr:h-44 volr:rounded-full volr:opacity-0",
|
|
3388
|
+
style: {
|
|
3389
|
+
background: "radial-gradient(circle, rgba(6,182,212,0.65) 0%, rgba(6,182,212,0) 60%)",
|
|
3390
|
+
filter: "blur(45px)",
|
|
3391
|
+
bottom: "10%",
|
|
3392
|
+
right: "-5%",
|
|
3393
|
+
animation: "volrGlowPulse 2s ease-out 0.1s forwards"
|
|
3394
|
+
}
|
|
3395
|
+
}
|
|
3396
|
+
),
|
|
3397
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3398
|
+
"div",
|
|
3399
|
+
{
|
|
3400
|
+
className: "volr:absolute volr:w-40 volr:h-40 volr:rounded-full volr:opacity-0",
|
|
3401
|
+
style: {
|
|
3402
|
+
background: "radial-gradient(circle, rgba(20,184,166,0.6) 0%, rgba(20,184,166,0) 60%)",
|
|
3403
|
+
filter: "blur(40px)",
|
|
3404
|
+
top: "50%",
|
|
3405
|
+
left: "50%",
|
|
3406
|
+
transform: "translateX(-50%)",
|
|
3407
|
+
animation: "volrGlowPulse 2.2s ease-out 0.2s forwards"
|
|
3408
|
+
}
|
|
3257
3409
|
}
|
|
3258
3410
|
)
|
|
3259
|
-
] })
|
|
3260
|
-
|
|
3261
|
-
|
|
3262
|
-
|
|
3263
|
-
|
|
3264
|
-
|
|
3265
|
-
|
|
3266
|
-
|
|
3267
|
-
|
|
3268
|
-
const isSuccess = result && !error;
|
|
3269
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-8 volr:text-center", children: [
|
|
3270
|
-
isSuccess ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
3271
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-12 volr:h-12 volr:rounded-full volr:bg-green-100 volr:flex volr:items-center volr:justify-center volr:mx-auto volr:mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3411
|
+
] }),
|
|
3412
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3413
|
+
"div",
|
|
3414
|
+
{
|
|
3415
|
+
className: "volr:absolute volr:-top-3 volr:-right-3 volr:rounded-full volr:p-3 volr:bg-linear-to-br volr:from-emerald-400 volr:to-teal-500 volr:shadow-2xl volr:shadow-emerald-500/50 volr:border-4 volr:border-white volr:z-20",
|
|
3416
|
+
style: {
|
|
3417
|
+
animation: "volrBounceIn 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards"
|
|
3418
|
+
},
|
|
3419
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3272
3420
|
"svg",
|
|
3273
3421
|
{
|
|
3274
|
-
|
|
3275
|
-
|
|
3422
|
+
width: "20",
|
|
3423
|
+
height: "20",
|
|
3276
3424
|
viewBox: "0 0 24 24",
|
|
3277
|
-
stroke: "currentColor",
|
|
3278
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3279
|
-
"path",
|
|
3280
|
-
{
|
|
3281
|
-
strokeLinecap: "round",
|
|
3282
|
-
strokeLinejoin: "round",
|
|
3283
|
-
strokeWidth: 2,
|
|
3284
|
-
d: "M5 13l4 4L19 7"
|
|
3285
|
-
}
|
|
3286
|
-
)
|
|
3287
|
-
}
|
|
3288
|
-
) }),
|
|
3289
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-2", children: t("account.withdraw.success") }),
|
|
3290
|
-
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-sm volr:text-slate-500 volr:mb-6", children: [
|
|
3291
|
-
amount,
|
|
3292
|
-
" ",
|
|
3293
|
-
selectedToken?.symbol,
|
|
3294
|
-
" ",
|
|
3295
|
-
t("account.withdraw.sent")
|
|
3296
|
-
] })
|
|
3297
|
-
] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
3298
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-12 volr:h-12 volr:rounded-full volr:bg-red-100 volr:flex volr:items-center volr:justify-center volr:mx-auto volr:mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3299
|
-
"svg",
|
|
3300
|
-
{
|
|
3301
|
-
className: "volr:w-6 volr:h-6 volr:text-red-600",
|
|
3302
3425
|
fill: "none",
|
|
3303
|
-
|
|
3304
|
-
|
|
3305
|
-
|
|
3306
|
-
|
|
3307
|
-
|
|
3308
|
-
strokeLinecap: "round",
|
|
3309
|
-
strokeLinejoin: "round",
|
|
3310
|
-
strokeWidth: 2,
|
|
3311
|
-
d: "M6 18L18 6M6 6l12 12"
|
|
3312
|
-
}
|
|
3313
|
-
)
|
|
3426
|
+
stroke: "white",
|
|
3427
|
+
strokeWidth: "3",
|
|
3428
|
+
strokeLinecap: "round",
|
|
3429
|
+
strokeLinejoin: "round",
|
|
3430
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" })
|
|
3314
3431
|
}
|
|
3315
|
-
)
|
|
3316
|
-
|
|
3317
|
-
|
|
3318
|
-
|
|
3319
|
-
/* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "secondary", onClick: isSuccess ? onSuccess : handleReset, fullWidth: true, children: isSuccess ? t("common.done") : t("common.tryAgain") })
|
|
3320
|
-
] });
|
|
3321
|
-
}
|
|
3322
|
-
return null;
|
|
3323
|
-
}
|
|
3324
|
-
function PaymentRow({ payment, onClick }) {
|
|
3325
|
-
const { t } = useI18n();
|
|
3326
|
-
const date = new Date(payment.createdAt);
|
|
3327
|
-
const formattedDate = date.toLocaleDateString(void 0, {
|
|
3328
|
-
month: "short",
|
|
3329
|
-
day: "numeric",
|
|
3330
|
-
year: "numeric"
|
|
3331
|
-
});
|
|
3332
|
-
const statusColors = {
|
|
3333
|
-
CONFIRMED: "volr:bg-green-100 volr:text-green-700",
|
|
3334
|
-
PENDING: "volr:bg-yellow-100 volr:text-yellow-700",
|
|
3335
|
-
PROCESSING: "volr:bg-blue-100 volr:text-blue-700",
|
|
3336
|
-
FAILED: "volr:bg-red-100 volr:text-red-700",
|
|
3337
|
-
CANCELLED: "volr:bg-slate-100 volr:text-slate-500",
|
|
3338
|
-
EXPIRED: "volr:bg-slate-100 volr:text-slate-500"
|
|
3339
|
-
};
|
|
3340
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3341
|
-
"button",
|
|
3342
|
-
{
|
|
3343
|
-
type: "button",
|
|
3344
|
-
onClick,
|
|
3345
|
-
className: "volr:w-full volr:flex volr:items-center volr:justify-between volr:py-3 volr:border-b volr:border-slate-100 hover:volr:bg-slate-50 volr:transition-colors volr:text-left",
|
|
3346
|
-
children: [
|
|
3347
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1 volr:min-w-0", children: [
|
|
3348
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2 volr:mb-1", children: [
|
|
3349
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900 volr:truncate", children: payment.itemName || t("account.payments.payment") }),
|
|
3350
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3351
|
-
"span",
|
|
3352
|
-
{
|
|
3353
|
-
className: `volr:px-1.5 volr:py-0.5 volr:text-xs volr:font-medium volr:rounded ${statusColors[payment.status] || "volr:bg-slate-100 volr:text-slate-500"}`,
|
|
3354
|
-
children: payment.status
|
|
3355
|
-
}
|
|
3356
|
-
)
|
|
3357
|
-
] }),
|
|
3358
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-400", children: formattedDate })
|
|
3359
|
-
] }),
|
|
3360
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2", children: [
|
|
3361
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-right", children: [
|
|
3362
|
-
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: [
|
|
3363
|
-
payment.amount,
|
|
3364
|
-
" ",
|
|
3365
|
-
payment.token.symbol
|
|
3366
|
-
] }),
|
|
3367
|
-
payment.totalUsd && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
|
|
3368
|
-
"$",
|
|
3369
|
-
parseFloat(payment.totalUsd).toFixed(2)
|
|
3370
|
-
] })
|
|
3371
|
-
] }),
|
|
3372
|
-
/* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-300" })
|
|
3373
|
-
] })
|
|
3374
|
-
]
|
|
3375
|
-
}
|
|
3376
|
-
);
|
|
3377
|
-
}
|
|
3378
|
-
function PaymentHistoryView({ onSelectPayment }) {
|
|
3379
|
-
const { t } = useI18n();
|
|
3380
|
-
const { getPaymentHistory, isLoading: isApiLoading } = react.useVolrPaymentApi();
|
|
3381
|
-
const [payments, setPayments] = React13.useState([]);
|
|
3382
|
-
const [isLoading, setIsLoading] = React13.useState(true);
|
|
3383
|
-
const [error, setError] = React13.useState(null);
|
|
3384
|
-
React13.useEffect(() => {
|
|
3385
|
-
setIsLoading(true);
|
|
3386
|
-
setError(null);
|
|
3387
|
-
getPaymentHistory({ take: 20 }).then((result) => {
|
|
3388
|
-
setPayments(result.payments);
|
|
3389
|
-
}).catch((err) => {
|
|
3390
|
-
console.error("[PaymentHistoryView] Failed to fetch payments:", err);
|
|
3391
|
-
setError(t("account.payments.fetchError"));
|
|
3392
|
-
}).finally(() => {
|
|
3393
|
-
setIsLoading(false);
|
|
3394
|
-
});
|
|
3395
|
-
}, [getPaymentHistory, t]);
|
|
3396
|
-
if (isLoading || isApiLoading) {
|
|
3397
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-8", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse volr:space-y-4", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:py-3", children: [
|
|
3398
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3399
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-32 volr:bg-slate-200 volr:rounded volr:mb-2" }),
|
|
3400
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-3 volr:w-20 volr:bg-slate-100 volr:rounded" })
|
|
3401
|
-
] }),
|
|
3402
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-16 volr:bg-slate-200 volr:rounded" })
|
|
3403
|
-
] }, i)) }) });
|
|
3404
|
-
}
|
|
3405
|
-
if (error) {
|
|
3406
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-12 volr:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-red-500", children: error }) });
|
|
3407
|
-
}
|
|
3408
|
-
if (payments.length === 0) {
|
|
3409
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-12 volr:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-400", children: t("account.payments.noPayments") }) });
|
|
3410
|
-
}
|
|
3411
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3412
|
-
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.menu.payments") }),
|
|
3413
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { children: payments.map((payment) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
3414
|
-
PaymentRow,
|
|
3415
|
-
{
|
|
3416
|
-
payment,
|
|
3417
|
-
onClick: () => onSelectPayment(payment)
|
|
3418
|
-
},
|
|
3419
|
-
payment.id
|
|
3420
|
-
)) })
|
|
3421
|
-
] });
|
|
3422
|
-
}
|
|
3423
|
-
function DetailRow({ label, value, copyable, mono }) {
|
|
3424
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-start volr:justify-between volr:py-2 volr:border-b volr:border-slate-100 last:volr:border-b-0", children: [
|
|
3425
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:text-slate-500", children: label }),
|
|
3426
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2", children: [
|
|
3432
|
+
)
|
|
3433
|
+
}
|
|
3434
|
+
),
|
|
3435
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:absolute volr:inset-0 volr:pointer-events-none volr:overflow-visible", children: [
|
|
3427
3436
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3428
|
-
"
|
|
3437
|
+
"div",
|
|
3429
3438
|
{
|
|
3430
|
-
className:
|
|
3431
|
-
|
|
3439
|
+
className: "volr:absolute volr:w-2 volr:h-2 volr:bg-emerald-400 volr:rounded-full volr:opacity-0",
|
|
3440
|
+
style: {
|
|
3441
|
+
top: "20%",
|
|
3442
|
+
left: "20%",
|
|
3443
|
+
animation: "volrParticle1 1s ease-out forwards"
|
|
3444
|
+
}
|
|
3432
3445
|
}
|
|
3433
3446
|
),
|
|
3434
|
-
copyable && /* @__PURE__ */ jsxRuntime.jsx(CopyButton, { text: value, className: "volr:shrink-0" })
|
|
3435
|
-
] })
|
|
3436
|
-
] });
|
|
3437
|
-
}
|
|
3438
|
-
function PaymentDetailView({ payment }) {
|
|
3439
|
-
const { t } = useI18n();
|
|
3440
|
-
const createdDate = new Date(payment.createdAt);
|
|
3441
|
-
const formattedCreatedAt = createdDate.toLocaleString(void 0, {
|
|
3442
|
-
year: "numeric",
|
|
3443
|
-
month: "short",
|
|
3444
|
-
day: "numeric",
|
|
3445
|
-
hour: "2-digit",
|
|
3446
|
-
minute: "2-digit"
|
|
3447
|
-
});
|
|
3448
|
-
const confirmedDate = payment.confirmedAt ? new Date(payment.confirmedAt) : null;
|
|
3449
|
-
const formattedConfirmedAt = confirmedDate ? confirmedDate.toLocaleString(void 0, {
|
|
3450
|
-
year: "numeric",
|
|
3451
|
-
month: "short",
|
|
3452
|
-
day: "numeric",
|
|
3453
|
-
hour: "2-digit",
|
|
3454
|
-
minute: "2-digit"
|
|
3455
|
-
}) : null;
|
|
3456
|
-
const statusColors = {
|
|
3457
|
-
CONFIRMED: "volr:bg-green-100 volr:text-green-700",
|
|
3458
|
-
PENDING: "volr:bg-yellow-100 volr:text-yellow-700",
|
|
3459
|
-
PROCESSING: "volr:bg-blue-100 volr:text-blue-700",
|
|
3460
|
-
FAILED: "volr:bg-red-100 volr:text-red-700",
|
|
3461
|
-
CANCELLED: "volr:bg-slate-100 volr:text-slate-500",
|
|
3462
|
-
EXPIRED: "volr:bg-slate-100 volr:text-slate-500"
|
|
3463
|
-
};
|
|
3464
|
-
const truncateHash = (hash) => {
|
|
3465
|
-
if (hash.length <= 16) return hash;
|
|
3466
|
-
return `${hash.slice(0, 8)}...${hash.slice(-6)}`;
|
|
3467
|
-
};
|
|
3468
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3469
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-6", children: [
|
|
3470
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2 volr:mb-2", children: [
|
|
3471
|
-
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900", children: payment.itemName || t("account.payments.payment") }),
|
|
3472
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3473
|
-
"span",
|
|
3474
|
-
{
|
|
3475
|
-
className: `volr:px-2 volr:py-0.5 volr:text-xs volr:font-medium volr:rounded ${statusColors[payment.status] || "volr:bg-slate-100 volr:text-slate-500"}`,
|
|
3476
|
-
children: payment.status
|
|
3477
|
-
}
|
|
3478
|
-
)
|
|
3479
|
-
] }),
|
|
3480
|
-
payment.itemDescription && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500", children: payment.itemDescription })
|
|
3481
|
-
] }),
|
|
3482
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-4 volr:mb-4 volr:border-y volr:border-slate-100", children: [
|
|
3483
|
-
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-2xl volr:font-semibold volr:text-slate-900", children: [
|
|
3484
|
-
payment.amount,
|
|
3485
|
-
" ",
|
|
3486
|
-
payment.token.symbol
|
|
3487
|
-
] }),
|
|
3488
|
-
payment.totalUsd && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-sm volr:text-slate-500", children: [
|
|
3489
|
-
"\u2248 $",
|
|
3490
|
-
parseFloat(payment.totalUsd).toFixed(2),
|
|
3491
|
-
" USD"
|
|
3492
|
-
] })
|
|
3493
|
-
] }),
|
|
3494
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-1", children: [
|
|
3495
|
-
/* @__PURE__ */ jsxRuntime.jsx(DetailRow, { label: t("account.payments.createdAt"), value: formattedCreatedAt }),
|
|
3496
|
-
formattedConfirmedAt && /* @__PURE__ */ jsxRuntime.jsx(DetailRow, { label: t("account.payments.confirmedAt"), value: formattedConfirmedAt }),
|
|
3497
3447
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3498
|
-
|
|
3448
|
+
"div",
|
|
3499
3449
|
{
|
|
3500
|
-
|
|
3501
|
-
|
|
3450
|
+
className: "volr:absolute volr:w-1.5 volr:h-1.5 volr:bg-cyan-400 volr:rounded-full volr:opacity-0",
|
|
3451
|
+
style: {
|
|
3452
|
+
top: "30%",
|
|
3453
|
+
right: "25%",
|
|
3454
|
+
animation: "volrParticle2 1.2s ease-out 0.1s forwards"
|
|
3455
|
+
}
|
|
3502
3456
|
}
|
|
3503
3457
|
),
|
|
3504
|
-
|
|
3505
|
-
|
|
3458
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3459
|
+
"div",
|
|
3506
3460
|
{
|
|
3507
|
-
|
|
3508
|
-
|
|
3509
|
-
|
|
3510
|
-
|
|
3461
|
+
className: "volr:absolute volr:w-2 volr:h-2 volr:bg-teal-400 volr:rounded-full volr:opacity-0",
|
|
3462
|
+
style: {
|
|
3463
|
+
bottom: "25%",
|
|
3464
|
+
left: "30%",
|
|
3465
|
+
animation: "volrParticle3 1.1s ease-out 0.2s forwards"
|
|
3466
|
+
}
|
|
3511
3467
|
}
|
|
3512
3468
|
),
|
|
3513
|
-
|
|
3514
|
-
|
|
3469
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3470
|
+
"div",
|
|
3515
3471
|
{
|
|
3516
|
-
|
|
3517
|
-
|
|
3518
|
-
|
|
3472
|
+
className: "volr:absolute volr:w-1.5 volr:h-1.5 volr:bg-emerald-300 volr:rounded-full volr:opacity-0",
|
|
3473
|
+
style: {
|
|
3474
|
+
bottom: "30%",
|
|
3475
|
+
right: "20%",
|
|
3476
|
+
animation: "volrParticle4 1.3s ease-out 0.15s forwards"
|
|
3477
|
+
}
|
|
3519
3478
|
}
|
|
3520
3479
|
)
|
|
3521
3480
|
] }),
|
|
3522
|
-
|
|
3523
|
-
|
|
3524
|
-
|
|
3525
|
-
|
|
3526
|
-
|
|
3527
|
-
|
|
3528
|
-
|
|
3529
|
-
|
|
3530
|
-
|
|
3531
|
-
|
|
3532
|
-
|
|
3533
|
-
|
|
3534
|
-
|
|
3535
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:gap-2", children: [
|
|
3536
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3537
|
-
"p",
|
|
3538
|
-
{
|
|
3539
|
-
className: `volr:text-sm volr:text-slate-900 volr:break-all ${mono ? "volr:font-mono" : ""}`,
|
|
3540
|
-
children: value
|
|
3481
|
+
/* @__PURE__ */ jsxRuntime.jsx("style", { children: `
|
|
3482
|
+
@keyframes volrGlowPulse {
|
|
3483
|
+
0% {
|
|
3484
|
+
transform: scale(0.5);
|
|
3485
|
+
opacity: 0;
|
|
3486
|
+
}
|
|
3487
|
+
40% {
|
|
3488
|
+
opacity: 1;
|
|
3489
|
+
}
|
|
3490
|
+
100% {
|
|
3491
|
+
transform: scale(1.6);
|
|
3492
|
+
opacity: 0;
|
|
3493
|
+
}
|
|
3541
3494
|
}
|
|
3542
|
-
|
|
3543
|
-
|
|
3544
|
-
|
|
3545
|
-
|
|
3546
|
-
}
|
|
3547
|
-
|
|
3548
|
-
|
|
3549
|
-
|
|
3550
|
-
|
|
3551
|
-
|
|
3552
|
-
|
|
3553
|
-
|
|
3554
|
-
|
|
3555
|
-
|
|
3556
|
-
|
|
3557
|
-
return t("account.info.loginMethod.twitter");
|
|
3558
|
-
}
|
|
3559
|
-
if (user.email?.includes("@wallet.")) {
|
|
3560
|
-
return t("account.info.loginMethod.wallet");
|
|
3561
|
-
}
|
|
3562
|
-
return t("account.info.loginMethod.email");
|
|
3563
|
-
};
|
|
3564
|
-
const formatAddress = (address) => {
|
|
3565
|
-
if (address.length <= 16) return address;
|
|
3566
|
-
return `${address.slice(0, 6)}...${address.slice(-4)}`;
|
|
3567
|
-
};
|
|
3568
|
-
const externalWallet = user.authWallet ? user.authWallet.split(":")[1] || user.authWallet : null;
|
|
3569
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3570
|
-
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.menu.account") }),
|
|
3571
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
3572
|
-
/* @__PURE__ */ jsxRuntime.jsx(InfoRow, { label: t("account.info.loginMethod.label"), value: getLoginMethod() }),
|
|
3573
|
-
user.email && !user.email.includes("@wallet.") && /* @__PURE__ */ jsxRuntime.jsx(InfoRow, { label: t("account.email"), value: user.email }),
|
|
3574
|
-
user.evmAddress && /* @__PURE__ */ jsxRuntime.jsx(
|
|
3575
|
-
InfoRow,
|
|
3576
|
-
{
|
|
3577
|
-
label: t("account.walletAddress"),
|
|
3578
|
-
value: formatAddress(user.evmAddress),
|
|
3579
|
-
copyable: true,
|
|
3580
|
-
mono: true
|
|
3495
|
+
@keyframes volrBounceIn {
|
|
3496
|
+
0% {
|
|
3497
|
+
transform: scale(0);
|
|
3498
|
+
opacity: 0;
|
|
3499
|
+
}
|
|
3500
|
+
50% {
|
|
3501
|
+
transform: scale(1.2);
|
|
3502
|
+
}
|
|
3503
|
+
70% {
|
|
3504
|
+
transform: scale(0.9);
|
|
3505
|
+
}
|
|
3506
|
+
100% {
|
|
3507
|
+
transform: scale(1);
|
|
3508
|
+
opacity: 1;
|
|
3509
|
+
}
|
|
3581
3510
|
}
|
|
3582
|
-
|
|
3583
|
-
|
|
3584
|
-
|
|
3585
|
-
|
|
3586
|
-
|
|
3587
|
-
|
|
3588
|
-
|
|
3589
|
-
mono: true
|
|
3511
|
+
@keyframes volrPulseGlow {
|
|
3512
|
+
0%, 100% {
|
|
3513
|
+
opacity: 0.6;
|
|
3514
|
+
}
|
|
3515
|
+
50% {
|
|
3516
|
+
opacity: 1;
|
|
3517
|
+
}
|
|
3590
3518
|
}
|
|
3591
|
-
|
|
3592
|
-
|
|
3593
|
-
|
|
3594
|
-
|
|
3595
|
-
|
|
3596
|
-
|
|
3519
|
+
@keyframes volrParticle1 {
|
|
3520
|
+
0% {
|
|
3521
|
+
transform: translate(0, 0) scale(0);
|
|
3522
|
+
opacity: 0;
|
|
3523
|
+
}
|
|
3524
|
+
20% {
|
|
3525
|
+
opacity: 1;
|
|
3526
|
+
}
|
|
3527
|
+
100% {
|
|
3528
|
+
transform: translate(-20px, -30px) scale(1);
|
|
3529
|
+
opacity: 0;
|
|
3530
|
+
}
|
|
3597
3531
|
}
|
|
3598
|
-
|
|
3599
|
-
|
|
3600
|
-
|
|
3601
|
-
|
|
3602
|
-
|
|
3603
|
-
|
|
3604
|
-
|
|
3605
|
-
|
|
3606
|
-
|
|
3607
|
-
|
|
3608
|
-
|
|
3609
|
-
|
|
3610
|
-
onClose();
|
|
3611
|
-
setTimeout(() => {
|
|
3612
|
-
setCurrentView("main");
|
|
3613
|
-
setSelectedPayment(null);
|
|
3614
|
-
}, 200);
|
|
3615
|
-
}
|
|
3616
|
-
}, [onClose]);
|
|
3617
|
-
if (!user) {
|
|
3618
|
-
return /* @__PURE__ */ jsxRuntime.jsx(SigninModal, { isOpen, onClose, onError });
|
|
3619
|
-
}
|
|
3620
|
-
if (!user.keyStorageType) {
|
|
3621
|
-
const handlePasskeyComplete = () => {
|
|
3622
|
-
onClose();
|
|
3623
|
-
};
|
|
3624
|
-
const handlePasskeyError = (error) => {
|
|
3625
|
-
if (onError) onError(error);
|
|
3626
|
-
};
|
|
3627
|
-
const handleLogoutFromPasskey = async () => {
|
|
3628
|
-
try {
|
|
3629
|
-
await logout();
|
|
3630
|
-
onClose();
|
|
3631
|
-
} catch (error) {
|
|
3632
|
-
if (onError) {
|
|
3633
|
-
onError(error instanceof Error ? error : new Error("Logout failed"));
|
|
3532
|
+
@keyframes volrParticle2 {
|
|
3533
|
+
0% {
|
|
3534
|
+
transform: translate(0, 0) scale(0);
|
|
3535
|
+
opacity: 0;
|
|
3536
|
+
}
|
|
3537
|
+
20% {
|
|
3538
|
+
opacity: 1;
|
|
3539
|
+
}
|
|
3540
|
+
100% {
|
|
3541
|
+
transform: translate(25px, -35px) scale(1);
|
|
3542
|
+
opacity: 0;
|
|
3543
|
+
}
|
|
3634
3544
|
}
|
|
3635
|
-
|
|
3636
|
-
|
|
3637
|
-
|
|
3638
|
-
|
|
3639
|
-
{
|
|
3640
|
-
wrapInModal: false,
|
|
3641
|
-
onComplete: handlePasskeyComplete,
|
|
3642
|
-
onError: handlePasskeyError,
|
|
3643
|
-
onLogout: handleLogoutFromPasskey,
|
|
3644
|
-
onClose
|
|
3645
|
-
}
|
|
3646
|
-
) });
|
|
3647
|
-
}
|
|
3648
|
-
const handleLogout = async () => {
|
|
3649
|
-
setIsLoggingOut(true);
|
|
3650
|
-
try {
|
|
3651
|
-
await logout();
|
|
3652
|
-
onClose();
|
|
3653
|
-
} catch (error) {
|
|
3654
|
-
if (onError) {
|
|
3655
|
-
onError(error instanceof Error ? error : new Error("Logout failed"));
|
|
3656
|
-
}
|
|
3657
|
-
} finally {
|
|
3658
|
-
setIsLoggingOut(false);
|
|
3659
|
-
}
|
|
3660
|
-
};
|
|
3661
|
-
const handleNavigate = (view) => {
|
|
3662
|
-
setCurrentView(view);
|
|
3663
|
-
};
|
|
3664
|
-
const handleBack = () => {
|
|
3665
|
-
if (selectedPayment) {
|
|
3666
|
-
setSelectedPayment(null);
|
|
3667
|
-
setCurrentView("payments");
|
|
3668
|
-
} else {
|
|
3669
|
-
setCurrentView("main");
|
|
3670
|
-
}
|
|
3671
|
-
};
|
|
3672
|
-
const handleSelectPayment = (payment) => {
|
|
3673
|
-
setSelectedPayment(payment);
|
|
3674
|
-
};
|
|
3675
|
-
const handleWithdrawSuccess = () => {
|
|
3676
|
-
refresh();
|
|
3677
|
-
setCurrentView("main");
|
|
3678
|
-
};
|
|
3679
|
-
const showBack = currentView !== "main" || selectedPayment !== null;
|
|
3680
|
-
const renderContent = () => {
|
|
3681
|
-
if (selectedPayment) {
|
|
3682
|
-
return /* @__PURE__ */ jsxRuntime.jsx(PaymentDetailView, { payment: selectedPayment });
|
|
3683
|
-
}
|
|
3684
|
-
switch (currentView) {
|
|
3685
|
-
case "main":
|
|
3686
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3687
|
-
AccountMainView,
|
|
3688
|
-
{
|
|
3689
|
-
totalUsd,
|
|
3690
|
-
balances,
|
|
3691
|
-
isLoading,
|
|
3692
|
-
paymentEnabled,
|
|
3693
|
-
onNavigate: handleNavigate,
|
|
3694
|
-
onLogout: handleLogout,
|
|
3695
|
-
isLoggingOut
|
|
3545
|
+
@keyframes volrParticle3 {
|
|
3546
|
+
0% {
|
|
3547
|
+
transform: translate(0, 0) scale(0);
|
|
3548
|
+
opacity: 0;
|
|
3696
3549
|
}
|
|
3697
|
-
|
|
3698
|
-
|
|
3699
|
-
return /* @__PURE__ */ jsxRuntime.jsx(BalanceDetailView, { balances, isLoading });
|
|
3700
|
-
case "withdraw":
|
|
3701
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3702
|
-
WithdrawView,
|
|
3703
|
-
{
|
|
3704
|
-
balances,
|
|
3705
|
-
connectedWallet: user.authWallet,
|
|
3706
|
-
onSuccess: handleWithdrawSuccess
|
|
3550
|
+
20% {
|
|
3551
|
+
opacity: 1;
|
|
3707
3552
|
}
|
|
3708
|
-
|
|
3709
|
-
|
|
3710
|
-
|
|
3711
|
-
|
|
3712
|
-
|
|
3713
|
-
|
|
3714
|
-
|
|
3715
|
-
|
|
3553
|
+
100% {
|
|
3554
|
+
transform: translate(-30px, 25px) scale(1);
|
|
3555
|
+
opacity: 0;
|
|
3556
|
+
}
|
|
3557
|
+
}
|
|
3558
|
+
@keyframes volrParticle4 {
|
|
3559
|
+
0% {
|
|
3560
|
+
transform: translate(0, 0) scale(0);
|
|
3561
|
+
opacity: 0;
|
|
3562
|
+
}
|
|
3563
|
+
20% {
|
|
3564
|
+
opacity: 1;
|
|
3565
|
+
}
|
|
3566
|
+
100% {
|
|
3567
|
+
transform: translate(30px, 30px) scale(1);
|
|
3568
|
+
opacity: 0;
|
|
3569
|
+
}
|
|
3570
|
+
}
|
|
3571
|
+
` })
|
|
3572
|
+
] });
|
|
3573
|
+
};
|
|
3574
|
+
var DepositCompletedToast = ({
|
|
3575
|
+
onClose,
|
|
3576
|
+
previousBalance,
|
|
3577
|
+
newBalance,
|
|
3578
|
+
delta,
|
|
3579
|
+
decimals,
|
|
3580
|
+
symbol
|
|
3581
|
+
}) => {
|
|
3582
|
+
const { t } = useI18n();
|
|
3583
|
+
const [expanded, setExpanded] = React13.useState(false);
|
|
3584
|
+
const formatAmount = (amount) => {
|
|
3585
|
+
const divisor = BigInt(10 ** decimals);
|
|
3586
|
+
const whole = amount / divisor;
|
|
3587
|
+
const fraction = amount % divisor;
|
|
3588
|
+
const fractionStr = fraction.toString().padStart(decimals, "0").slice(0, 4);
|
|
3589
|
+
const trimmedFraction = fractionStr.replace(/0+$/, "");
|
|
3590
|
+
return trimmedFraction ? `${whole}.${trimmedFraction}` : `${whole}`;
|
|
3716
3591
|
};
|
|
3717
|
-
|
|
3718
|
-
|
|
3719
|
-
|
|
3592
|
+
const formattedDelta = formatAmount(delta);
|
|
3593
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
3594
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
3595
|
+
"div",
|
|
3720
3596
|
{
|
|
3721
|
-
|
|
3722
|
-
|
|
3723
|
-
|
|
3597
|
+
className: cn(
|
|
3598
|
+
// Position: centered at bottom with margin
|
|
3599
|
+
"volr:absolute volr:bottom-3 volr:left-0 volr:right-0 volr:z-50",
|
|
3600
|
+
// Appearance: floating card
|
|
3601
|
+
"volr:bg-white volr:rounded-2xl",
|
|
3602
|
+
// Border: full border for clear card definition
|
|
3603
|
+
"volr:border volr:border-slate-200",
|
|
3604
|
+
// Shadow: strong shadow for floating effect
|
|
3605
|
+
"volr:shadow-2xl",
|
|
3606
|
+
// Animation
|
|
3607
|
+
"volr:transition-all volr:duration-300 volr:ease-out"
|
|
3608
|
+
),
|
|
3609
|
+
style: {
|
|
3610
|
+
animation: "volrSlideUp 0.3s ease-out"
|
|
3611
|
+
},
|
|
3612
|
+
children: [
|
|
3613
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-1 volr:bg-linear-to-r volr:from-emerald-400 volr:to-teal-500 volr:rounded-t-2xl" }),
|
|
3614
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:p-4", children: [
|
|
3615
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:gap-2 volr:mb-2", children: [
|
|
3616
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2", children: [
|
|
3617
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:shrink-0 volr:w-5 volr:h-5 volr:rounded-full volr:bg-emerald-500 volr:flex volr:items-center volr:justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3618
|
+
"svg",
|
|
3619
|
+
{
|
|
3620
|
+
width: "12",
|
|
3621
|
+
height: "12",
|
|
3622
|
+
viewBox: "0 0 24 24",
|
|
3623
|
+
fill: "none",
|
|
3624
|
+
stroke: "white",
|
|
3625
|
+
strokeWidth: "3",
|
|
3626
|
+
strokeLinecap: "round",
|
|
3627
|
+
strokeLinejoin: "round",
|
|
3628
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" })
|
|
3629
|
+
}
|
|
3630
|
+
) }),
|
|
3631
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-semibold volr:text-slate-900", children: t("deposit.completed") })
|
|
3632
|
+
] }),
|
|
3633
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3634
|
+
"button",
|
|
3635
|
+
{
|
|
3636
|
+
onClick: onClose,
|
|
3637
|
+
className: "volr:shrink-0 volr:w-6 volr:h-6 volr:flex volr:items-center volr:justify-center volr:rounded-full volr:transition-colors volr:bg-slate-100 volr:text-slate-500 volr:hover:bg-slate-200",
|
|
3638
|
+
"aria-label": "Close",
|
|
3639
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3640
|
+
"svg",
|
|
3641
|
+
{
|
|
3642
|
+
width: "14",
|
|
3643
|
+
height: "14",
|
|
3644
|
+
viewBox: "0 0 24 24",
|
|
3645
|
+
fill: "none",
|
|
3646
|
+
stroke: "currentColor",
|
|
3647
|
+
strokeWidth: "2.5",
|
|
3648
|
+
children: [
|
|
3649
|
+
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
3650
|
+
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
3651
|
+
]
|
|
3652
|
+
}
|
|
3653
|
+
)
|
|
3654
|
+
}
|
|
3655
|
+
)
|
|
3656
|
+
] }),
|
|
3657
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-700 volr:mb-3", children: t("deposit.completedAmount", { amount: formattedDelta, symbol }) }),
|
|
3658
|
+
expanded && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3659
|
+
"div",
|
|
3660
|
+
{
|
|
3661
|
+
className: "volr:space-y-2 volr:mb-3 volr:p-3 volr:rounded-lg volr:bg-slate-50 volr:border volr:border-slate-200",
|
|
3662
|
+
style: { animation: "volrFadeIn 0.2s ease-out" },
|
|
3663
|
+
children: [
|
|
3664
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs", children: [
|
|
3665
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("deposit.amount") }),
|
|
3666
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:text-emerald-600 volr:font-semibold", children: [
|
|
3667
|
+
"+",
|
|
3668
|
+
formattedDelta,
|
|
3669
|
+
" ",
|
|
3670
|
+
symbol
|
|
3671
|
+
] })
|
|
3672
|
+
] }),
|
|
3673
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs", children: [
|
|
3674
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("deposit.previousBalance") }),
|
|
3675
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:text-slate-500", children: [
|
|
3676
|
+
formatAmount(previousBalance),
|
|
3677
|
+
" ",
|
|
3678
|
+
symbol
|
|
3679
|
+
] })
|
|
3680
|
+
] }),
|
|
3681
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs volr:pt-2 volr:border-t volr:border-slate-200", children: [
|
|
3682
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("deposit.newBalance") }),
|
|
3683
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:font-semibold volr:text-slate-900", children: [
|
|
3684
|
+
formatAmount(newBalance),
|
|
3685
|
+
" ",
|
|
3686
|
+
symbol
|
|
3687
|
+
] })
|
|
3688
|
+
] })
|
|
3689
|
+
]
|
|
3690
|
+
}
|
|
3691
|
+
),
|
|
3692
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3693
|
+
"button",
|
|
3694
|
+
{
|
|
3695
|
+
onClick: () => setExpanded(!expanded),
|
|
3696
|
+
className: "volr:w-full volr:py-2.5 volr:text-xs volr:font-medium volr:rounded-lg volr:transition-colors volr:bg-slate-100 volr:text-slate-600 volr:border volr:border-slate-200 volr:hover:bg-slate-200",
|
|
3697
|
+
children: expanded ? t("deposit.seeLess") : t("deposit.seeMore")
|
|
3698
|
+
}
|
|
3699
|
+
)
|
|
3700
|
+
] })
|
|
3701
|
+
]
|
|
3724
3702
|
}
|
|
3725
3703
|
),
|
|
3726
|
-
|
|
3704
|
+
/* @__PURE__ */ jsxRuntime.jsx("style", { children: `
|
|
3705
|
+
@keyframes volrSlideUp {
|
|
3706
|
+
from {
|
|
3707
|
+
transform: translateY(20px);
|
|
3708
|
+
opacity: 0;
|
|
3709
|
+
}
|
|
3710
|
+
to {
|
|
3711
|
+
transform: translateY(0);
|
|
3712
|
+
opacity: 1;
|
|
3713
|
+
}
|
|
3714
|
+
}
|
|
3715
|
+
@keyframes volrFadeIn {
|
|
3716
|
+
from {
|
|
3717
|
+
opacity: 0;
|
|
3718
|
+
}
|
|
3719
|
+
to {
|
|
3720
|
+
opacity: 1;
|
|
3721
|
+
}
|
|
3722
|
+
}
|
|
3723
|
+
` })
|
|
3727
3724
|
] });
|
|
3728
|
-
}
|
|
3729
|
-
|
|
3730
|
-
|
|
3731
|
-
|
|
3732
|
-
})
|
|
3733
|
-
|
|
3734
|
-
|
|
3735
|
-
/* @__PURE__ */ jsxRuntime.jsx("
|
|
3736
|
-
/* @__PURE__ */ jsxRuntime.
|
|
3737
|
-
|
|
3738
|
-
|
|
3739
|
-
|
|
3740
|
-
|
|
3741
|
-
|
|
3742
|
-
"button",
|
|
3743
|
-
{
|
|
3744
|
-
className: cn(
|
|
3745
|
-
"volr:w-full volr:p-4 volr:rounded-xl volr:border-2",
|
|
3746
|
-
"volr:text-left volr:transition-all",
|
|
3747
|
-
"volr:flex volr:items-center volr:gap-4",
|
|
3748
|
-
"volr-border volr-hover"
|
|
3749
|
-
),
|
|
3750
|
-
onClick: () => onSelect(idx),
|
|
3751
|
-
children: [
|
|
3752
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:shrink-0", children: !isNative && a.token.iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
3753
|
-
"img",
|
|
3754
|
-
{
|
|
3755
|
-
alt: a.token.symbol,
|
|
3756
|
-
src: a.token.iconUrl,
|
|
3757
|
-
className: "volr:w-10 volr:h-10 volr:rounded-full volr:border volr-border"
|
|
3758
|
-
}
|
|
3759
|
-
) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-10 volr:h-10 volr:rounded-full volr:flex volr:items-center volr:justify-center volr:text-white volr:font-bold volr:text-sm volr-bg-tertiary", children: tokenSymbol.slice(0, 2) }) }),
|
|
3760
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1 volr:min-w-0", children: [
|
|
3761
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2 volr:mb-1", children: [
|
|
3762
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-base volr:font-semibold", children: tokenSymbol }),
|
|
3763
|
-
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:text-xs volr:px-2 volr:py-0.5 volr:rounded-full volr:font-medium volr-bg-secondary volr-text-secondary", children: [
|
|
3764
|
-
"Chain ",
|
|
3765
|
-
a.chainId
|
|
3766
|
-
] })
|
|
3767
|
-
] }),
|
|
3768
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-sm volr-text-secondary", children: tokenName }),
|
|
3769
|
-
!isNative && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-xs volr:font-mono volr:truncate volr:mt-1 volr-text-muted", children: a.token.address })
|
|
3770
|
-
] }),
|
|
3771
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:shrink-0 volr-text-muted", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "9 18 15 12 9 6" }) }) })
|
|
3772
|
-
]
|
|
3773
|
-
},
|
|
3774
|
-
`${a.chainId}-${idx}`
|
|
3775
|
-
);
|
|
3776
|
-
}) })
|
|
3725
|
+
};
|
|
3726
|
+
var DepositSkeleton = () => {
|
|
3727
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:animate-pulse", children: [
|
|
3728
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
3729
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-7 volr:w-24 volr:rounded volr:mb-2 volr-bg-tertiary" }),
|
|
3730
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-8 volr:w-36 volr:rounded-lg volr-bg-secondary" })
|
|
3731
|
+
] }),
|
|
3732
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:justify-center volr:mb-3", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:rounded-xl volr:p-3 volr:border volr-bg-secondary volr-border", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-[200px] volr:h-[200px] volr:rounded-lg volr-bg-tertiary" }) }) }),
|
|
3733
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-center volr:gap-2 volr:mb-3", children: [
|
|
3734
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-1.5 volr:h-1.5 volr:rounded-full volr-bg-tertiary" }),
|
|
3735
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-3 volr:w-32 volr:rounded volr-bg-tertiary" })
|
|
3736
|
+
] }),
|
|
3737
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:space-y-3", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:border volr:rounded-lg volr:p-3 volr-bg-secondary volr-border", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:items-center volr:justify-center", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-48 volr:rounded volr-bg-tertiary" }) }) }) }),
|
|
3738
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-center volr:pt-3 volr:border-t volr:mt-3 volr-border", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-3 volr:w-44 volr:rounded volr:mx-auto volr-bg-secondary" }) })
|
|
3777
3739
|
] });
|
|
3778
|
-
}
|
|
3779
|
-
|
|
3780
|
-
|
|
3781
|
-
|
|
3782
|
-
|
|
3783
|
-
|
|
3784
|
-
|
|
3785
|
-
|
|
3786
|
-
|
|
3787
|
-
|
|
3788
|
-
|
|
3789
|
-
|
|
3790
|
-
|
|
3791
|
-
|
|
3792
|
-
|
|
3793
|
-
|
|
3740
|
+
};
|
|
3741
|
+
function DepositQRView(props) {
|
|
3742
|
+
const { t } = useI18n();
|
|
3743
|
+
const { config } = react.useVolrContext();
|
|
3744
|
+
const { client } = react.useInternalAuth();
|
|
3745
|
+
const [chainName, setChainName] = React13.useState(null);
|
|
3746
|
+
const [showOtherTokenModal, setShowOtherTokenModal] = React13.useState(false);
|
|
3747
|
+
const [showToast, setShowToast] = React13.useState(false);
|
|
3748
|
+
const [toastData, setToastData] = React13.useState(null);
|
|
3749
|
+
const [viewMode, setViewMode] = React13.useState("qr");
|
|
3750
|
+
const eip681 = `ethereum:${props.address}`;
|
|
3751
|
+
const status = react.useDepositListener({
|
|
3752
|
+
chainId: props.chainId,
|
|
3753
|
+
asset: props.asset === "native" ? { kind: "native" } : {
|
|
3754
|
+
kind: "erc20",
|
|
3755
|
+
token: {
|
|
3756
|
+
address: props.asset.address,
|
|
3757
|
+
decimals: props.asset.decimals
|
|
3758
|
+
}
|
|
3759
|
+
},
|
|
3760
|
+
address: props.address
|
|
3761
|
+
});
|
|
3762
|
+
React13.useEffect(() => {
|
|
3763
|
+
if (status.state === "detected") {
|
|
3764
|
+
setToastData({
|
|
3765
|
+
previousBalance: status.previousBalance,
|
|
3766
|
+
newBalance: status.newBalance,
|
|
3767
|
+
delta: status.delta
|
|
3768
|
+
});
|
|
3769
|
+
setShowToast(true);
|
|
3794
3770
|
}
|
|
3771
|
+
}, [status]);
|
|
3772
|
+
const getNetworkInfo = React13.useCallback(
|
|
3773
|
+
react.createGetNetworkInfo({ client, rpcOverrides: config.rpcOverrides }),
|
|
3774
|
+
[client, config.rpcOverrides]
|
|
3795
3775
|
);
|
|
3796
|
-
|
|
3797
|
-
|
|
3798
|
-
|
|
3799
|
-
|
|
3800
|
-
|
|
3801
|
-
|
|
3802
|
-
|
|
3803
|
-
|
|
3804
|
-
|
|
3805
|
-
|
|
3806
|
-
|
|
3807
|
-
|
|
3808
|
-
|
|
3809
|
-
};
|
|
3810
|
-
|
|
3811
|
-
|
|
3812
|
-
|
|
3813
|
-
|
|
3814
|
-
|
|
3815
|
-
|
|
3816
|
-
|
|
3817
|
-
|
|
3818
|
-
|
|
3819
|
-
|
|
3820
|
-
|
|
3821
|
-
|
|
3822
|
-
|
|
3823
|
-
|
|
3824
|
-
|
|
3825
|
-
|
|
3826
|
-
|
|
3827
|
-
|
|
3828
|
-
|
|
3829
|
-
|
|
3830
|
-
|
|
3831
|
-
|
|
3832
|
-
|
|
3833
|
-
|
|
3834
|
-
|
|
3835
|
-
|
|
3836
|
-
|
|
3837
|
-
|
|
3838
|
-
|
|
3839
|
-
|
|
3840
|
-
|
|
3841
|
-
|
|
3842
|
-
|
|
3843
|
-
|
|
3844
|
-
|
|
3845
|
-
|
|
3846
|
-
|
|
3847
|
-
integer = `${BigInt(integer) + 1n}`;
|
|
3848
|
-
}
|
|
3849
|
-
fraction = fraction.slice(0, decimals);
|
|
3850
|
-
} else {
|
|
3851
|
-
fraction = fraction.padEnd(decimals, "0");
|
|
3776
|
+
React13.useEffect(() => {
|
|
3777
|
+
let cancelled = false;
|
|
3778
|
+
const loadChainName = async () => {
|
|
3779
|
+
try {
|
|
3780
|
+
const info = await getNetworkInfo(props.chainId, false);
|
|
3781
|
+
if (!cancelled) {
|
|
3782
|
+
setChainName(info.name);
|
|
3783
|
+
}
|
|
3784
|
+
} catch (error) {
|
|
3785
|
+
if (!cancelled) {
|
|
3786
|
+
setChainName(`Chain ${props.chainId}`);
|
|
3787
|
+
}
|
|
3788
|
+
}
|
|
3789
|
+
};
|
|
3790
|
+
loadChainName();
|
|
3791
|
+
return () => {
|
|
3792
|
+
cancelled = true;
|
|
3793
|
+
};
|
|
3794
|
+
}, [getNetworkInfo, props.chainId]);
|
|
3795
|
+
const tokenSymbol = props.asset === "native" ? "ETH" : props.asset.symbol;
|
|
3796
|
+
const displayChainName = chainName || `Chain ${props.chainId}`;
|
|
3797
|
+
const decimals = props.asset === "native" ? 18 : props.asset.decimals;
|
|
3798
|
+
if (viewMode === "wallet-transfer") {
|
|
3799
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3800
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3801
|
+
WalletTransferView,
|
|
3802
|
+
{
|
|
3803
|
+
chainId: props.chainId,
|
|
3804
|
+
asset: props.asset,
|
|
3805
|
+
destinationAddress: props.address,
|
|
3806
|
+
onBack: () => setViewMode("qr"),
|
|
3807
|
+
onSuccess: () => {
|
|
3808
|
+
setViewMode("qr");
|
|
3809
|
+
}
|
|
3810
|
+
}
|
|
3811
|
+
),
|
|
3812
|
+
showToast && toastData && /* @__PURE__ */ jsxRuntime.jsx(
|
|
3813
|
+
DepositCompletedToast,
|
|
3814
|
+
{
|
|
3815
|
+
onClose: () => {
|
|
3816
|
+
setShowToast(false);
|
|
3817
|
+
setToastData(null);
|
|
3818
|
+
},
|
|
3819
|
+
previousBalance: toastData.previousBalance,
|
|
3820
|
+
newBalance: toastData.newBalance,
|
|
3821
|
+
delta: toastData.delta,
|
|
3822
|
+
decimals,
|
|
3823
|
+
symbol: tokenSymbol
|
|
3824
|
+
}
|
|
3825
|
+
)
|
|
3826
|
+
] });
|
|
3852
3827
|
}
|
|
3853
|
-
return
|
|
3828
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3829
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
3830
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xl volr:font-semibold volr:mb-2", children: t("deposit.qrTitle") }),
|
|
3831
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:inline-flex volr:items-center volr:gap-2 volr:px-3 volr:py-1.5 volr:rounded-lg volr-bg-secondary", children: [
|
|
3832
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:font-medium", children: tokenSymbol }),
|
|
3833
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr-text-muted", children: "\u2022" }),
|
|
3834
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr-text-secondary", children: displayChainName })
|
|
3835
|
+
] })
|
|
3836
|
+
] }),
|
|
3837
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:justify-center volr:mb-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3838
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:relative volr:rounded-xl volr:p-4 volr:shadow-sm volr:border volr:z-10 volr:bg-white volr-border", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3839
|
+
"img",
|
|
3840
|
+
{
|
|
3841
|
+
alt: "Deposit QR",
|
|
3842
|
+
width: 200,
|
|
3843
|
+
height: 200,
|
|
3844
|
+
src: `https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=${encodeURIComponent(
|
|
3845
|
+
eip681
|
|
3846
|
+
)}`,
|
|
3847
|
+
className: "volr:rounded-md volr:relative volr:z-10"
|
|
3848
|
+
}
|
|
3849
|
+
) }),
|
|
3850
|
+
/* @__PURE__ */ jsxRuntime.jsx(DepositQRStatusOverlay, { status: status.state })
|
|
3851
|
+
] }) }),
|
|
3852
|
+
(status.state === "listening" || status.state === "idle") && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-center volr:gap-2 volr:mb-3", children: [
|
|
3853
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-1.5 volr:h-1.5 volr:rounded-full volr:animate-pulse volr-text-secondary", style: { backgroundColor: "currentColor" } }),
|
|
3854
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr-text-secondary", children: t("deposit.listening") })
|
|
3855
|
+
] }),
|
|
3856
|
+
status.state === "error" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-xs volr:text-center volr:mb-3 volr-error", children: [
|
|
3857
|
+
"Error: ",
|
|
3858
|
+
status.message
|
|
3859
|
+
] }),
|
|
3860
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-3", children: [
|
|
3861
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:relative volr:border volr:rounded-lg volr:p-3 volr:transition-all volr-bg-secondary volr-border volr-hover", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:gap-3", children: [
|
|
3862
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:font-mono volr:text-xs volr:font-medium volr:flex-1 volr:text-center", children: `${props.address.slice(0, 10)}...${props.address.slice(-8)}` }),
|
|
3863
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3864
|
+
CopyButton,
|
|
3865
|
+
{
|
|
3866
|
+
text: props.address,
|
|
3867
|
+
className: "volr:shrink-0 volr:absolute volr:right-2"
|
|
3868
|
+
}
|
|
3869
|
+
)
|
|
3870
|
+
] }) }) }),
|
|
3871
|
+
status.state === "error" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-xs volr:text-center volr:mb-4 volr-error", children: status.message })
|
|
3872
|
+
] }),
|
|
3873
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-4", children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3874
|
+
"button",
|
|
3875
|
+
{
|
|
3876
|
+
type: "button",
|
|
3877
|
+
onClick: () => setViewMode("wallet-transfer"),
|
|
3878
|
+
className: "volr:w-full volr:flex volr:items-center volr:justify-center volr:gap-2 volr:py-3 volr:px-4 volr:border volr:border-slate-200 volr:rounded-xl volr:text-sm volr:font-medium volr:text-slate-700 volr:bg-white volr:hover:bg-slate-50 volr:transition-colors",
|
|
3879
|
+
children: [
|
|
3880
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
3881
|
+
"svg",
|
|
3882
|
+
{
|
|
3883
|
+
className: "volr:w-5 volr:h-5",
|
|
3884
|
+
viewBox: "0 0 24 24",
|
|
3885
|
+
fill: "none",
|
|
3886
|
+
stroke: "currentColor",
|
|
3887
|
+
strokeWidth: "1.5",
|
|
3888
|
+
children: [
|
|
3889
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { x: "2", y: "6", width: "20", height: "14", rx: "2" }),
|
|
3890
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M17 12.5C17 13.3284 16.3284 14 15.5 14C14.6716 14 14 13.3284 14 12.5C14 11.6716 14.6716 11 15.5 11C16.3284 11 17 11.6716 17 12.5Z", fill: "currentColor" }),
|
|
3891
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6 6V5C6 3.89543 6.89543 3 8 3H16C17.1046 3 18 3.89543 18 5V6" })
|
|
3892
|
+
]
|
|
3893
|
+
}
|
|
3894
|
+
),
|
|
3895
|
+
t("deposit.useWallet")
|
|
3896
|
+
]
|
|
3897
|
+
}
|
|
3898
|
+
) }),
|
|
3899
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-center volr:pt-3 volr:mt-3 volr:border-t volr-border", children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:text-xs volr-text-secondary", children: [
|
|
3900
|
+
t("deposit.noToken"),
|
|
3901
|
+
" ",
|
|
3902
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3903
|
+
TextLinkButton,
|
|
3904
|
+
{
|
|
3905
|
+
onClick: () => setShowOtherTokenModal(true),
|
|
3906
|
+
showArrow: true,
|
|
3907
|
+
children: t("deposit.getOtherToken")
|
|
3908
|
+
}
|
|
3909
|
+
)
|
|
3910
|
+
] }) }),
|
|
3911
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3912
|
+
OtherTokenModal,
|
|
3913
|
+
{
|
|
3914
|
+
open: showOtherTokenModal,
|
|
3915
|
+
onOpenChange: setShowOtherTokenModal
|
|
3916
|
+
}
|
|
3917
|
+
),
|
|
3918
|
+
showToast && toastData && /* @__PURE__ */ jsxRuntime.jsx(
|
|
3919
|
+
DepositCompletedToast,
|
|
3920
|
+
{
|
|
3921
|
+
onClose: () => {
|
|
3922
|
+
setShowToast(false);
|
|
3923
|
+
setToastData(null);
|
|
3924
|
+
},
|
|
3925
|
+
previousBalance: toastData.previousBalance,
|
|
3926
|
+
newBalance: toastData.newBalance,
|
|
3927
|
+
delta: toastData.delta,
|
|
3928
|
+
decimals,
|
|
3929
|
+
symbol: tokenSymbol
|
|
3930
|
+
}
|
|
3931
|
+
)
|
|
3932
|
+
] });
|
|
3854
3933
|
}
|
|
3855
|
-
|
|
3856
|
-
|
|
3857
|
-
|
|
3858
|
-
|
|
3859
|
-
|
|
3860
|
-
|
|
3861
|
-
|
|
3862
|
-
|
|
3863
|
-
|
|
3864
|
-
|
|
3865
|
-
|
|
3866
|
-
|
|
3934
|
+
function DepositModalBody({
|
|
3935
|
+
isLoading,
|
|
3936
|
+
error,
|
|
3937
|
+
depositAssets,
|
|
3938
|
+
evmAddress,
|
|
3939
|
+
selectedIdx,
|
|
3940
|
+
onSelectIdx
|
|
3941
|
+
}) {
|
|
3942
|
+
if (isLoading) return /* @__PURE__ */ jsxRuntime.jsx(DepositSkeleton, {});
|
|
3943
|
+
if (error) {
|
|
3944
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3945
|
+
/* @__PURE__ */ jsxRuntime.jsx(DepositSkeleton, {}),
|
|
3867
3946
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3868
|
-
"
|
|
3947
|
+
"div",
|
|
3869
3948
|
{
|
|
3870
|
-
|
|
3871
|
-
|
|
3872
|
-
|
|
3873
|
-
height: "14",
|
|
3874
|
-
rx: "2",
|
|
3875
|
-
stroke: "currentColor",
|
|
3876
|
-
strokeWidth: "1.5"
|
|
3949
|
+
className: "volr:absolute volr:inset-0 volr:flex volr:items-center volr:justify-center volr-surface",
|
|
3950
|
+
style: { opacity: 0.9 },
|
|
3951
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-center volr:px-4 volr-error", children: error })
|
|
3877
3952
|
}
|
|
3878
|
-
)
|
|
3953
|
+
)
|
|
3954
|
+
] });
|
|
3955
|
+
}
|
|
3956
|
+
if (depositAssets.length === 0) {
|
|
3957
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3958
|
+
/* @__PURE__ */ jsxRuntime.jsx(DepositSkeleton, {}),
|
|
3879
3959
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3880
|
-
"
|
|
3960
|
+
"div",
|
|
3881
3961
|
{
|
|
3882
|
-
|
|
3883
|
-
|
|
3962
|
+
className: "volr:absolute volr:inset-0 volr:flex volr:items-center volr:justify-center volr-surface",
|
|
3963
|
+
style: { opacity: 0.9 },
|
|
3964
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-center volr:px-4 volr-text-secondary", children: "No payment token configured. Please contact the app developer." })
|
|
3884
3965
|
}
|
|
3885
|
-
)
|
|
3966
|
+
)
|
|
3967
|
+
] });
|
|
3968
|
+
}
|
|
3969
|
+
if (!evmAddress) {
|
|
3970
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
3971
|
+
/* @__PURE__ */ jsxRuntime.jsx(DepositSkeleton, {}),
|
|
3886
3972
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3887
|
-
"
|
|
3973
|
+
"div",
|
|
3888
3974
|
{
|
|
3889
|
-
|
|
3890
|
-
|
|
3891
|
-
|
|
3975
|
+
className: "volr:absolute volr:inset-0 volr:flex volr:items-center volr:justify-center volr-surface",
|
|
3976
|
+
style: { opacity: 0.9 },
|
|
3977
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-center volr:px-4 volr-text-secondary", children: "Wallet address is not ready. Please finish wallet setup first." })
|
|
3892
3978
|
}
|
|
3893
3979
|
)
|
|
3894
|
-
]
|
|
3980
|
+
] });
|
|
3895
3981
|
}
|
|
3896
|
-
)
|
|
3897
|
-
|
|
3898
|
-
|
|
3899
|
-
|
|
3900
|
-
|
|
3901
|
-
|
|
3902
|
-
|
|
3903
|
-
|
|
3904
|
-
const { t } = useI18n();
|
|
3905
|
-
const { config } = react.useVolrContext();
|
|
3906
|
-
const { client } = react.useInternalAuth();
|
|
3907
|
-
const { isDetecting, getWalletsForDisplay, hasWallet } = react.useEIP6963();
|
|
3908
|
-
const [viewState, setViewState] = React13.useState("select-wallet");
|
|
3909
|
-
const [selectedWallet, setSelectedWallet] = React13.useState(null);
|
|
3910
|
-
const [connectedAddress, setConnectedAddress] = React13.useState(null);
|
|
3911
|
-
const [balance, setBalance] = React13.useState(null);
|
|
3912
|
-
const [amount, setAmount] = React13.useState("");
|
|
3913
|
-
const [isConnecting, setIsConnecting] = React13.useState(false);
|
|
3914
|
-
const [isTransferring, setIsTransferring] = React13.useState(false);
|
|
3915
|
-
const [error, setError] = React13.useState(null);
|
|
3916
|
-
const [chainName, setChainName] = React13.useState(null);
|
|
3917
|
-
const [currentChainId, setCurrentChainId] = React13.useState(null);
|
|
3918
|
-
const tokenSymbol = asset === "native" ? "ETH" : asset.symbol;
|
|
3919
|
-
const decimals = asset === "native" ? 18 : asset.decimals;
|
|
3920
|
-
const getNetworkInfo = React13.useCallback(
|
|
3921
|
-
react.createGetNetworkInfo({ client, rpcOverrides: config.rpcOverrides }),
|
|
3922
|
-
[client, config.rpcOverrides]
|
|
3923
|
-
);
|
|
3924
|
-
React13.useEffect(() => {
|
|
3925
|
-
let cancelled = false;
|
|
3926
|
-
const loadChainName = async () => {
|
|
3927
|
-
try {
|
|
3928
|
-
const info = await getNetworkInfo(chainId, false);
|
|
3929
|
-
if (!cancelled) setChainName(info.name);
|
|
3930
|
-
} catch {
|
|
3931
|
-
if (!cancelled) setChainName(`Chain ${chainId}`);
|
|
3982
|
+
if (depositAssets.length === 1) {
|
|
3983
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3984
|
+
DepositQRView,
|
|
3985
|
+
{
|
|
3986
|
+
chainId: depositAssets[0].chainId,
|
|
3987
|
+
asset: depositAssets[0].token,
|
|
3988
|
+
address: evmAddress,
|
|
3989
|
+
onBack: void 0
|
|
3932
3990
|
}
|
|
3933
|
-
|
|
3934
|
-
|
|
3935
|
-
|
|
3936
|
-
|
|
3937
|
-
|
|
3938
|
-
|
|
3939
|
-
|
|
3940
|
-
|
|
3941
|
-
setError(null);
|
|
3942
|
-
try {
|
|
3943
|
-
const provider = wallet.provider;
|
|
3944
|
-
const accounts = await provider.request({ method: "eth_requestAccounts" });
|
|
3945
|
-
if (!accounts || accounts.length === 0) {
|
|
3946
|
-
throw new Error("No accounts found");
|
|
3991
|
+
);
|
|
3992
|
+
}
|
|
3993
|
+
if (selectedIdx === -1) {
|
|
3994
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3995
|
+
AssetSelectView,
|
|
3996
|
+
{
|
|
3997
|
+
assets: depositAssets,
|
|
3998
|
+
onSelect: (idx) => onSelectIdx(idx)
|
|
3947
3999
|
}
|
|
3948
|
-
|
|
3949
|
-
|
|
3950
|
-
|
|
3951
|
-
|
|
3952
|
-
|
|
3953
|
-
|
|
3954
|
-
|
|
3955
|
-
|
|
3956
|
-
|
|
3957
|
-
|
|
3958
|
-
setError(err instanceof Error ? err.message : "Connection failed");
|
|
3959
|
-
} finally {
|
|
3960
|
-
setIsConnecting(false);
|
|
4000
|
+
);
|
|
4001
|
+
}
|
|
4002
|
+
const selected = depositAssets[selectedIdx];
|
|
4003
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4004
|
+
DepositQRView,
|
|
4005
|
+
{
|
|
4006
|
+
chainId: selected.chainId,
|
|
4007
|
+
asset: selected.token,
|
|
4008
|
+
address: evmAddress,
|
|
4009
|
+
onBack: () => onSelectIdx(-1)
|
|
3961
4010
|
}
|
|
3962
|
-
|
|
3963
|
-
|
|
3964
|
-
|
|
3965
|
-
|
|
3966
|
-
|
|
3967
|
-
|
|
3968
|
-
|
|
3969
|
-
|
|
3970
|
-
|
|
3971
|
-
|
|
3972
|
-
|
|
3973
|
-
|
|
3974
|
-
|
|
3975
|
-
|
|
3976
|
-
|
|
3977
|
-
|
|
3978
|
-
|
|
3979
|
-
|
|
3980
|
-
});
|
|
3981
|
-
setBalance(BigInt(result));
|
|
3982
|
-
}
|
|
3983
|
-
} catch (err) {
|
|
3984
|
-
console.error("Failed to fetch balance:", err);
|
|
3985
|
-
setBalance(BigInt(0));
|
|
4011
|
+
);
|
|
4012
|
+
}
|
|
4013
|
+
function ChevronRightIcon({ className }) {
|
|
4014
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4015
|
+
"svg",
|
|
4016
|
+
{
|
|
4017
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4018
|
+
viewBox: "0 0 20 20",
|
|
4019
|
+
fill: "currentColor",
|
|
4020
|
+
className,
|
|
4021
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4022
|
+
"path",
|
|
4023
|
+
{
|
|
4024
|
+
fillRule: "evenodd",
|
|
4025
|
+
d: "M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z",
|
|
4026
|
+
clipRule: "evenodd"
|
|
4027
|
+
}
|
|
4028
|
+
)
|
|
3986
4029
|
}
|
|
3987
|
-
|
|
3988
|
-
|
|
3989
|
-
|
|
3990
|
-
|
|
3991
|
-
|
|
3992
|
-
|
|
3993
|
-
|
|
3994
|
-
|
|
3995
|
-
|
|
3996
|
-
|
|
3997
|
-
|
|
3998
|
-
|
|
3999
|
-
|
|
4000
|
-
|
|
4001
|
-
|
|
4002
|
-
|
|
4003
|
-
|
|
4030
|
+
);
|
|
4031
|
+
}
|
|
4032
|
+
function WalletIcon2({ className }) {
|
|
4033
|
+
return /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M21 12a2.25 2.25 0 00-2.25-2.25H15a3 3 0 11-6 0H5.25A2.25 2.25 0 003 12m18 0v6a2.25 2.25 0 01-2.25 2.25H5.25A2.25 2.25 0 013 18v-6m18 0V9M3 12V9m18 0a2.25 2.25 0 00-2.25-2.25H5.25A2.25 2.25 0 003 9m18 0V6a2.25 2.25 0 00-2.25-2.25H5.25A2.25 2.25 0 003 6v3" }) });
|
|
4034
|
+
}
|
|
4035
|
+
function ArrowDownIcon({ className }) {
|
|
4036
|
+
return /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19.5 13.5L12 21m0 0l-7.5-7.5M12 21V3" }) });
|
|
4037
|
+
}
|
|
4038
|
+
function ArrowUpIcon({ className }) {
|
|
4039
|
+
return /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M4.5 10.5L12 3m0 0l7.5 7.5M12 3v18" }) });
|
|
4040
|
+
}
|
|
4041
|
+
function ClockIcon({ className }) {
|
|
4042
|
+
return /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z" }) });
|
|
4043
|
+
}
|
|
4044
|
+
function UserIcon({ className }) {
|
|
4045
|
+
return /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z" }) });
|
|
4046
|
+
}
|
|
4047
|
+
function MenuItem({ icon, label, description, onClick, isFirst, isLast }) {
|
|
4048
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4049
|
+
"button",
|
|
4050
|
+
{
|
|
4051
|
+
type: "button",
|
|
4052
|
+
onClick,
|
|
4053
|
+
className: `volr:w-full volr:flex volr:items-center volr:gap-3 volr:py-2.5 volr:px-3 volr:bg-white hover:volr:bg-slate-50 volr:transition-colors volr:text-left volr:border-x volr:border-slate-200 ${isFirst ? "volr:border-t volr:rounded-t-xl" : ""} ${isLast ? "volr:border-b volr:rounded-b-xl" : "volr:border-b"}`,
|
|
4054
|
+
children: [
|
|
4055
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-8 volr:h-8 volr:rounded-full volr:bg-slate-100 volr:flex volr:items-center volr:justify-center volr:shrink-0", children: icon }),
|
|
4056
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1 volr:min-w-0", children: [
|
|
4057
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: label }),
|
|
4058
|
+
description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-400", children: description })
|
|
4059
|
+
] }),
|
|
4060
|
+
/* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-300" })
|
|
4061
|
+
]
|
|
4004
4062
|
}
|
|
4005
|
-
|
|
4006
|
-
|
|
4007
|
-
|
|
4008
|
-
|
|
4009
|
-
|
|
4010
|
-
|
|
4011
|
-
|
|
4012
|
-
|
|
4013
|
-
|
|
4014
|
-
|
|
4015
|
-
|
|
4016
|
-
|
|
4017
|
-
|
|
4018
|
-
|
|
4019
|
-
|
|
4020
|
-
|
|
4021
|
-
|
|
4022
|
-
|
|
4023
|
-
|
|
4024
|
-
|
|
4025
|
-
|
|
4026
|
-
|
|
4027
|
-
|
|
4028
|
-
|
|
4029
|
-
|
|
4030
|
-
|
|
4031
|
-
|
|
4032
|
-
|
|
4033
|
-
|
|
4034
|
-
|
|
4035
|
-
|
|
4036
|
-
|
|
4037
|
-
|
|
4038
|
-
|
|
4063
|
+
);
|
|
4064
|
+
}
|
|
4065
|
+
function AccountMainView({
|
|
4066
|
+
totalUsd,
|
|
4067
|
+
balances,
|
|
4068
|
+
isLoading,
|
|
4069
|
+
paymentEnabled,
|
|
4070
|
+
onNavigate,
|
|
4071
|
+
onLogout,
|
|
4072
|
+
isLoggingOut
|
|
4073
|
+
}) {
|
|
4074
|
+
const { t } = useI18n();
|
|
4075
|
+
const formattedUsd = isLoading ? "\u2014" : totalUsd.toLocaleString("en-US", {
|
|
4076
|
+
style: "currency",
|
|
4077
|
+
currency: "USD",
|
|
4078
|
+
minimumFractionDigits: 2,
|
|
4079
|
+
maximumFractionDigits: 2
|
|
4080
|
+
});
|
|
4081
|
+
const tokensWithBalance = balances.filter((b) => b.balanceRaw > 0n).length;
|
|
4082
|
+
const assetsDescription = isLoading ? void 0 : tokensWithBalance > 0 ? `${tokensWithBalance} ${tokensWithBalance === 1 ? "token" : "tokens"}` : void 0;
|
|
4083
|
+
const menuItems = [
|
|
4084
|
+
{
|
|
4085
|
+
key: "assets",
|
|
4086
|
+
icon: /* @__PURE__ */ jsxRuntime.jsx(WalletIcon2, { className: "volr:w-4 volr:h-4 volr:text-slate-600" }),
|
|
4087
|
+
label: t("account.menu.assets"),
|
|
4088
|
+
description: assetsDescription,
|
|
4089
|
+
view: "assets"
|
|
4090
|
+
},
|
|
4091
|
+
{
|
|
4092
|
+
key: "deposit",
|
|
4093
|
+
icon: /* @__PURE__ */ jsxRuntime.jsx(ArrowDownIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-600" }),
|
|
4094
|
+
label: t("account.menu.deposit"),
|
|
4095
|
+
view: "deposit"
|
|
4096
|
+
},
|
|
4097
|
+
{
|
|
4098
|
+
key: "withdraw",
|
|
4099
|
+
icon: /* @__PURE__ */ jsxRuntime.jsx(ArrowUpIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-600" }),
|
|
4100
|
+
label: t("account.menu.withdraw"),
|
|
4101
|
+
view: "withdraw"
|
|
4102
|
+
},
|
|
4103
|
+
...paymentEnabled ? [
|
|
4104
|
+
{
|
|
4105
|
+
key: "payments",
|
|
4106
|
+
icon: /* @__PURE__ */ jsxRuntime.jsx(ClockIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-600" }),
|
|
4107
|
+
label: t("account.menu.payments"),
|
|
4108
|
+
view: "payments"
|
|
4039
4109
|
}
|
|
4040
|
-
|
|
4041
|
-
|
|
4042
|
-
|
|
4043
|
-
|
|
4044
|
-
|
|
4045
|
-
|
|
4046
|
-
setIsTransferring(false);
|
|
4047
|
-
}
|
|
4048
|
-
}, [selectedWallet, connectedAddress, amount, decimals, balance, asset, destinationAddress, onSuccess, t]);
|
|
4049
|
-
const setMaxAmount = React13.useCallback(() => {
|
|
4050
|
-
if (balance !== null) {
|
|
4051
|
-
const formatted = formatUnits(balance, decimals);
|
|
4052
|
-
setAmount(formatted);
|
|
4110
|
+
] : [],
|
|
4111
|
+
{
|
|
4112
|
+
key: "account",
|
|
4113
|
+
icon: /* @__PURE__ */ jsxRuntime.jsx(UserIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-600" }),
|
|
4114
|
+
label: t("account.menu.account"),
|
|
4115
|
+
view: "account"
|
|
4053
4116
|
}
|
|
4054
|
-
|
|
4055
|
-
const wallets = getWalletsForDisplay();
|
|
4056
|
-
const isWrongNetwork = currentChainId !== null && currentChainId !== chainId;
|
|
4057
|
-
const formattedBalance = balance !== null ? formatUnits(balance, decimals) : null;
|
|
4058
|
-
if (viewState === "select-wallet") {
|
|
4059
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4060
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
4061
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xl volr:font-semibold volr:mb-1", children: t("deposit.walletTransfer.title") }),
|
|
4062
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500", children: t("deposit.walletTransfer.selectWallet") })
|
|
4063
|
-
] }),
|
|
4064
|
-
isDetecting && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-center volr:py-8", children: [
|
|
4065
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-spin volr:w-6 volr:h-6 volr:border-2 volr:border-slate-300 volr:border-t-slate-600 volr:rounded-full volr:mx-auto" }),
|
|
4066
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500 volr:mt-3", children: t("common.loading") })
|
|
4067
|
-
] }),
|
|
4068
|
-
!isDetecting && !hasWallet && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-center volr:py-8", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500", children: t("deposit.walletTransfer.noWallets") }) }),
|
|
4069
|
-
!isDetecting && wallets.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:space-y-2", children: wallets.map((wallet) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4070
|
-
"button",
|
|
4071
|
-
{
|
|
4072
|
-
type: "button",
|
|
4073
|
-
onClick: () => connectWallet(wallet),
|
|
4074
|
-
disabled: isConnecting,
|
|
4075
|
-
className: "volr:w-full volr:flex volr:items-center volr:gap-3 volr:p-3 volr:border volr:border-slate-200 volr:rounded-xl volr:hover:bg-slate-50 volr:transition-colors volr:disabled:opacity-50",
|
|
4076
|
-
children: [
|
|
4077
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-10 volr:h-10 volr:rounded-lg volr:bg-slate-100 volr:flex volr:items-center volr:justify-center volr:overflow-hidden volr:flex-shrink-0", children: wallet.icon ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
4078
|
-
"img",
|
|
4079
|
-
{
|
|
4080
|
-
src: wallet.icon,
|
|
4081
|
-
alt: wallet.name,
|
|
4082
|
-
className: "volr:w-7 volr:h-7"
|
|
4083
|
-
}
|
|
4084
|
-
) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-slate-400", children: /* @__PURE__ */ jsxRuntime.jsx(DefaultWalletIcon2, {}) }) }),
|
|
4085
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:flex-1 volr:text-left volr:font-medium volr:text-slate-900", children: wallet.name }),
|
|
4086
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4087
|
-
"svg",
|
|
4088
|
-
{
|
|
4089
|
-
className: "volr:w-5 volr:h-5 volr:text-slate-400",
|
|
4090
|
-
fill: "none",
|
|
4091
|
-
viewBox: "0 0 24 24",
|
|
4092
|
-
stroke: "currentColor",
|
|
4093
|
-
children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" })
|
|
4094
|
-
}
|
|
4095
|
-
)
|
|
4096
|
-
]
|
|
4097
|
-
},
|
|
4098
|
-
wallet.id
|
|
4099
|
-
)) }),
|
|
4100
|
-
error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-4 volr:p-3 volr:bg-red-50 volr:border volr:border-red-200 volr:rounded-lg", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-red-600", children: error }) }),
|
|
4101
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-6 volr:pt-4 volr:border-t volr:border-slate-200", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", onClick: onBack, className: "volr:w-full", children: t("common.back") }) })
|
|
4102
|
-
] });
|
|
4103
|
-
}
|
|
4117
|
+
];
|
|
4104
4118
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4105
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
4106
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-
|
|
4107
|
-
/* @__PURE__ */ jsxRuntime.
|
|
4108
|
-
selectedWallet?.icon && /* @__PURE__ */ jsxRuntime.jsx("img", { src: selectedWallet.icon, alt: "", className: "volr:w-5 volr:h-5 volr:rounded" }),
|
|
4109
|
-
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:text-sm volr:text-slate-500", children: [
|
|
4110
|
-
connectedAddress?.slice(0, 6),
|
|
4111
|
-
"...",
|
|
4112
|
-
connectedAddress?.slice(-4)
|
|
4113
|
-
] })
|
|
4114
|
-
] })
|
|
4115
|
-
] }),
|
|
4116
|
-
isWrongNetwork && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4 volr:p-3 volr:bg-amber-50 volr:border volr:border-amber-200 volr:rounded-lg", children: [
|
|
4117
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-amber-700 volr:mb-2", children: t("deposit.walletTransfer.wrongNetwork", { network: chainName || `Chain ${chainId}` }) }),
|
|
4118
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4119
|
-
Button,
|
|
4120
|
-
{
|
|
4121
|
-
variant: "secondary",
|
|
4122
|
-
size: "sm",
|
|
4123
|
-
onClick: switchNetwork,
|
|
4124
|
-
className: "volr:w-full",
|
|
4125
|
-
children: t("deposit.walletTransfer.switchNetwork")
|
|
4126
|
-
}
|
|
4127
|
-
)
|
|
4128
|
-
] }),
|
|
4129
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-4 volr:p-4 volr:bg-slate-50 volr:rounded-xl volr:border volr:border-slate-200", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between", children: [
|
|
4130
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2", children: [
|
|
4131
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-base volr:font-semibold", children: tokenSymbol }),
|
|
4132
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:px-2 volr:py-0.5 volr:rounded-full volr:bg-slate-200 volr:text-slate-600", children: chainName || `Chain ${chainId}` })
|
|
4133
|
-
] }),
|
|
4134
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-right", children: [
|
|
4135
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-500", children: t("deposit.walletTransfer.balance") }),
|
|
4136
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-mono volr:font-medium", children: isWrongNetwork ? "-" : formattedBalance ? `${Number(formattedBalance).toFixed(4)}` : "..." })
|
|
4137
|
-
] })
|
|
4138
|
-
] }) }),
|
|
4139
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
4140
|
-
/* @__PURE__ */ jsxRuntime.jsx("label", { className: "volr:block volr:text-sm volr:font-medium volr:text-slate-700 volr:mb-2", children: t("deposit.walletTransfer.amount") }),
|
|
4141
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
4142
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4143
|
-
"input",
|
|
4144
|
-
{
|
|
4145
|
-
type: "text",
|
|
4146
|
-
inputMode: "decimal",
|
|
4147
|
-
value: amount,
|
|
4148
|
-
onChange: (e) => setAmount(e.target.value),
|
|
4149
|
-
placeholder: t("deposit.walletTransfer.amountPlaceholder"),
|
|
4150
|
-
disabled: isWrongNetwork,
|
|
4151
|
-
className: "volr:w-full volr:px-4 volr:py-3 volr:pr-16 volr:border volr:border-slate-300 volr:rounded-xl volr:text-base volr:font-mono volr:focus:outline-none volr:focus:ring-2 volr:focus:ring-slate-300 volr:disabled:bg-slate-100 volr:disabled:text-slate-400"
|
|
4152
|
-
}
|
|
4153
|
-
),
|
|
4154
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4155
|
-
"button",
|
|
4156
|
-
{
|
|
4157
|
-
type: "button",
|
|
4158
|
-
onClick: setMaxAmount,
|
|
4159
|
-
disabled: isWrongNetwork || balance === null,
|
|
4160
|
-
className: "volr:absolute volr:right-3 volr:top-1/2 volr:-translate-y-1/2 volr:px-2 volr:py-1 volr:text-xs volr:font-semibold volr:text-slate-600 volr:bg-slate-100 volr:rounded volr:hover:bg-slate-200 volr:disabled:opacity-50",
|
|
4161
|
-
children: t("deposit.walletTransfer.max")
|
|
4162
|
-
}
|
|
4163
|
-
)
|
|
4164
|
-
] })
|
|
4119
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:rounded-xl volr:bg-gradient-to-br volr:from-slate-50 volr:to-slate-100 volr:p-4 volr:mb-4", children: [
|
|
4120
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-500 volr:mb-0.5", children: t("account.totalBalance") }),
|
|
4121
|
+
isLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-8 volr:w-32 volr:bg-slate-200 volr:rounded" }) }) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-2xl volr:font-semibold volr:text-slate-900", children: formattedUsd })
|
|
4165
4122
|
] }),
|
|
4166
|
-
|
|
4167
|
-
|
|
4168
|
-
Button,
|
|
4123
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { children: menuItems.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
4124
|
+
MenuItem,
|
|
4169
4125
|
{
|
|
4170
|
-
|
|
4171
|
-
|
|
4172
|
-
|
|
4173
|
-
|
|
4174
|
-
|
|
4175
|
-
|
|
4176
|
-
|
|
4177
|
-
|
|
4126
|
+
icon: item.icon,
|
|
4127
|
+
label: item.label,
|
|
4128
|
+
description: item.description,
|
|
4129
|
+
onClick: () => onNavigate(item.view),
|
|
4130
|
+
isFirst: index === 0,
|
|
4131
|
+
isLast: index === menuItems.length - 1
|
|
4132
|
+
},
|
|
4133
|
+
item.key
|
|
4134
|
+
)) }),
|
|
4135
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-4 volr:pt-3", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4136
|
+
"button",
|
|
4178
4137
|
{
|
|
4179
|
-
|
|
4180
|
-
onClick:
|
|
4181
|
-
|
|
4182
|
-
|
|
4138
|
+
type: "button",
|
|
4139
|
+
onClick: onLogout,
|
|
4140
|
+
disabled: isLoggingOut,
|
|
4141
|
+
className: "volr:w-full volr:py-2 volr:text-sm volr:text-slate-400 volr:text-center hover:volr:text-slate-600 volr:transition-colors disabled:volr:opacity-50",
|
|
4142
|
+
children: isLoggingOut ? t("common.loading") : t("account.logout")
|
|
4183
4143
|
}
|
|
4184
4144
|
) })
|
|
4185
4145
|
] });
|
|
4186
4146
|
}
|
|
4187
|
-
|
|
4188
|
-
|
|
4189
|
-
|
|
4190
|
-
|
|
4191
|
-
|
|
4192
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4193
|
-
"div",
|
|
4194
|
-
{
|
|
4195
|
-
className: "volr:absolute volr:inset-0 volr:rounded-2xl volr:pointer-events-none",
|
|
4196
|
-
style: {
|
|
4197
|
-
boxShadow: "0 0 0 4px rgba(16, 185, 129, 0.3), 0 0 30px rgba(16, 185, 129, 0.4)",
|
|
4198
|
-
animation: "volrPulseGlow 1.5s ease-out infinite"
|
|
4199
|
-
}
|
|
4200
|
-
}
|
|
4201
|
-
),
|
|
4202
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:absolute volr:inset-0 volr:overflow-visible volr:pointer-events-none volr:-z-10", children: [
|
|
4203
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4204
|
-
"div",
|
|
4205
|
-
{
|
|
4206
|
-
className: "volr:absolute volr:w-48 volr:h-48 volr:rounded-full volr:opacity-0",
|
|
4207
|
-
style: {
|
|
4208
|
-
background: "radial-gradient(circle, rgba(16,185,129,0.7) 0%, rgba(16,185,129,0) 60%)",
|
|
4209
|
-
filter: "blur(50px)",
|
|
4210
|
-
top: "5%",
|
|
4211
|
-
left: "0%",
|
|
4212
|
-
animation: "volrGlowPulse 1.8s ease-out forwards"
|
|
4213
|
-
}
|
|
4214
|
-
}
|
|
4215
|
-
),
|
|
4216
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4217
|
-
"div",
|
|
4147
|
+
function TokenRow({ token }) {
|
|
4148
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:py-3 volr:border-b volr:border-slate-100 last:volr:border-b-0", children: [
|
|
4149
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-3", children: [
|
|
4150
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-8 volr:h-8 volr:rounded-full volr:bg-slate-100 volr:flex volr:items-center volr:justify-center volr:overflow-hidden volr:shrink-0", children: token.iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
4151
|
+
"img",
|
|
4218
4152
|
{
|
|
4219
|
-
|
|
4220
|
-
|
|
4221
|
-
|
|
4222
|
-
filter: "blur(45px)",
|
|
4223
|
-
bottom: "10%",
|
|
4224
|
-
right: "-5%",
|
|
4225
|
-
animation: "volrGlowPulse 2s ease-out 0.1s forwards"
|
|
4226
|
-
}
|
|
4153
|
+
src: token.iconUrl,
|
|
4154
|
+
alt: token.symbol,
|
|
4155
|
+
className: "volr:w-full volr:h-full volr:object-cover"
|
|
4227
4156
|
}
|
|
4228
|
-
),
|
|
4157
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:font-medium volr:text-slate-500", children: token.symbol.slice(0, 2) }) }),
|
|
4158
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4159
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: token.symbol }),
|
|
4160
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
|
|
4161
|
+
"Chain ",
|
|
4162
|
+
token.chainId
|
|
4163
|
+
] })
|
|
4164
|
+
] })
|
|
4165
|
+
] }),
|
|
4166
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-right", children: token.isLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-16 volr:bg-slate-200 volr:rounded" }) }) : token.error ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-red-500", children: "Error" }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
4167
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: token.balance }),
|
|
4168
|
+
token.balanceUsd !== void 0 && token.balanceUsd > 0 && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
|
|
4169
|
+
"$",
|
|
4170
|
+
token.balanceUsd.toFixed(2)
|
|
4171
|
+
] })
|
|
4172
|
+
] }) })
|
|
4173
|
+
] });
|
|
4174
|
+
}
|
|
4175
|
+
function BalanceDetailView({
|
|
4176
|
+
balances,
|
|
4177
|
+
isLoading
|
|
4178
|
+
}) {
|
|
4179
|
+
const { t } = useI18n();
|
|
4180
|
+
if (isLoading && balances.length === 0) {
|
|
4181
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-8", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse volr:space-y-4", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-3", children: [
|
|
4182
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-8 volr:h-8 volr:rounded-full volr:bg-slate-200" }),
|
|
4183
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1", children: [
|
|
4184
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-16 volr:bg-slate-200 volr:rounded volr:mb-1" }),
|
|
4185
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-3 volr:w-12 volr:bg-slate-100 volr:rounded" })
|
|
4186
|
+
] }),
|
|
4187
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-16 volr:bg-slate-200 volr:rounded" })
|
|
4188
|
+
] }, i)) }) });
|
|
4189
|
+
}
|
|
4190
|
+
if (balances.length === 0) {
|
|
4191
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-12 volr:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-400", children: t("account.noAssets") }) });
|
|
4192
|
+
}
|
|
4193
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4194
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.menu.assets") }),
|
|
4195
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { children: balances.map((token) => /* @__PURE__ */ jsxRuntime.jsx(TokenRow, { token }, token.id)) })
|
|
4196
|
+
] });
|
|
4197
|
+
}
|
|
4198
|
+
var Input = React13__default.default.forwardRef(
|
|
4199
|
+
({ leftIcon, error, className, style, disabled, ...props }, ref) => {
|
|
4200
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
4201
|
+
leftIcon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:absolute volr:left-3 volr:top-1/2 volr:-translate-y-1/2 volr:pointer-events-none volr-text-muted", children: leftIcon }),
|
|
4229
4202
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4230
|
-
"
|
|
4203
|
+
"input",
|
|
4231
4204
|
{
|
|
4232
|
-
|
|
4233
|
-
|
|
4234
|
-
|
|
4235
|
-
|
|
4236
|
-
|
|
4237
|
-
|
|
4238
|
-
|
|
4239
|
-
|
|
4240
|
-
|
|
4205
|
+
ref,
|
|
4206
|
+
disabled,
|
|
4207
|
+
className: cn(
|
|
4208
|
+
"volr:w-full volr:text-base volr:outline-none volr:transition-all volr:rounded-lg volr:py-3 volr:disabled:cursor-not-allowed volr:bg-white",
|
|
4209
|
+
"volr:border volr:border-slate-300 focus:volr:border-slate-400 focus:volr:ring-1 focus:volr:ring-slate-400",
|
|
4210
|
+
leftIcon ? "volr:pl-11 volr:pr-3" : "volr:px-3",
|
|
4211
|
+
error && "volr:border-red-500 focus:volr:border-red-500 focus:volr:ring-red-500",
|
|
4212
|
+
className
|
|
4213
|
+
),
|
|
4214
|
+
style,
|
|
4215
|
+
...props
|
|
4241
4216
|
}
|
|
4242
4217
|
)
|
|
4243
|
-
] })
|
|
4244
|
-
|
|
4245
|
-
|
|
4246
|
-
|
|
4247
|
-
|
|
4248
|
-
|
|
4249
|
-
|
|
4250
|
-
|
|
4251
|
-
|
|
4252
|
-
|
|
4253
|
-
|
|
4254
|
-
|
|
4255
|
-
|
|
4256
|
-
|
|
4257
|
-
|
|
4258
|
-
|
|
4259
|
-
|
|
4260
|
-
|
|
4261
|
-
|
|
4262
|
-
|
|
4263
|
-
|
|
4264
|
-
|
|
4265
|
-
|
|
4266
|
-
|
|
4267
|
-
|
|
4268
|
-
|
|
4269
|
-
|
|
4270
|
-
|
|
4271
|
-
|
|
4272
|
-
|
|
4273
|
-
|
|
4274
|
-
|
|
4275
|
-
|
|
4276
|
-
|
|
4277
|
-
|
|
4278
|
-
|
|
4279
|
-
|
|
4280
|
-
|
|
4281
|
-
|
|
4282
|
-
|
|
4283
|
-
|
|
4284
|
-
|
|
4285
|
-
|
|
4286
|
-
|
|
4287
|
-
|
|
4288
|
-
|
|
4289
|
-
)
|
|
4290
|
-
|
|
4291
|
-
|
|
4292
|
-
|
|
4293
|
-
|
|
4294
|
-
|
|
4295
|
-
|
|
4296
|
-
|
|
4297
|
-
|
|
4298
|
-
|
|
4299
|
-
|
|
4300
|
-
|
|
4301
|
-
|
|
4302
|
-
|
|
4218
|
+
] });
|
|
4219
|
+
}
|
|
4220
|
+
);
|
|
4221
|
+
Input.displayName = "Input";
|
|
4222
|
+
function WithdrawView({
|
|
4223
|
+
balances,
|
|
4224
|
+
connectedWallet,
|
|
4225
|
+
onSuccess
|
|
4226
|
+
}) {
|
|
4227
|
+
const { t } = useI18n();
|
|
4228
|
+
const { withdraw, isWithdrawing, result, error, reset } = react.useWithdraw();
|
|
4229
|
+
const [step, setStep] = React13.useState("select");
|
|
4230
|
+
const [selectedTokenId, setSelectedTokenId] = React13.useState(null);
|
|
4231
|
+
const [toAddress, setToAddress] = React13.useState("");
|
|
4232
|
+
const [amount, setAmount] = React13.useState("");
|
|
4233
|
+
const [useConnectedWallet, setUseConnectedWallet] = React13.useState(false);
|
|
4234
|
+
const selectedToken = React13.useMemo(
|
|
4235
|
+
() => balances.find((b) => b.id === selectedTokenId),
|
|
4236
|
+
[balances, selectedTokenId]
|
|
4237
|
+
);
|
|
4238
|
+
const connectedAddress = React13.useMemo(() => {
|
|
4239
|
+
if (!connectedWallet) return null;
|
|
4240
|
+
const parts = connectedWallet.split(":");
|
|
4241
|
+
return parts.length >= 2 ? parts[1] : null;
|
|
4242
|
+
}, [connectedWallet]);
|
|
4243
|
+
const handleSelectToken = (tokenId) => {
|
|
4244
|
+
setSelectedTokenId(tokenId);
|
|
4245
|
+
setStep("input");
|
|
4246
|
+
};
|
|
4247
|
+
const handleUseConnectedWallet = () => {
|
|
4248
|
+
if (connectedAddress) {
|
|
4249
|
+
setToAddress(connectedAddress);
|
|
4250
|
+
setUseConnectedWallet(true);
|
|
4251
|
+
}
|
|
4252
|
+
};
|
|
4253
|
+
const handleConfirm = async () => {
|
|
4254
|
+
if (!selectedToken || !toAddress || !amount) return;
|
|
4255
|
+
setStep("confirm");
|
|
4256
|
+
try {
|
|
4257
|
+
await withdraw({
|
|
4258
|
+
chainId: selectedToken.chainId,
|
|
4259
|
+
tokenAddress: selectedToken.address,
|
|
4260
|
+
decimals: selectedToken.decimals,
|
|
4261
|
+
amount,
|
|
4262
|
+
to: toAddress
|
|
4263
|
+
});
|
|
4264
|
+
setStep("result");
|
|
4265
|
+
} catch {
|
|
4266
|
+
setStep("result");
|
|
4267
|
+
}
|
|
4268
|
+
};
|
|
4269
|
+
const handleReset = () => {
|
|
4270
|
+
reset();
|
|
4271
|
+
setStep("select");
|
|
4272
|
+
setSelectedTokenId(null);
|
|
4273
|
+
setToAddress("");
|
|
4274
|
+
setAmount("");
|
|
4275
|
+
setUseConnectedWallet(false);
|
|
4276
|
+
};
|
|
4277
|
+
const isAmountValid = React13.useMemo(() => {
|
|
4278
|
+
if (!amount || !selectedToken) return false;
|
|
4279
|
+
const num = parseFloat(amount);
|
|
4280
|
+
if (isNaN(num) || num <= 0) return false;
|
|
4281
|
+
const balance = parseFloat(selectedToken.balance.replace(/,/g, ""));
|
|
4282
|
+
return num <= balance;
|
|
4283
|
+
}, [amount, selectedToken]);
|
|
4284
|
+
const isAddressValid = /^0x[a-fA-F0-9]{40}$/.test(toAddress);
|
|
4285
|
+
if (step === "select") {
|
|
4286
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4287
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.withdraw.selectToken") }),
|
|
4288
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:space-y-2", children: balances.map((token) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4289
|
+
"button",
|
|
4303
4290
|
{
|
|
4304
|
-
|
|
4305
|
-
|
|
4306
|
-
|
|
4307
|
-
|
|
4308
|
-
|
|
4309
|
-
|
|
4310
|
-
|
|
4311
|
-
|
|
4312
|
-
|
|
4313
|
-
|
|
4314
|
-
|
|
4315
|
-
|
|
4316
|
-
|
|
4317
|
-
|
|
4318
|
-
|
|
4319
|
-
|
|
4320
|
-
|
|
4321
|
-
|
|
4322
|
-
|
|
4323
|
-
|
|
4324
|
-
|
|
4325
|
-
|
|
4326
|
-
|
|
4327
|
-
|
|
4328
|
-
|
|
4329
|
-
|
|
4330
|
-
|
|
4331
|
-
|
|
4332
|
-
|
|
4333
|
-
|
|
4334
|
-
|
|
4335
|
-
|
|
4336
|
-
|
|
4337
|
-
}
|
|
4338
|
-
100% {
|
|
4339
|
-
transform: scale(1);
|
|
4340
|
-
opacity: 1;
|
|
4341
|
-
}
|
|
4342
|
-
}
|
|
4343
|
-
@keyframes volrPulseGlow {
|
|
4344
|
-
0%, 100% {
|
|
4345
|
-
opacity: 0.6;
|
|
4346
|
-
}
|
|
4347
|
-
50% {
|
|
4348
|
-
opacity: 1;
|
|
4349
|
-
}
|
|
4350
|
-
}
|
|
4351
|
-
@keyframes volrParticle1 {
|
|
4352
|
-
0% {
|
|
4353
|
-
transform: translate(0, 0) scale(0);
|
|
4354
|
-
opacity: 0;
|
|
4355
|
-
}
|
|
4356
|
-
20% {
|
|
4357
|
-
opacity: 1;
|
|
4358
|
-
}
|
|
4359
|
-
100% {
|
|
4360
|
-
transform: translate(-20px, -30px) scale(1);
|
|
4361
|
-
opacity: 0;
|
|
4362
|
-
}
|
|
4363
|
-
}
|
|
4364
|
-
@keyframes volrParticle2 {
|
|
4365
|
-
0% {
|
|
4366
|
-
transform: translate(0, 0) scale(0);
|
|
4367
|
-
opacity: 0;
|
|
4368
|
-
}
|
|
4369
|
-
20% {
|
|
4370
|
-
opacity: 1;
|
|
4371
|
-
}
|
|
4372
|
-
100% {
|
|
4373
|
-
transform: translate(25px, -35px) scale(1);
|
|
4374
|
-
opacity: 0;
|
|
4375
|
-
}
|
|
4376
|
-
}
|
|
4377
|
-
@keyframes volrParticle3 {
|
|
4378
|
-
0% {
|
|
4379
|
-
transform: translate(0, 0) scale(0);
|
|
4380
|
-
opacity: 0;
|
|
4381
|
-
}
|
|
4382
|
-
20% {
|
|
4383
|
-
opacity: 1;
|
|
4384
|
-
}
|
|
4385
|
-
100% {
|
|
4386
|
-
transform: translate(-30px, 25px) scale(1);
|
|
4387
|
-
opacity: 0;
|
|
4388
|
-
}
|
|
4389
|
-
}
|
|
4390
|
-
@keyframes volrParticle4 {
|
|
4391
|
-
0% {
|
|
4392
|
-
transform: translate(0, 0) scale(0);
|
|
4393
|
-
opacity: 0;
|
|
4394
|
-
}
|
|
4395
|
-
20% {
|
|
4396
|
-
opacity: 1;
|
|
4291
|
+
type: "button",
|
|
4292
|
+
onClick: () => handleSelectToken(token.id),
|
|
4293
|
+
disabled: token.balanceRaw === 0n,
|
|
4294
|
+
className: "volr:w-full volr:flex volr:items-center volr:justify-between volr:p-3 volr:rounded-lg volr:border volr:border-slate-200 hover:volr:bg-slate-50 volr:transition-colors disabled:volr:opacity-50 disabled:volr:cursor-not-allowed",
|
|
4295
|
+
children: [
|
|
4296
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-3", children: [
|
|
4297
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-8 volr:h-8 volr:rounded-full volr:bg-slate-100 volr:flex volr:items-center volr:justify-center volr:overflow-hidden", children: token.iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
4298
|
+
"img",
|
|
4299
|
+
{
|
|
4300
|
+
src: token.iconUrl,
|
|
4301
|
+
alt: token.symbol,
|
|
4302
|
+
className: "volr:w-full volr:h-full volr:object-cover"
|
|
4303
|
+
}
|
|
4304
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:font-medium volr:text-slate-500", children: token.symbol.slice(0, 2) }) }),
|
|
4305
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: token.symbol })
|
|
4306
|
+
] }),
|
|
4307
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:text-slate-500", children: token.balance })
|
|
4308
|
+
]
|
|
4309
|
+
},
|
|
4310
|
+
token.id
|
|
4311
|
+
)) })
|
|
4312
|
+
] });
|
|
4313
|
+
}
|
|
4314
|
+
if (step === "input" && selectedToken) {
|
|
4315
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4316
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.withdraw.title") }),
|
|
4317
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-3 volr:p-3 volr:rounded-lg volr:bg-slate-50 volr:mb-4", children: [
|
|
4318
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-8 volr:h-8 volr:rounded-full volr:bg-slate-200 volr:flex volr:items-center volr:justify-center volr:overflow-hidden", children: selectedToken.iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
4319
|
+
"img",
|
|
4320
|
+
{
|
|
4321
|
+
src: selectedToken.iconUrl,
|
|
4322
|
+
alt: selectedToken.symbol,
|
|
4323
|
+
className: "volr:w-full volr:h-full volr:object-cover"
|
|
4397
4324
|
}
|
|
4398
|
-
|
|
4399
|
-
|
|
4400
|
-
|
|
4325
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:font-medium volr:text-slate-500", children: selectedToken.symbol.slice(0, 2) }) }),
|
|
4326
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4327
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: selectedToken.symbol }),
|
|
4328
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
|
|
4329
|
+
t("account.withdraw.available"),
|
|
4330
|
+
": ",
|
|
4331
|
+
selectedToken.balance
|
|
4332
|
+
] })
|
|
4333
|
+
] })
|
|
4334
|
+
] }),
|
|
4335
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-4", children: [
|
|
4336
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { className: "volr:block volr:text-sm volr:text-slate-600 volr:mb-2", children: t("account.withdraw.toAddress") }),
|
|
4337
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4338
|
+
Input,
|
|
4339
|
+
{
|
|
4340
|
+
type: "text",
|
|
4341
|
+
placeholder: "0x...",
|
|
4342
|
+
value: toAddress,
|
|
4343
|
+
onChange: (e) => {
|
|
4344
|
+
setToAddress(e.target.value);
|
|
4345
|
+
setUseConnectedWallet(false);
|
|
4346
|
+
}
|
|
4401
4347
|
}
|
|
4402
|
-
}
|
|
4403
|
-
` })
|
|
4404
|
-
] });
|
|
4405
|
-
};
|
|
4406
|
-
var DepositCompletedToast = ({
|
|
4407
|
-
onClose,
|
|
4408
|
-
previousBalance,
|
|
4409
|
-
newBalance,
|
|
4410
|
-
delta,
|
|
4411
|
-
decimals,
|
|
4412
|
-
symbol
|
|
4413
|
-
}) => {
|
|
4414
|
-
const { t } = useI18n();
|
|
4415
|
-
const [expanded, setExpanded] = React13.useState(false);
|
|
4416
|
-
const formatAmount = (amount) => {
|
|
4417
|
-
const divisor = BigInt(10 ** decimals);
|
|
4418
|
-
const whole = amount / divisor;
|
|
4419
|
-
const fraction = amount % divisor;
|
|
4420
|
-
const fractionStr = fraction.toString().padStart(decimals, "0").slice(0, 4);
|
|
4421
|
-
const trimmedFraction = fractionStr.replace(/0+$/, "");
|
|
4422
|
-
return trimmedFraction ? `${whole}.${trimmedFraction}` : `${whole}`;
|
|
4423
|
-
};
|
|
4424
|
-
const formattedDelta = formatAmount(delta);
|
|
4425
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
4426
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4427
|
-
"div",
|
|
4428
|
-
{
|
|
4429
|
-
className: "volr:absolute volr:inset-0 volr:bg-black/40 volr:z-40",
|
|
4430
|
-
onClick: onClose,
|
|
4431
|
-
style: { animation: "volrFadeIn 0.2s ease-out" }
|
|
4432
|
-
}
|
|
4433
|
-
),
|
|
4434
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4435
|
-
"div",
|
|
4436
|
-
{
|
|
4437
|
-
className: cn(
|
|
4438
|
-
// Position: centered at bottom with margin
|
|
4439
|
-
"volr:absolute volr:bottom-3 volr:left-3 volr:right-3 volr:z-50",
|
|
4440
|
-
// Appearance: floating card
|
|
4441
|
-
"volr:bg-white volr:rounded-2xl",
|
|
4442
|
-
// Border: full border for clear card definition
|
|
4443
|
-
"volr:border volr:border-slate-200",
|
|
4444
|
-
// Shadow: strong shadow for floating effect
|
|
4445
|
-
"volr:shadow-2xl",
|
|
4446
|
-
// Animation
|
|
4447
|
-
"volr:transition-all volr:duration-300 volr:ease-out"
|
|
4448
4348
|
),
|
|
4449
|
-
|
|
4450
|
-
|
|
4451
|
-
|
|
4452
|
-
|
|
4453
|
-
|
|
4454
|
-
|
|
4455
|
-
|
|
4456
|
-
|
|
4349
|
+
connectedAddress && !useConnectedWallet && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4350
|
+
"button",
|
|
4351
|
+
{
|
|
4352
|
+
type: "button",
|
|
4353
|
+
onClick: handleUseConnectedWallet,
|
|
4354
|
+
className: "volr:mt-2 volr:text-xs volr:text-slate-500 hover:volr:text-slate-700 volr:underline",
|
|
4355
|
+
children: t("account.withdraw.useConnectedWallet")
|
|
4356
|
+
}
|
|
4357
|
+
)
|
|
4358
|
+
] }),
|
|
4359
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-6", children: [
|
|
4360
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { className: "volr:block volr:text-sm volr:text-slate-600 volr:mb-2", children: t("account.withdraw.amount") }),
|
|
4361
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
4362
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4363
|
+
Input,
|
|
4364
|
+
{
|
|
4365
|
+
type: "text",
|
|
4366
|
+
inputMode: "decimal",
|
|
4367
|
+
placeholder: "0.00",
|
|
4368
|
+
value: amount,
|
|
4369
|
+
onChange: (e) => setAmount(e.target.value)
|
|
4370
|
+
}
|
|
4371
|
+
),
|
|
4372
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4373
|
+
"button",
|
|
4374
|
+
{
|
|
4375
|
+
type: "button",
|
|
4376
|
+
onClick: () => setAmount(selectedToken.balance.replace(/,/g, "")),
|
|
4377
|
+
className: "volr:absolute volr:right-3 volr:top-1/2 volr:-translate-y-1/2 volr:text-xs volr:text-slate-500 hover:volr:text-slate-700 volr:font-medium",
|
|
4378
|
+
children: "MAX"
|
|
4379
|
+
}
|
|
4380
|
+
)
|
|
4381
|
+
] })
|
|
4382
|
+
] }),
|
|
4383
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4384
|
+
Button,
|
|
4385
|
+
{
|
|
4386
|
+
onClick: handleConfirm,
|
|
4387
|
+
disabled: !isAddressValid || !isAmountValid,
|
|
4388
|
+
fullWidth: true,
|
|
4389
|
+
children: t("account.withdraw.confirm")
|
|
4390
|
+
}
|
|
4391
|
+
)
|
|
4392
|
+
] });
|
|
4393
|
+
}
|
|
4394
|
+
if (step === "confirm" && selectedToken) {
|
|
4395
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-8 volr:text-center", children: [
|
|
4396
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-spin volr:w-8 volr:h-8 volr:border-2 volr:border-slate-200 volr:border-t-slate-600 volr:rounded-full volr:mx-auto volr:mb-4" }),
|
|
4397
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-600", children: t("account.withdraw.processing") })
|
|
4398
|
+
] });
|
|
4399
|
+
}
|
|
4400
|
+
if (step === "result") {
|
|
4401
|
+
const isSuccess = result && !error;
|
|
4402
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-8 volr:text-center", children: [
|
|
4403
|
+
isSuccess ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
4404
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-12 volr:h-12 volr:rounded-full volr:bg-green-100 volr:flex volr:items-center volr:justify-center volr:mx-auto volr:mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4405
|
+
"svg",
|
|
4406
|
+
{
|
|
4407
|
+
className: "volr:w-6 volr:h-6 volr:text-green-600",
|
|
4408
|
+
fill: "none",
|
|
4409
|
+
viewBox: "0 0 24 24",
|
|
4410
|
+
stroke: "currentColor",
|
|
4411
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4412
|
+
"path",
|
|
4457
4413
|
{
|
|
4458
|
-
width: "20",
|
|
4459
|
-
height: "20",
|
|
4460
|
-
viewBox: "0 0 24 24",
|
|
4461
|
-
fill: "none",
|
|
4462
|
-
stroke: "white",
|
|
4463
|
-
strokeWidth: "2.5",
|
|
4464
4414
|
strokeLinecap: "round",
|
|
4465
4415
|
strokeLinejoin: "round",
|
|
4466
|
-
|
|
4416
|
+
strokeWidth: 2,
|
|
4417
|
+
d: "M5 13l4 4L19 7"
|
|
4467
4418
|
}
|
|
4468
|
-
)
|
|
4469
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1 volr:min-w-0", children: [
|
|
4470
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-start volr:justify-between volr:gap-2 volr:mb-1", children: [
|
|
4471
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-semibold volr:text-slate-900", children: t("deposit.completed") }),
|
|
4472
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4473
|
-
"button",
|
|
4474
|
-
{
|
|
4475
|
-
onClick: onClose,
|
|
4476
|
-
className: "volr:shrink-0 volr:w-6 volr:h-6 volr:flex volr:items-center volr:justify-center volr:rounded-full volr:transition-colors volr:bg-slate-100 volr:text-slate-500 volr:hover:bg-slate-200",
|
|
4477
|
-
"aria-label": "Close",
|
|
4478
|
-
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4479
|
-
"svg",
|
|
4480
|
-
{
|
|
4481
|
-
width: "14",
|
|
4482
|
-
height: "14",
|
|
4483
|
-
viewBox: "0 0 24 24",
|
|
4484
|
-
fill: "none",
|
|
4485
|
-
stroke: "currentColor",
|
|
4486
|
-
strokeWidth: "2.5",
|
|
4487
|
-
children: [
|
|
4488
|
-
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
4489
|
-
/* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
4490
|
-
]
|
|
4491
|
-
}
|
|
4492
|
-
)
|
|
4493
|
-
}
|
|
4494
|
-
)
|
|
4495
|
-
] }),
|
|
4496
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-700 volr:mb-3", children: t("deposit.completedAmount", { amount: formattedDelta, symbol }) }),
|
|
4497
|
-
expanded && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4498
|
-
"div",
|
|
4499
|
-
{
|
|
4500
|
-
className: "volr:space-y-2 volr:mb-3 volr:p-3 volr:rounded-lg volr:bg-slate-50 volr:border volr:border-slate-200",
|
|
4501
|
-
style: { animation: "volrFadeIn 0.2s ease-out" },
|
|
4502
|
-
children: [
|
|
4503
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs", children: [
|
|
4504
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("deposit.amount") }),
|
|
4505
|
-
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:text-emerald-600 volr:font-semibold", children: [
|
|
4506
|
-
"+",
|
|
4507
|
-
formattedDelta,
|
|
4508
|
-
" ",
|
|
4509
|
-
symbol
|
|
4510
|
-
] })
|
|
4511
|
-
] }),
|
|
4512
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs", children: [
|
|
4513
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("deposit.previousBalance") }),
|
|
4514
|
-
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:text-slate-500", children: [
|
|
4515
|
-
formatAmount(previousBalance),
|
|
4516
|
-
" ",
|
|
4517
|
-
symbol
|
|
4518
|
-
] })
|
|
4519
|
-
] }),
|
|
4520
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs volr:pt-2 volr:border-t volr:border-slate-200", children: [
|
|
4521
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("deposit.newBalance") }),
|
|
4522
|
-
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:font-semibold volr:text-slate-900", children: [
|
|
4523
|
-
formatAmount(newBalance),
|
|
4524
|
-
" ",
|
|
4525
|
-
symbol
|
|
4526
|
-
] })
|
|
4527
|
-
] })
|
|
4528
|
-
]
|
|
4529
|
-
}
|
|
4530
|
-
),
|
|
4531
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4532
|
-
"button",
|
|
4533
|
-
{
|
|
4534
|
-
onClick: () => setExpanded(!expanded),
|
|
4535
|
-
className: "volr:w-full volr:py-2.5 volr:text-xs volr:font-medium volr:rounded-lg volr:transition-colors volr:bg-slate-100 volr:text-slate-600 volr:border volr:border-slate-200 volr:hover:bg-slate-200",
|
|
4536
|
-
children: expanded ? t("deposit.seeLess") : t("deposit.seeMore")
|
|
4537
|
-
}
|
|
4538
|
-
)
|
|
4539
|
-
] })
|
|
4540
|
-
] }) })
|
|
4541
|
-
]
|
|
4542
|
-
}
|
|
4543
|
-
),
|
|
4544
|
-
/* @__PURE__ */ jsxRuntime.jsx("style", { children: `
|
|
4545
|
-
@keyframes volrSlideUp {
|
|
4546
|
-
from {
|
|
4547
|
-
transform: translateY(20px);
|
|
4548
|
-
opacity: 0;
|
|
4549
|
-
}
|
|
4550
|
-
to {
|
|
4551
|
-
transform: translateY(0);
|
|
4552
|
-
opacity: 1;
|
|
4553
|
-
}
|
|
4554
|
-
}
|
|
4555
|
-
@keyframes volrFadeIn {
|
|
4556
|
-
from {
|
|
4557
|
-
opacity: 0;
|
|
4419
|
+
)
|
|
4558
4420
|
}
|
|
4559
|
-
|
|
4560
|
-
|
|
4421
|
+
) }),
|
|
4422
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-2", children: t("account.withdraw.success") }),
|
|
4423
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-sm volr:text-slate-500 volr:mb-6", children: [
|
|
4424
|
+
amount,
|
|
4425
|
+
" ",
|
|
4426
|
+
selectedToken?.symbol,
|
|
4427
|
+
" ",
|
|
4428
|
+
t("account.withdraw.sent")
|
|
4429
|
+
] })
|
|
4430
|
+
] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
4431
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-12 volr:h-12 volr:rounded-full volr:bg-red-100 volr:flex volr:items-center volr:justify-center volr:mx-auto volr:mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4432
|
+
"svg",
|
|
4433
|
+
{
|
|
4434
|
+
className: "volr:w-6 volr:h-6 volr:text-red-600",
|
|
4435
|
+
fill: "none",
|
|
4436
|
+
viewBox: "0 0 24 24",
|
|
4437
|
+
stroke: "currentColor",
|
|
4438
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4439
|
+
"path",
|
|
4440
|
+
{
|
|
4441
|
+
strokeLinecap: "round",
|
|
4442
|
+
strokeLinejoin: "round",
|
|
4443
|
+
strokeWidth: 2,
|
|
4444
|
+
d: "M6 18L18 6M6 6l12 12"
|
|
4445
|
+
}
|
|
4446
|
+
)
|
|
4561
4447
|
}
|
|
4562
|
-
}
|
|
4563
|
-
|
|
4564
|
-
|
|
4565
|
-
}
|
|
4566
|
-
|
|
4567
|
-
|
|
4568
|
-
|
|
4569
|
-
|
|
4570
|
-
|
|
4571
|
-
|
|
4572
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:justify-center volr:mb-3", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:rounded-xl volr:p-3 volr:border volr-bg-secondary volr-border", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-[200px] volr:h-[200px] volr:rounded-lg volr-bg-tertiary" }) }) }),
|
|
4573
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-center volr:gap-2 volr:mb-3", children: [
|
|
4574
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-1.5 volr:h-1.5 volr:rounded-full volr-bg-tertiary" }),
|
|
4575
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-3 volr:w-32 volr:rounded volr-bg-tertiary" })
|
|
4576
|
-
] }),
|
|
4577
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:space-y-3", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:border volr:rounded-lg volr:p-3 volr-bg-secondary volr-border", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:items-center volr:justify-center", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-48 volr:rounded volr-bg-tertiary" }) }) }) }),
|
|
4578
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-center volr:pt-3 volr:border-t volr:mt-3 volr-border", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-3 volr:w-44 volr:rounded volr:mx-auto volr-bg-secondary" }) })
|
|
4579
|
-
] });
|
|
4580
|
-
};
|
|
4581
|
-
function DepositQRView(props) {
|
|
4448
|
+
) }),
|
|
4449
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-2", children: t("account.withdraw.failed") }),
|
|
4450
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-red-500 volr:mb-6", children: error?.message || t("account.withdraw.unknownError") })
|
|
4451
|
+
] }),
|
|
4452
|
+
/* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "secondary", onClick: isSuccess ? onSuccess : handleReset, fullWidth: true, children: isSuccess ? t("common.done") : t("common.tryAgain") })
|
|
4453
|
+
] });
|
|
4454
|
+
}
|
|
4455
|
+
return null;
|
|
4456
|
+
}
|
|
4457
|
+
function PaymentRow({ payment, onClick }) {
|
|
4582
4458
|
const { t } = useI18n();
|
|
4583
|
-
const
|
|
4584
|
-
const
|
|
4585
|
-
|
|
4586
|
-
|
|
4587
|
-
|
|
4588
|
-
const [toastData, setToastData] = React13.useState(null);
|
|
4589
|
-
const [viewMode, setViewMode] = React13.useState("qr");
|
|
4590
|
-
const eip681 = `ethereum:${props.address}`;
|
|
4591
|
-
const status = react.useDepositListener({
|
|
4592
|
-
chainId: props.chainId,
|
|
4593
|
-
asset: props.asset === "native" ? { kind: "native" } : {
|
|
4594
|
-
kind: "erc20",
|
|
4595
|
-
token: {
|
|
4596
|
-
address: props.asset.address,
|
|
4597
|
-
decimals: props.asset.decimals
|
|
4598
|
-
}
|
|
4599
|
-
},
|
|
4600
|
-
address: props.address
|
|
4459
|
+
const date = new Date(payment.createdAt);
|
|
4460
|
+
const formattedDate = date.toLocaleDateString(void 0, {
|
|
4461
|
+
month: "short",
|
|
4462
|
+
day: "numeric",
|
|
4463
|
+
year: "numeric"
|
|
4601
4464
|
});
|
|
4602
|
-
|
|
4603
|
-
|
|
4604
|
-
|
|
4605
|
-
|
|
4606
|
-
|
|
4607
|
-
|
|
4608
|
-
|
|
4609
|
-
|
|
4465
|
+
const statusColors = {
|
|
4466
|
+
CONFIRMED: "volr:bg-green-100 volr:text-green-700",
|
|
4467
|
+
PENDING: "volr:bg-yellow-100 volr:text-yellow-700",
|
|
4468
|
+
PROCESSING: "volr:bg-blue-100 volr:text-blue-700",
|
|
4469
|
+
FAILED: "volr:bg-red-100 volr:text-red-700",
|
|
4470
|
+
CANCELLED: "volr:bg-slate-100 volr:text-slate-500",
|
|
4471
|
+
EXPIRED: "volr:bg-slate-100 volr:text-slate-500"
|
|
4472
|
+
};
|
|
4473
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4474
|
+
"button",
|
|
4475
|
+
{
|
|
4476
|
+
type: "button",
|
|
4477
|
+
onClick,
|
|
4478
|
+
className: "volr:w-full volr:flex volr:items-center volr:justify-between volr:py-3 volr:border-b volr:border-slate-100 hover:volr:bg-slate-50 volr:transition-colors volr:text-left",
|
|
4479
|
+
children: [
|
|
4480
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1 volr:min-w-0", children: [
|
|
4481
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2 volr:mb-1", children: [
|
|
4482
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900 volr:truncate", children: payment.itemName || t("account.payments.payment") }),
|
|
4483
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4484
|
+
"span",
|
|
4485
|
+
{
|
|
4486
|
+
className: `volr:px-1.5 volr:py-0.5 volr:text-xs volr:font-medium volr:rounded ${statusColors[payment.status] || "volr:bg-slate-100 volr:text-slate-500"}`,
|
|
4487
|
+
children: payment.status
|
|
4488
|
+
}
|
|
4489
|
+
)
|
|
4490
|
+
] }),
|
|
4491
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-400", children: formattedDate })
|
|
4492
|
+
] }),
|
|
4493
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2", children: [
|
|
4494
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-right", children: [
|
|
4495
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-sm volr:font-medium volr:text-slate-900", children: [
|
|
4496
|
+
payment.amount,
|
|
4497
|
+
" ",
|
|
4498
|
+
payment.token.symbol
|
|
4499
|
+
] }),
|
|
4500
|
+
payment.totalUsd && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-xs volr:text-slate-400", children: [
|
|
4501
|
+
"$",
|
|
4502
|
+
parseFloat(payment.totalUsd).toFixed(2)
|
|
4503
|
+
] })
|
|
4504
|
+
] }),
|
|
4505
|
+
/* @__PURE__ */ jsxRuntime.jsx(ChevronRightIcon, { className: "volr:w-4 volr:h-4 volr:text-slate-300" })
|
|
4506
|
+
] })
|
|
4507
|
+
]
|
|
4610
4508
|
}
|
|
4611
|
-
}, [status]);
|
|
4612
|
-
const getNetworkInfo = React13.useCallback(
|
|
4613
|
-
react.createGetNetworkInfo({ client, rpcOverrides: config.rpcOverrides }),
|
|
4614
|
-
[client, config.rpcOverrides]
|
|
4615
4509
|
);
|
|
4616
|
-
|
|
4617
|
-
|
|
4618
|
-
|
|
4619
|
-
|
|
4620
|
-
|
|
4621
|
-
|
|
4622
|
-
|
|
4623
|
-
|
|
4624
|
-
|
|
4625
|
-
|
|
4626
|
-
|
|
4627
|
-
|
|
4628
|
-
|
|
4629
|
-
|
|
4630
|
-
|
|
4631
|
-
|
|
4632
|
-
|
|
4633
|
-
};
|
|
4634
|
-
}, [
|
|
4635
|
-
|
|
4636
|
-
|
|
4637
|
-
|
|
4638
|
-
|
|
4639
|
-
|
|
4510
|
+
}
|
|
4511
|
+
function PaymentHistoryView({ onSelectPayment }) {
|
|
4512
|
+
const { t } = useI18n();
|
|
4513
|
+
const { getPaymentHistory, isLoading: isApiLoading } = react.useVolrPaymentApi();
|
|
4514
|
+
const [payments, setPayments] = React13.useState([]);
|
|
4515
|
+
const [isLoading, setIsLoading] = React13.useState(true);
|
|
4516
|
+
const [error, setError] = React13.useState(null);
|
|
4517
|
+
React13.useEffect(() => {
|
|
4518
|
+
setIsLoading(true);
|
|
4519
|
+
setError(null);
|
|
4520
|
+
getPaymentHistory({ take: 20 }).then((result) => {
|
|
4521
|
+
setPayments(result.payments);
|
|
4522
|
+
}).catch((err) => {
|
|
4523
|
+
console.error("[PaymentHistoryView] Failed to fetch payments:", err);
|
|
4524
|
+
setError(t("account.payments.fetchError"));
|
|
4525
|
+
}).finally(() => {
|
|
4526
|
+
setIsLoading(false);
|
|
4527
|
+
});
|
|
4528
|
+
}, [getPaymentHistory, t]);
|
|
4529
|
+
if (isLoading || isApiLoading) {
|
|
4530
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-8", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:animate-pulse volr:space-y-4", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:py-3", children: [
|
|
4531
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4532
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-32 volr:bg-slate-200 volr:rounded volr:mb-2" }),
|
|
4533
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-3 volr:w-20 volr:bg-slate-100 volr:rounded" })
|
|
4534
|
+
] }),
|
|
4535
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:h-4 volr:w-16 volr:bg-slate-200 volr:rounded" })
|
|
4536
|
+
] }, i)) }) });
|
|
4537
|
+
}
|
|
4538
|
+
if (error) {
|
|
4539
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-12 volr:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-red-500", children: error }) });
|
|
4540
|
+
}
|
|
4541
|
+
if (payments.length === 0) {
|
|
4542
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:py-12 volr:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-400", children: t("account.payments.noPayments") }) });
|
|
4543
|
+
}
|
|
4544
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4545
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.menu.payments") }),
|
|
4546
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { children: payments.map((payment) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
4547
|
+
PaymentRow,
|
|
4548
|
+
{
|
|
4549
|
+
payment,
|
|
4550
|
+
onClick: () => onSelectPayment(payment)
|
|
4551
|
+
},
|
|
4552
|
+
payment.id
|
|
4553
|
+
)) })
|
|
4554
|
+
] });
|
|
4555
|
+
}
|
|
4556
|
+
function DetailRow({ label, value, copyable, mono }) {
|
|
4557
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-start volr:justify-between volr:py-2 volr:border-b volr:border-slate-100 last:volr:border-b-0", children: [
|
|
4558
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:text-slate-500", children: label }),
|
|
4559
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2", children: [
|
|
4640
4560
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4641
|
-
|
|
4561
|
+
"span",
|
|
4642
4562
|
{
|
|
4643
|
-
|
|
4644
|
-
|
|
4645
|
-
destinationAddress: props.address,
|
|
4646
|
-
onBack: () => setViewMode("qr"),
|
|
4647
|
-
onSuccess: () => {
|
|
4648
|
-
setViewMode("qr");
|
|
4649
|
-
}
|
|
4563
|
+
className: `volr:text-sm volr:text-slate-900 volr:text-right ${mono ? "volr:font-mono" : ""}`,
|
|
4564
|
+
children: value
|
|
4650
4565
|
}
|
|
4651
4566
|
),
|
|
4652
|
-
|
|
4653
|
-
|
|
4654
|
-
|
|
4655
|
-
|
|
4656
|
-
|
|
4657
|
-
|
|
4658
|
-
|
|
4659
|
-
|
|
4660
|
-
|
|
4661
|
-
|
|
4662
|
-
|
|
4663
|
-
|
|
4664
|
-
|
|
4665
|
-
|
|
4666
|
-
|
|
4667
|
-
|
|
4668
|
-
|
|
4669
|
-
|
|
4670
|
-
|
|
4671
|
-
|
|
4672
|
-
|
|
4673
|
-
|
|
4674
|
-
|
|
4675
|
-
|
|
4676
|
-
|
|
4677
|
-
|
|
4678
|
-
|
|
4679
|
-
|
|
4680
|
-
|
|
4681
|
-
|
|
4682
|
-
|
|
4683
|
-
|
|
4684
|
-
|
|
4685
|
-
|
|
4686
|
-
|
|
4687
|
-
|
|
4688
|
-
|
|
4689
|
-
|
|
4690
|
-
/* @__PURE__ */ jsxRuntime.jsx(DepositQRStatusOverlay, { status: status.state })
|
|
4691
|
-
] }) }),
|
|
4692
|
-
(status.state === "listening" || status.state === "idle") && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-center volr:gap-2 volr:mb-3", children: [
|
|
4693
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-1.5 volr:h-1.5 volr:rounded-full volr:animate-pulse volr-text-secondary", style: { backgroundColor: "currentColor" } }),
|
|
4694
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr-text-secondary", children: t("deposit.listening") })
|
|
4695
|
-
] }),
|
|
4696
|
-
status.state === "error" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-xs volr:text-center volr:mb-3 volr-error", children: [
|
|
4697
|
-
"Error: ",
|
|
4698
|
-
status.message
|
|
4699
|
-
] }),
|
|
4700
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-3", children: [
|
|
4701
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:relative volr:border volr:rounded-lg volr:p-3 volr:transition-all volr-bg-secondary volr-border volr-hover", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:gap-3", children: [
|
|
4702
|
-
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:font-mono volr:text-xs volr:font-medium volr:flex-1 volr:text-center", children: `${props.address.slice(0, 10)}...${props.address.slice(-8)}` }),
|
|
4567
|
+
copyable && /* @__PURE__ */ jsxRuntime.jsx(CopyButton, { text: value, className: "volr:shrink-0" })
|
|
4568
|
+
] })
|
|
4569
|
+
] });
|
|
4570
|
+
}
|
|
4571
|
+
function PaymentDetailView({ payment }) {
|
|
4572
|
+
const { t } = useI18n();
|
|
4573
|
+
const createdDate = new Date(payment.createdAt);
|
|
4574
|
+
const formattedCreatedAt = createdDate.toLocaleString(void 0, {
|
|
4575
|
+
year: "numeric",
|
|
4576
|
+
month: "short",
|
|
4577
|
+
day: "numeric",
|
|
4578
|
+
hour: "2-digit",
|
|
4579
|
+
minute: "2-digit"
|
|
4580
|
+
});
|
|
4581
|
+
const confirmedDate = payment.confirmedAt ? new Date(payment.confirmedAt) : null;
|
|
4582
|
+
const formattedConfirmedAt = confirmedDate ? confirmedDate.toLocaleString(void 0, {
|
|
4583
|
+
year: "numeric",
|
|
4584
|
+
month: "short",
|
|
4585
|
+
day: "numeric",
|
|
4586
|
+
hour: "2-digit",
|
|
4587
|
+
minute: "2-digit"
|
|
4588
|
+
}) : null;
|
|
4589
|
+
const statusColors = {
|
|
4590
|
+
CONFIRMED: "volr:bg-green-100 volr:text-green-700",
|
|
4591
|
+
PENDING: "volr:bg-yellow-100 volr:text-yellow-700",
|
|
4592
|
+
PROCESSING: "volr:bg-blue-100 volr:text-blue-700",
|
|
4593
|
+
FAILED: "volr:bg-red-100 volr:text-red-700",
|
|
4594
|
+
CANCELLED: "volr:bg-slate-100 volr:text-slate-500",
|
|
4595
|
+
EXPIRED: "volr:bg-slate-100 volr:text-slate-500"
|
|
4596
|
+
};
|
|
4597
|
+
const truncateHash = (hash) => {
|
|
4598
|
+
if (hash.length <= 16) return hash;
|
|
4599
|
+
return `${hash.slice(0, 8)}...${hash.slice(-6)}`;
|
|
4600
|
+
};
|
|
4601
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4602
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-6", children: [
|
|
4603
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2 volr:mb-2", children: [
|
|
4604
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900", children: payment.itemName || t("account.payments.payment") }),
|
|
4703
4605
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4704
|
-
|
|
4606
|
+
"span",
|
|
4705
4607
|
{
|
|
4706
|
-
text:
|
|
4707
|
-
|
|
4608
|
+
className: `volr:px-2 volr:py-0.5 volr:text-xs volr:font-medium volr:rounded ${statusColors[payment.status] || "volr:bg-slate-100 volr:text-slate-500"}`,
|
|
4609
|
+
children: payment.status
|
|
4708
4610
|
}
|
|
4709
4611
|
)
|
|
4710
|
-
] })
|
|
4711
|
-
|
|
4612
|
+
] }),
|
|
4613
|
+
payment.itemDescription && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500", children: payment.itemDescription })
|
|
4712
4614
|
] }),
|
|
4713
|
-
/* @__PURE__ */ jsxRuntime.
|
|
4714
|
-
"
|
|
4715
|
-
|
|
4716
|
-
|
|
4717
|
-
|
|
4718
|
-
|
|
4719
|
-
|
|
4720
|
-
|
|
4721
|
-
|
|
4722
|
-
|
|
4723
|
-
|
|
4724
|
-
|
|
4725
|
-
|
|
4726
|
-
|
|
4727
|
-
|
|
4728
|
-
children: [
|
|
4729
|
-
/* @__PURE__ */ jsxRuntime.jsx("rect", { x: "2", y: "6", width: "20", height: "14", rx: "2" }),
|
|
4730
|
-
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M17 12.5C17 13.3284 16.3284 14 15.5 14C14.6716 14 14 13.3284 14 12.5C14 11.6716 14.6716 11 15.5 11C16.3284 11 17 11.6716 17 12.5Z", fill: "currentColor" }),
|
|
4731
|
-
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6 6V5C6 3.89543 6.89543 3 8 3H16C17.1046 3 18 3.89543 18 5V6" })
|
|
4732
|
-
]
|
|
4733
|
-
}
|
|
4734
|
-
),
|
|
4735
|
-
t("deposit.useWallet")
|
|
4736
|
-
]
|
|
4737
|
-
}
|
|
4738
|
-
) }),
|
|
4739
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-center volr:pt-3 volr:mt-3 volr:border-t volr-border", children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:text-xs volr-text-secondary", children: [
|
|
4740
|
-
t("deposit.noToken"),
|
|
4741
|
-
" ",
|
|
4615
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-4 volr:mb-4 volr:border-y volr:border-slate-100", children: [
|
|
4616
|
+
/* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-2xl volr:font-semibold volr:text-slate-900", children: [
|
|
4617
|
+
payment.amount,
|
|
4618
|
+
" ",
|
|
4619
|
+
payment.token.symbol
|
|
4620
|
+
] }),
|
|
4621
|
+
payment.totalUsd && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-sm volr:text-slate-500", children: [
|
|
4622
|
+
"\u2248 $",
|
|
4623
|
+
parseFloat(payment.totalUsd).toFixed(2),
|
|
4624
|
+
" USD"
|
|
4625
|
+
] })
|
|
4626
|
+
] }),
|
|
4627
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-1", children: [
|
|
4628
|
+
/* @__PURE__ */ jsxRuntime.jsx(DetailRow, { label: t("account.payments.createdAt"), value: formattedCreatedAt }),
|
|
4629
|
+
formattedConfirmedAt && /* @__PURE__ */ jsxRuntime.jsx(DetailRow, { label: t("account.payments.confirmedAt"), value: formattedConfirmedAt }),
|
|
4742
4630
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4743
|
-
|
|
4631
|
+
DetailRow,
|
|
4744
4632
|
{
|
|
4745
|
-
|
|
4746
|
-
|
|
4747
|
-
|
|
4633
|
+
label: t("account.payments.token"),
|
|
4634
|
+
value: `${payment.token.symbol} (Chain ${payment.token.chainId})`
|
|
4635
|
+
}
|
|
4636
|
+
),
|
|
4637
|
+
payment.txHash && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4638
|
+
DetailRow,
|
|
4639
|
+
{
|
|
4640
|
+
label: t("account.payments.txHash"),
|
|
4641
|
+
value: truncateHash(payment.txHash),
|
|
4642
|
+
copyable: true,
|
|
4643
|
+
mono: true
|
|
4644
|
+
}
|
|
4645
|
+
),
|
|
4646
|
+
payment.referenceId && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4647
|
+
DetailRow,
|
|
4648
|
+
{
|
|
4649
|
+
label: t("account.payments.referenceId"),
|
|
4650
|
+
value: payment.referenceId,
|
|
4651
|
+
copyable: true
|
|
4748
4652
|
}
|
|
4749
4653
|
)
|
|
4750
|
-
] })
|
|
4751
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4752
|
-
|
|
4753
|
-
{
|
|
4754
|
-
open: showOtherTokenModal,
|
|
4755
|
-
onOpenChange: setShowOtherTokenModal
|
|
4756
|
-
}
|
|
4757
|
-
),
|
|
4758
|
-
showToast && toastData && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4759
|
-
DepositCompletedToast,
|
|
4654
|
+
] }),
|
|
4655
|
+
payment.itemImage && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-6", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4656
|
+
"img",
|
|
4760
4657
|
{
|
|
4761
|
-
|
|
4762
|
-
|
|
4763
|
-
|
|
4764
|
-
},
|
|
4765
|
-
previousBalance: toastData.previousBalance,
|
|
4766
|
-
newBalance: toastData.newBalance,
|
|
4767
|
-
delta: toastData.delta,
|
|
4768
|
-
decimals,
|
|
4769
|
-
symbol: tokenSymbol
|
|
4658
|
+
src: payment.itemImage,
|
|
4659
|
+
alt: payment.itemName || "Item",
|
|
4660
|
+
className: "volr:w-full volr:h-40 volr:object-cover volr:rounded-lg"
|
|
4770
4661
|
}
|
|
4771
|
-
)
|
|
4662
|
+
) })
|
|
4663
|
+
] });
|
|
4664
|
+
}
|
|
4665
|
+
function InfoRow({ label, value, copyable, mono }) {
|
|
4666
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-3 volr:border-b volr:border-slate-100 last:volr:border-b-0", children: [
|
|
4667
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-400 volr:mb-1", children: label }),
|
|
4668
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:gap-2", children: [
|
|
4669
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4670
|
+
"p",
|
|
4671
|
+
{
|
|
4672
|
+
className: `volr:text-sm volr:text-slate-900 volr:break-all ${mono ? "volr:font-mono" : ""}`,
|
|
4673
|
+
children: value
|
|
4674
|
+
}
|
|
4675
|
+
),
|
|
4676
|
+
copyable && /* @__PURE__ */ jsxRuntime.jsx(CopyButton, { text: value, className: "volr:shrink-0" })
|
|
4677
|
+
] })
|
|
4772
4678
|
] });
|
|
4773
4679
|
}
|
|
4774
|
-
function
|
|
4775
|
-
|
|
4776
|
-
|
|
4777
|
-
|
|
4778
|
-
|
|
4779
|
-
|
|
4780
|
-
|
|
4781
|
-
|
|
4782
|
-
|
|
4783
|
-
|
|
4784
|
-
|
|
4785
|
-
|
|
4786
|
-
|
|
4787
|
-
|
|
4680
|
+
function AccountInfoView({ user }) {
|
|
4681
|
+
const { t } = useI18n();
|
|
4682
|
+
const getLoginMethod = () => {
|
|
4683
|
+
if (user.authWallet) {
|
|
4684
|
+
return t("account.info.loginMethod.wallet");
|
|
4685
|
+
}
|
|
4686
|
+
if (user.email?.includes("@google.")) {
|
|
4687
|
+
return t("account.info.loginMethod.google");
|
|
4688
|
+
}
|
|
4689
|
+
if (user.email?.includes("@twitter.") || user.email?.includes("@x.")) {
|
|
4690
|
+
return t("account.info.loginMethod.twitter");
|
|
4691
|
+
}
|
|
4692
|
+
if (user.email?.includes("@wallet.")) {
|
|
4693
|
+
return t("account.info.loginMethod.wallet");
|
|
4694
|
+
}
|
|
4695
|
+
return t("account.info.loginMethod.email");
|
|
4696
|
+
};
|
|
4697
|
+
const formatAddress = (address) => {
|
|
4698
|
+
if (address.length <= 16) return address;
|
|
4699
|
+
return `${address.slice(0, 6)}...${address.slice(-4)}`;
|
|
4700
|
+
};
|
|
4701
|
+
const externalWallet = user.authWallet ? user.authWallet.split(":")[1] || user.authWallet : null;
|
|
4702
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4703
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-lg volr:font-semibold volr:text-slate-900 volr:mb-4", children: t("account.menu.account") }),
|
|
4704
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
4705
|
+
/* @__PURE__ */ jsxRuntime.jsx(InfoRow, { label: t("account.info.loginMethod.label"), value: getLoginMethod() }),
|
|
4706
|
+
user.email && !user.email.includes("@wallet.") && /* @__PURE__ */ jsxRuntime.jsx(InfoRow, { label: t("account.email"), value: user.email }),
|
|
4707
|
+
user.evmAddress && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4708
|
+
InfoRow,
|
|
4788
4709
|
{
|
|
4789
|
-
|
|
4790
|
-
|
|
4791
|
-
|
|
4710
|
+
label: t("account.walletAddress"),
|
|
4711
|
+
value: formatAddress(user.evmAddress),
|
|
4712
|
+
copyable: true,
|
|
4713
|
+
mono: true
|
|
4792
4714
|
}
|
|
4793
|
-
)
|
|
4794
|
-
|
|
4795
|
-
|
|
4796
|
-
if (depositAssets.length === 0) {
|
|
4797
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
4798
|
-
/* @__PURE__ */ jsxRuntime.jsx(DepositSkeleton, {}),
|
|
4799
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4800
|
-
"div",
|
|
4715
|
+
),
|
|
4716
|
+
externalWallet && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4717
|
+
InfoRow,
|
|
4801
4718
|
{
|
|
4802
|
-
|
|
4803
|
-
|
|
4804
|
-
|
|
4719
|
+
label: t("account.info.connectedWallet"),
|
|
4720
|
+
value: formatAddress(externalWallet),
|
|
4721
|
+
copyable: true,
|
|
4722
|
+
mono: true
|
|
4805
4723
|
}
|
|
4806
|
-
)
|
|
4807
|
-
|
|
4808
|
-
|
|
4809
|
-
if (!evmAddress) {
|
|
4810
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
|
|
4811
|
-
/* @__PURE__ */ jsxRuntime.jsx(DepositSkeleton, {}),
|
|
4812
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4813
|
-
"div",
|
|
4724
|
+
),
|
|
4725
|
+
user.signerType && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4726
|
+
InfoRow,
|
|
4814
4727
|
{
|
|
4815
|
-
|
|
4816
|
-
|
|
4817
|
-
children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-center volr:px-4 volr-text-secondary", children: "Wallet address is not ready. Please finish wallet setup first." })
|
|
4728
|
+
label: t("account.info.signerType"),
|
|
4729
|
+
value: user.signerType === "passkey" ? "Passkey" : user.signerType
|
|
4818
4730
|
}
|
|
4819
4731
|
)
|
|
4820
|
-
] })
|
|
4821
|
-
}
|
|
4822
|
-
|
|
4823
|
-
|
|
4824
|
-
|
|
4825
|
-
|
|
4826
|
-
|
|
4827
|
-
|
|
4828
|
-
|
|
4829
|
-
|
|
4732
|
+
] })
|
|
4733
|
+
] });
|
|
4734
|
+
}
|
|
4735
|
+
function AccountModal({ isOpen, onClose, onError }) {
|
|
4736
|
+
const { user, logout } = react.useVolrContext();
|
|
4737
|
+
const { balances, totalUsd, isLoading, paymentEnabled, refresh } = react.useUserBalances();
|
|
4738
|
+
const { client } = react.useInternalAuth();
|
|
4739
|
+
const [currentView, setCurrentView] = React13.useState("main");
|
|
4740
|
+
const [selectedPayment, setSelectedPayment] = React13.useState(null);
|
|
4741
|
+
const [isLoggingOut, setIsLoggingOut] = React13.useState(false);
|
|
4742
|
+
const [depositAssets, setDepositAssets] = React13.useState([]);
|
|
4743
|
+
const [depositLoading, setDepositLoading] = React13.useState(false);
|
|
4744
|
+
const [depositError, setDepositError] = React13.useState(null);
|
|
4745
|
+
const [depositSelectedIdx, setDepositSelectedIdx] = React13.useState(-1);
|
|
4746
|
+
React13.useEffect(() => {
|
|
4747
|
+
if (currentView !== "deposit" || !isOpen) return;
|
|
4748
|
+
setDepositLoading(true);
|
|
4749
|
+
setDepositError(null);
|
|
4750
|
+
client.get("/auth/branding").then((response) => {
|
|
4751
|
+
const assets = response.depositAssets ?? [];
|
|
4752
|
+
setDepositAssets(assets);
|
|
4753
|
+
if (assets.length === 1) {
|
|
4754
|
+
setDepositSelectedIdx(0);
|
|
4830
4755
|
}
|
|
4831
|
-
)
|
|
4756
|
+
}).catch((err) => {
|
|
4757
|
+
console.error("Failed to fetch deposit assets:", err);
|
|
4758
|
+
setDepositError("Failed to load deposit options");
|
|
4759
|
+
}).finally(() => {
|
|
4760
|
+
setDepositLoading(false);
|
|
4761
|
+
});
|
|
4762
|
+
}, [currentView, isOpen, client]);
|
|
4763
|
+
const handleOpenChange = React13.useCallback((open) => {
|
|
4764
|
+
if (!open) {
|
|
4765
|
+
onClose();
|
|
4766
|
+
setTimeout(() => {
|
|
4767
|
+
setCurrentView("main");
|
|
4768
|
+
setSelectedPayment(null);
|
|
4769
|
+
}, 200);
|
|
4770
|
+
}
|
|
4771
|
+
}, [onClose]);
|
|
4772
|
+
if (!user) {
|
|
4773
|
+
return /* @__PURE__ */ jsxRuntime.jsx(SigninModal, { isOpen, onClose, onError });
|
|
4832
4774
|
}
|
|
4833
|
-
if (
|
|
4834
|
-
|
|
4835
|
-
|
|
4775
|
+
if (!user.keyStorageType) {
|
|
4776
|
+
const handlePasskeyComplete = () => {
|
|
4777
|
+
onClose();
|
|
4778
|
+
};
|
|
4779
|
+
const handlePasskeyError = (error) => {
|
|
4780
|
+
if (onError) onError(error);
|
|
4781
|
+
};
|
|
4782
|
+
const handleLogoutFromPasskey = async () => {
|
|
4783
|
+
try {
|
|
4784
|
+
await logout();
|
|
4785
|
+
onClose();
|
|
4786
|
+
} catch (error) {
|
|
4787
|
+
if (onError) {
|
|
4788
|
+
onError(error instanceof Error ? error : new Error("Logout failed"));
|
|
4789
|
+
}
|
|
4790
|
+
}
|
|
4791
|
+
};
|
|
4792
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Modal, { open: isOpen, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4793
|
+
PasskeyEnrollView,
|
|
4836
4794
|
{
|
|
4837
|
-
|
|
4838
|
-
|
|
4795
|
+
wrapInModal: false,
|
|
4796
|
+
onComplete: handlePasskeyComplete,
|
|
4797
|
+
onError: handlePasskeyError,
|
|
4798
|
+
onLogout: handleLogoutFromPasskey,
|
|
4799
|
+
onClose
|
|
4839
4800
|
}
|
|
4840
|
-
);
|
|
4801
|
+
) });
|
|
4841
4802
|
}
|
|
4842
|
-
const
|
|
4843
|
-
|
|
4844
|
-
|
|
4845
|
-
|
|
4846
|
-
|
|
4847
|
-
|
|
4848
|
-
|
|
4849
|
-
|
|
4803
|
+
const handleLogout = async () => {
|
|
4804
|
+
setIsLoggingOut(true);
|
|
4805
|
+
try {
|
|
4806
|
+
await logout();
|
|
4807
|
+
onClose();
|
|
4808
|
+
} catch (error) {
|
|
4809
|
+
if (onError) {
|
|
4810
|
+
onError(error instanceof Error ? error : new Error("Logout failed"));
|
|
4811
|
+
}
|
|
4812
|
+
} finally {
|
|
4813
|
+
setIsLoggingOut(false);
|
|
4850
4814
|
}
|
|
4851
|
-
|
|
4815
|
+
};
|
|
4816
|
+
const handleNavigate = (view) => {
|
|
4817
|
+
setCurrentView(view);
|
|
4818
|
+
};
|
|
4819
|
+
const handleBack = () => {
|
|
4820
|
+
if (selectedPayment) {
|
|
4821
|
+
setSelectedPayment(null);
|
|
4822
|
+
setCurrentView("payments");
|
|
4823
|
+
} else if (currentView === "deposit" && depositSelectedIdx >= 0 && depositAssets.length > 1) {
|
|
4824
|
+
setDepositSelectedIdx(-1);
|
|
4825
|
+
} else {
|
|
4826
|
+
setCurrentView("main");
|
|
4827
|
+
setDepositSelectedIdx(-1);
|
|
4828
|
+
}
|
|
4829
|
+
};
|
|
4830
|
+
const handleSelectPayment = (payment) => {
|
|
4831
|
+
setSelectedPayment(payment);
|
|
4832
|
+
};
|
|
4833
|
+
const handleWithdrawSuccess = () => {
|
|
4834
|
+
refresh();
|
|
4835
|
+
setCurrentView("main");
|
|
4836
|
+
};
|
|
4837
|
+
const showBack = currentView !== "main" || selectedPayment !== null || currentView === "deposit" && depositSelectedIdx >= 0 && depositAssets.length > 1;
|
|
4838
|
+
const renderContent = () => {
|
|
4839
|
+
if (selectedPayment) {
|
|
4840
|
+
return /* @__PURE__ */ jsxRuntime.jsx(PaymentDetailView, { payment: selectedPayment });
|
|
4841
|
+
}
|
|
4842
|
+
switch (currentView) {
|
|
4843
|
+
case "main":
|
|
4844
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4845
|
+
AccountMainView,
|
|
4846
|
+
{
|
|
4847
|
+
totalUsd,
|
|
4848
|
+
balances,
|
|
4849
|
+
isLoading,
|
|
4850
|
+
paymentEnabled,
|
|
4851
|
+
onNavigate: handleNavigate,
|
|
4852
|
+
onLogout: handleLogout,
|
|
4853
|
+
isLoggingOut
|
|
4854
|
+
}
|
|
4855
|
+
);
|
|
4856
|
+
case "assets":
|
|
4857
|
+
return /* @__PURE__ */ jsxRuntime.jsx(BalanceDetailView, { balances, isLoading });
|
|
4858
|
+
case "deposit":
|
|
4859
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4860
|
+
DepositModalBody,
|
|
4861
|
+
{
|
|
4862
|
+
isLoading: depositLoading,
|
|
4863
|
+
error: depositError,
|
|
4864
|
+
depositAssets,
|
|
4865
|
+
evmAddress: user.evmAddress,
|
|
4866
|
+
selectedIdx: depositSelectedIdx,
|
|
4867
|
+
onSelectIdx: setDepositSelectedIdx
|
|
4868
|
+
}
|
|
4869
|
+
);
|
|
4870
|
+
case "withdraw":
|
|
4871
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4872
|
+
WithdrawView,
|
|
4873
|
+
{
|
|
4874
|
+
balances,
|
|
4875
|
+
connectedWallet: user.authWallet,
|
|
4876
|
+
onSuccess: handleWithdrawSuccess
|
|
4877
|
+
}
|
|
4878
|
+
);
|
|
4879
|
+
case "payments":
|
|
4880
|
+
return /* @__PURE__ */ jsxRuntime.jsx(PaymentHistoryView, { onSelectPayment: handleSelectPayment });
|
|
4881
|
+
case "account":
|
|
4882
|
+
return /* @__PURE__ */ jsxRuntime.jsx(AccountInfoView, { user });
|
|
4883
|
+
default:
|
|
4884
|
+
return null;
|
|
4885
|
+
}
|
|
4886
|
+
};
|
|
4887
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(Modal, { open: isOpen, onOpenChange: handleOpenChange, children: [
|
|
4888
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4889
|
+
ModalHeader,
|
|
4890
|
+
{
|
|
4891
|
+
back: showBack,
|
|
4892
|
+
onBack: showBack ? handleBack : void 0,
|
|
4893
|
+
onClose
|
|
4894
|
+
}
|
|
4895
|
+
),
|
|
4896
|
+
renderContent()
|
|
4897
|
+
] });
|
|
4852
4898
|
}
|
|
4853
4899
|
var DepositModal = ({
|
|
4854
4900
|
open,
|