@volr/react-ui 0.1.99 → 0.1.101
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/README.md +42 -7
- package/dist/index.cjs +470 -132
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +8 -1
- package/dist/index.d.ts +8 -1
- package/dist/index.js +351 -13
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
package/dist/index.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var React12 = require('react');
|
|
4
4
|
var reactDom = require('react-dom');
|
|
5
5
|
var react = require('@volr/react');
|
|
6
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
@@ -10,7 +10,7 @@ var qrcode_react = require('qrcode.react');
|
|
|
10
10
|
|
|
11
11
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
12
12
|
|
|
13
|
-
var
|
|
13
|
+
var React12__default = /*#__PURE__*/_interopDefault(React12);
|
|
14
14
|
|
|
15
15
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
16
16
|
var __esm = (fn, res) => function __init() {
|
|
@@ -463,6 +463,13 @@ var en = {
|
|
|
463
463
|
noToken: "Don't have this token?",
|
|
464
464
|
getOtherToken: "Deposit with another token"
|
|
465
465
|
},
|
|
466
|
+
sign: {
|
|
467
|
+
title: "Sign Request",
|
|
468
|
+
description: "An application is requesting your signature. Please review the content below before signing.",
|
|
469
|
+
confirm: "Sign",
|
|
470
|
+
messageLabel: "Message",
|
|
471
|
+
domainLabel: "Domain"
|
|
472
|
+
},
|
|
466
473
|
errors: {
|
|
467
474
|
webauthnNotSupported: "WebAuthn API is not supported",
|
|
468
475
|
passkeyCreationFailed: "Failed to create passkey",
|
|
@@ -585,6 +592,13 @@ var ko = {
|
|
|
585
592
|
noToken: "\uC774 \uD1A0\uD070\uC774 \uC5C6\uC73C\uC2E0\uAC00\uC694?",
|
|
586
593
|
getOtherToken: "\uB2E4\uB978 \uD1A0\uD070\uC73C\uB85C \uC785\uAE08\uD558\uAE30"
|
|
587
594
|
},
|
|
595
|
+
sign: {
|
|
596
|
+
title: "\uC11C\uBA85 \uC694\uCCAD",
|
|
597
|
+
description: "\uC571\uC5D0\uC11C \uC11C\uBA85\uC744 \uC694\uCCAD\uD558\uACE0 \uC788\uC2B5\uB2C8\uB2E4. \uC544\uB798 \uB0B4\uC6A9\uC744 \uD655\uC778\uD55C \uD6C4 \uC11C\uBA85\uD574\uC8FC\uC138\uC694.",
|
|
598
|
+
confirm: "\uC11C\uBA85\uD558\uAE30",
|
|
599
|
+
messageLabel: "\uBA54\uC2DC\uC9C0",
|
|
600
|
+
domainLabel: "\uB3C4\uBA54\uC778"
|
|
601
|
+
},
|
|
588
602
|
errors: {
|
|
589
603
|
webauthnNotSupported: "WebAuthn API\uAC00 \uC9C0\uC6D0\uB418\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4.",
|
|
590
604
|
passkeyCreationFailed: "\uD328\uC2A4\uD0A4 \uC0DD\uC131\uC5D0 \uC2E4\uD328\uD588\uC2B5\uB2C8\uB2E4.",
|
|
@@ -604,13 +618,13 @@ var translations = {
|
|
|
604
618
|
function getTranslations(locale = "en") {
|
|
605
619
|
return translations[locale] || translations.en;
|
|
606
620
|
}
|
|
607
|
-
var I18nContext =
|
|
621
|
+
var I18nContext = React12.createContext(null);
|
|
608
622
|
function interpolate(text, params) {
|
|
609
623
|
if (!params) return text;
|
|
610
624
|
return text.replace(/\{\{(\w+)\}\}/g, (_, key) => params[key] ?? `{{${key}}}`);
|
|
611
625
|
}
|
|
612
626
|
function useI18n() {
|
|
613
|
-
const context =
|
|
627
|
+
const context = React12.useContext(I18nContext);
|
|
614
628
|
if (!context) {
|
|
615
629
|
return {
|
|
616
630
|
locale: "en",
|
|
@@ -645,9 +659,9 @@ function detectLocale() {
|
|
|
645
659
|
return lang.startsWith("ko") ? "ko" : "en";
|
|
646
660
|
}
|
|
647
661
|
function I18nProvider({ children }) {
|
|
648
|
-
const [locale, setLocale] =
|
|
649
|
-
const translations2 =
|
|
650
|
-
const t =
|
|
662
|
+
const [locale, setLocale] = React12.useState(detectLocale());
|
|
663
|
+
const translations2 = React12.useMemo(() => getTranslations(locale), [locale]);
|
|
664
|
+
const t = React12.useMemo(() => {
|
|
651
665
|
return (key, params) => {
|
|
652
666
|
const keys = key.split(".");
|
|
653
667
|
let value2 = translations2;
|
|
@@ -664,7 +678,7 @@ function I18nProvider({ children }) {
|
|
|
664
678
|
return typeof value2 === "string" ? interpolate(value2, params) : key;
|
|
665
679
|
};
|
|
666
680
|
}, [translations2]);
|
|
667
|
-
const value =
|
|
681
|
+
const value = React12.useMemo(
|
|
668
682
|
() => ({
|
|
669
683
|
locale,
|
|
670
684
|
translations: translations2,
|
|
@@ -676,9 +690,9 @@ function I18nProvider({ children }) {
|
|
|
676
690
|
return /* @__PURE__ */ jsxRuntime.jsx(I18nContext.Provider, { value, children });
|
|
677
691
|
}
|
|
678
692
|
var useTranslation = useI18n;
|
|
679
|
-
var VolrModalContext =
|
|
693
|
+
var VolrModalContext = React12.createContext(null);
|
|
680
694
|
var useVolrModal = () => {
|
|
681
|
-
const context =
|
|
695
|
+
const context = React12.useContext(VolrModalContext);
|
|
682
696
|
if (!context) {
|
|
683
697
|
throw new Error("useVolrModal must be used within VolrUIProvider");
|
|
684
698
|
}
|
|
@@ -687,17 +701,17 @@ var useVolrModal = () => {
|
|
|
687
701
|
var VolrModalProvider = ({
|
|
688
702
|
children
|
|
689
703
|
}) => {
|
|
690
|
-
const [isOpen, setIsOpen] =
|
|
691
|
-
const [mode, setMode] =
|
|
692
|
-
const [asset, setAsset] =
|
|
693
|
-
const [paymentOptions, setPaymentOptions] =
|
|
694
|
-
const open =
|
|
704
|
+
const [isOpen, setIsOpen] = React12.useState(false);
|
|
705
|
+
const [mode, setMode] = React12.useState("account");
|
|
706
|
+
const [asset, setAsset] = React12.useState(null);
|
|
707
|
+
const [paymentOptions, setPaymentOptions] = React12.useState(null);
|
|
708
|
+
const open = React12.useCallback((options) => {
|
|
695
709
|
setMode(options?.mode ?? "account");
|
|
696
710
|
setAsset(options?.asset ?? null);
|
|
697
711
|
setPaymentOptions(options?.payment ?? null);
|
|
698
712
|
setIsOpen(true);
|
|
699
713
|
}, []);
|
|
700
|
-
const close =
|
|
714
|
+
const close = React12.useCallback(() => {
|
|
701
715
|
setIsOpen(false);
|
|
702
716
|
setAsset(null);
|
|
703
717
|
setPaymentOptions(null);
|
|
@@ -711,11 +725,11 @@ function cn(...inputs) {
|
|
|
711
725
|
return twMerge(clsx.clsx(inputs));
|
|
712
726
|
}
|
|
713
727
|
function useMediaQuery(query) {
|
|
714
|
-
const [matches, setMatches] =
|
|
728
|
+
const [matches, setMatches] = React12.useState(() => {
|
|
715
729
|
if (typeof window === "undefined") return false;
|
|
716
730
|
return window.matchMedia(query).matches;
|
|
717
731
|
});
|
|
718
|
-
|
|
732
|
+
React12.useEffect(() => {
|
|
719
733
|
if (typeof window === "undefined") return;
|
|
720
734
|
const mql = window.matchMedia(query);
|
|
721
735
|
const handler = (event) => setMatches(event.matches);
|
|
@@ -727,14 +741,14 @@ function useMediaQuery(query) {
|
|
|
727
741
|
}
|
|
728
742
|
|
|
729
743
|
// src/generated/volr-sdk-css.ts
|
|
730
|
-
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-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-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-green-50:oklch(98.2% .018 155.826);--volr-color-green-600:oklch(62.7% .194 149.214);--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-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-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-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-4{right:calc(var(--volr-spacing)*-4)}.volr\\:right-2{right:calc(var(--volr-spacing)*2)}.volr\\:bottom-0{bottom:calc(var(--volr-spacing)*0)}.volr\\:-left-4{left:calc(var(--volr-spacing)*-4)}.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\\: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-36{max-height:calc(var(--volr-spacing)*36)}.volr\\:max-h-96{max-height:calc(var(--volr-spacing)*96)}.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-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\\:animate-\\[volrFadeIn_0\\.2s_ease-out\\]{animation:.2s ease-out volrFadeIn}.volr\\:animate-pulse{animation:var(--volr-animate-pulse)}.volr\\:animate-spin{animation:var(--volr-animate-spin)}.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-hidden{overflow:hidden}.volr\\:overflow-visible{overflow:visible}.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-t{border-top-style:var(--volr-tw-border-style);border-top-width:1px}.volr\\:border-t-2{border-top-style:var(--volr-tw-border-style);border-top-width:2px}.volr\\:border-red-200{border-color:var(--volr-color-red-200)}.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-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-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-red-50{background-color:var(--volr-color-red-50)}.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-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\\: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\\: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-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\\.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\\:pb-2{padding-bottom:calc(var(--volr-spacing)*2)}.volr\\:pb-4{padding-bottom:calc(var(--volr-spacing)*4)}.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\\:break-all{word-break:break-all}.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-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-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-900{color:var(--volr-color-slate-900)}.volr\\:text-white{color:var(--volr-color-white)}.volr\\:capitalize{text-transform:capitalize}.volr\\:underline{text-decoration-line:underline}.volr\\:opacity-0{opacity:0}.volr\\:opacity-25{opacity:.25}.volr\\:opacity-30{opacity:.3}.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-\\[0_-8px_30px_rgba\\(0\\,0\\,0\\,0\\.2\\)\\]{--volr-tw-shadow:0 -8px 30px var(--volr-tw-shadow-color,#0003);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\\: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\\:bg-slate-50:hover{background-color:var(--volr-color-slate-50)}}.volr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.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-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}}';
|
|
744
|
+
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-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-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-orange-600:oklch(64.6% .222 41.116);--volr-color-green-50:oklch(98.2% .018 155.826);--volr-color-green-600:oklch(62.7% .194 149.214);--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-600:oklch(54.6% .245 262.881);--volr-color-purple-600:oklch(55.8% .288 302.321);--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-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-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-4{right:calc(var(--volr-spacing)*-4)}.volr\\:right-2{right:calc(var(--volr-spacing)*2)}.volr\\:bottom-0{bottom:calc(var(--volr-spacing)*0)}.volr\\:-left-4{left:calc(var(--volr-spacing)*-4)}.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\\: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-36{max-height:calc(var(--volr-spacing)*36)}.volr\\:max-h-60{max-height:calc(var(--volr-spacing)*60)}.volr\\:max-h-96{max-height:calc(var(--volr-spacing)*96)}.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-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-180{rotate:180deg}.volr\\:animate-\\[volrFadeIn_0\\.2s_ease-out\\]{animation:.2s ease-out volrFadeIn}.volr\\:animate-pulse{animation:var(--volr-animate-pulse)}.volr\\:animate-spin{animation:var(--volr-animate-spin)}.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\\:flex-wrap{flex-wrap:wrap}.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-hidden{overflow:hidden}.volr\\:overflow-visible{overflow:visible}.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-t{border-top-style:var(--volr-tw-border-style);border-top-width:1px}.volr\\:border-t-2{border-top-style:var(--volr-tw-border-style);border-top-width:2px}.volr\\:border-red-200{border-color:var(--volr-color-red-200)}.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-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-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-red-50{background-color:var(--volr-color-red-50)}.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-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\\: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\\: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-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\\:pb-2{padding-bottom:calc(var(--volr-spacing)*2)}.volr\\:pb-4{padding-bottom:calc(var(--volr-spacing)*4)}.volr\\:pl-4{padding-left:calc(var(--volr-spacing)*4)}.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\\:break-all{word-break:break-all}.volr\\:text-blue-600{color:var(--volr-color-blue-600)}.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-orange-600{color:var(--volr-color-orange-600)}.volr\\:text-purple-600{color:var(--volr-color-purple-600)}.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-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-900{color:var(--volr-color-slate-900)}.volr\\:text-white{color:var(--volr-color-white)}.volr\\:capitalize{text-transform:capitalize}.volr\\:underline{text-decoration-line:underline}.volr\\:opacity-0{opacity:0}.volr\\:opacity-25{opacity:.25}.volr\\:opacity-30{opacity:.3}.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-\\[0_-8px_30px_rgba\\(0\\,0\\,0\\,0\\.2\\)\\]{--volr-tw-shadow:0 -8px 30px var(--volr-tw-shadow-color,#0003);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\\:bg-slate-50:hover{background-color:var(--volr-color-slate-50)}}.volr\\:disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.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-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}}';
|
|
731
745
|
function useResolvedTheme(theme = "light") {
|
|
732
|
-
const [resolvedTheme, setResolvedTheme] =
|
|
746
|
+
const [resolvedTheme, setResolvedTheme] = React12.useState(() => {
|
|
733
747
|
if (theme !== "system") return theme;
|
|
734
748
|
if (typeof window === "undefined") return "light";
|
|
735
749
|
return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
|
|
736
750
|
});
|
|
737
|
-
|
|
751
|
+
React12.useEffect(() => {
|
|
738
752
|
if (theme !== "system") {
|
|
739
753
|
setResolvedTheme(theme);
|
|
740
754
|
return;
|
|
@@ -750,10 +764,10 @@ function useResolvedTheme(theme = "light") {
|
|
|
750
764
|
return resolvedTheme;
|
|
751
765
|
}
|
|
752
766
|
function ShadowPortal({ children, theme = "light" }) {
|
|
753
|
-
const [mountNode, setMountNode] =
|
|
754
|
-
const hostRef =
|
|
767
|
+
const [mountNode, setMountNode] = React12.useState(null);
|
|
768
|
+
const hostRef = React12.useRef(null);
|
|
755
769
|
const resolvedTheme = useResolvedTheme(theme);
|
|
756
|
-
|
|
770
|
+
React12.useEffect(() => {
|
|
757
771
|
const host = document.createElement("div");
|
|
758
772
|
host.id = "volr-shadow-portal";
|
|
759
773
|
host.style.position = "fixed";
|
|
@@ -777,7 +791,7 @@ function ShadowPortal({ children, theme = "light" }) {
|
|
|
777
791
|
hostRef.current = null;
|
|
778
792
|
};
|
|
779
793
|
}, []);
|
|
780
|
-
|
|
794
|
+
React12.useEffect(() => {
|
|
781
795
|
if (hostRef.current) {
|
|
782
796
|
hostRef.current.setAttribute("data-theme", resolvedTheme);
|
|
783
797
|
}
|
|
@@ -786,7 +800,7 @@ function ShadowPortal({ children, theme = "light" }) {
|
|
|
786
800
|
return reactDom.createPortal(children, mountNode);
|
|
787
801
|
}
|
|
788
802
|
function useFocusTrap(isActive, containerRef) {
|
|
789
|
-
const previousActiveElement =
|
|
803
|
+
const previousActiveElement = React12.useRef(null);
|
|
790
804
|
const focusableSelector = [
|
|
791
805
|
"button:not([disabled])",
|
|
792
806
|
"input:not([disabled])",
|
|
@@ -795,7 +809,7 @@ function useFocusTrap(isActive, containerRef) {
|
|
|
795
809
|
"a[href]",
|
|
796
810
|
'[tabindex]:not([tabindex="-1"])'
|
|
797
811
|
].join(", ");
|
|
798
|
-
const getFocusableElements =
|
|
812
|
+
const getFocusableElements = React12.useCallback(() => {
|
|
799
813
|
if (!containerRef.current) return [];
|
|
800
814
|
return Array.from(
|
|
801
815
|
containerRef.current.querySelectorAll(focusableSelector)
|
|
@@ -803,7 +817,7 @@ function useFocusTrap(isActive, containerRef) {
|
|
|
803
817
|
return el.offsetParent !== null;
|
|
804
818
|
});
|
|
805
819
|
}, [containerRef, focusableSelector]);
|
|
806
|
-
const handleKeyDown =
|
|
820
|
+
const handleKeyDown = React12.useCallback(
|
|
807
821
|
(event) => {
|
|
808
822
|
if (event.key !== "Tab") return;
|
|
809
823
|
const focusableElements = getFocusableElements();
|
|
@@ -824,7 +838,7 @@ function useFocusTrap(isActive, containerRef) {
|
|
|
824
838
|
},
|
|
825
839
|
[getFocusableElements]
|
|
826
840
|
);
|
|
827
|
-
|
|
841
|
+
React12.useEffect(() => {
|
|
828
842
|
if (!isActive) return;
|
|
829
843
|
previousActiveElement.current = document.activeElement;
|
|
830
844
|
const focusableElements = getFocusableElements();
|
|
@@ -855,12 +869,12 @@ var Modal = ({
|
|
|
855
869
|
}) => {
|
|
856
870
|
const isMobile2 = useMediaQuery("(max-width: 500px)");
|
|
857
871
|
const variant = explicitVariant ?? (isMobile2 ? "bottom-sheet" : "centered");
|
|
858
|
-
const dialogRef =
|
|
859
|
-
const dialogId =
|
|
872
|
+
const dialogRef = React12.useRef(null);
|
|
873
|
+
const dialogId = React12.useId();
|
|
860
874
|
const uiContext = useVolrUIOptional();
|
|
861
875
|
const theme = uiContext?.theme ?? "light";
|
|
862
876
|
useFocusTrap(open, dialogRef);
|
|
863
|
-
|
|
877
|
+
React12.useEffect(() => {
|
|
864
878
|
const handleEscape = (e) => {
|
|
865
879
|
if (e.key === "Escape" && open) {
|
|
866
880
|
if (onEscapeKeyDown) {
|
|
@@ -1314,7 +1328,7 @@ var variantMap = {
|
|
|
1314
1328
|
ghost: { backgroundColor: "transparent", color: "var(--volr-text-secondary)", border: "none" },
|
|
1315
1329
|
outline: { backgroundColor: "transparent", color: "var(--volr-text-secondary)", border: "1px solid var(--volr-border)" }
|
|
1316
1330
|
};
|
|
1317
|
-
var Button =
|
|
1331
|
+
var Button = React12__default.default.forwardRef(
|
|
1318
1332
|
({ variant = "primary", size = "md", fullWidth, className, style, disabled, children, ...props }, ref) => {
|
|
1319
1333
|
const { accentColor } = useVolrUI();
|
|
1320
1334
|
const sizeStyle = sizeMap[size];
|
|
@@ -1422,12 +1436,12 @@ function PasskeyEnrollView({
|
|
|
1422
1436
|
isEnrolling,
|
|
1423
1437
|
error: enrollmentError
|
|
1424
1438
|
} = react.usePasskeyEnrollment();
|
|
1425
|
-
const [hasStarted, setHasStarted] =
|
|
1426
|
-
const [errorMessage, setErrorMessage] =
|
|
1427
|
-
const [isRefreshing, setIsRefreshing] =
|
|
1439
|
+
const [hasStarted, setHasStarted] = React12.useState(false);
|
|
1440
|
+
const [errorMessage, setErrorMessage] = React12.useState(null);
|
|
1441
|
+
const [isRefreshing, setIsRefreshing] = React12.useState(false);
|
|
1428
1442
|
const biometricType = getBiometricType();
|
|
1429
1443
|
const hasPasskey = user?.keyStorageType === "passkey";
|
|
1430
|
-
|
|
1444
|
+
React12.useEffect(() => {
|
|
1431
1445
|
console.log("[PasskeyEnrollView] User state:", {
|
|
1432
1446
|
user,
|
|
1433
1447
|
keyStorageType: user?.keyStorageType,
|
|
@@ -1435,7 +1449,7 @@ function PasskeyEnrollView({
|
|
|
1435
1449
|
hasPasskey
|
|
1436
1450
|
});
|
|
1437
1451
|
}, [user, hasPasskey]);
|
|
1438
|
-
|
|
1452
|
+
React12.useEffect(() => {
|
|
1439
1453
|
if (hasPasskey && !user?.evmAddress && !isRefreshing) {
|
|
1440
1454
|
const refreshUserData = async () => {
|
|
1441
1455
|
try {
|
|
@@ -1466,7 +1480,7 @@ function PasskeyEnrollView({
|
|
|
1466
1480
|
refreshUserData();
|
|
1467
1481
|
}
|
|
1468
1482
|
}, [hasPasskey, user?.evmAddress, isRefreshing, client, setUser, user]);
|
|
1469
|
-
|
|
1483
|
+
React12.useEffect(() => {
|
|
1470
1484
|
if (!user?.id) {
|
|
1471
1485
|
const error = new Error("User ID is required for passkey enrollment");
|
|
1472
1486
|
setErrorMessage(getUserFriendlyError(error, t));
|
|
@@ -1475,7 +1489,7 @@ function PasskeyEnrollView({
|
|
|
1475
1489
|
}
|
|
1476
1490
|
}
|
|
1477
1491
|
}, [user, onError, t]);
|
|
1478
|
-
|
|
1492
|
+
React12.useEffect(() => {
|
|
1479
1493
|
if (enrollmentError) {
|
|
1480
1494
|
const friendlyMessage = getUserFriendlyError(enrollmentError, t);
|
|
1481
1495
|
setErrorMessage(friendlyMessage);
|
|
@@ -1632,8 +1646,8 @@ function MpcConnectView({
|
|
|
1632
1646
|
isConnecting,
|
|
1633
1647
|
error: connectionError
|
|
1634
1648
|
} = react.useMpcConnection();
|
|
1635
|
-
const [errorMessage, setErrorMessage] =
|
|
1636
|
-
|
|
1649
|
+
const [errorMessage, setErrorMessage] = React12.useState(null);
|
|
1650
|
+
React12.useEffect(() => {
|
|
1637
1651
|
if (connectionError) {
|
|
1638
1652
|
setErrorMessage(connectionError.message);
|
|
1639
1653
|
if (onError) {
|
|
@@ -1641,7 +1655,7 @@ function MpcConnectView({
|
|
|
1641
1655
|
}
|
|
1642
1656
|
}
|
|
1643
1657
|
}, [connectionError, onError]);
|
|
1644
|
-
|
|
1658
|
+
React12.useEffect(() => {
|
|
1645
1659
|
handleConnect();
|
|
1646
1660
|
}, []);
|
|
1647
1661
|
const handleConnect = async () => {
|
|
@@ -1702,7 +1716,7 @@ function MpcConnectView({
|
|
|
1702
1716
|
);
|
|
1703
1717
|
}
|
|
1704
1718
|
var CopyButton = ({ text, className, onCopy }) => {
|
|
1705
|
-
const [copied, setCopied] =
|
|
1719
|
+
const [copied, setCopied] = React12.useState(false);
|
|
1706
1720
|
const handleCopy = async () => {
|
|
1707
1721
|
try {
|
|
1708
1722
|
await navigator.clipboard.writeText(text);
|
|
@@ -1900,9 +1914,9 @@ function PoweredBy() {
|
|
|
1900
1914
|
}
|
|
1901
1915
|
function EmailInlineInput({ onSubmit, accentColor }) {
|
|
1902
1916
|
const { t } = useI18n();
|
|
1903
|
-
const [email, setEmail] =
|
|
1904
|
-
const [error, setError] =
|
|
1905
|
-
const [isLoading, setIsLoading] =
|
|
1917
|
+
const [email, setEmail] = React12.useState("");
|
|
1918
|
+
const [error, setError] = React12.useState(null);
|
|
1919
|
+
const [isLoading, setIsLoading] = React12.useState(false);
|
|
1906
1920
|
const handleSubmit = async (e) => {
|
|
1907
1921
|
e.preventDefault();
|
|
1908
1922
|
setError(null);
|
|
@@ -2026,14 +2040,14 @@ function SigninSelectScreen({
|
|
|
2026
2040
|
function CodeInputScreen({ email, onSubmit, onResend }) {
|
|
2027
2041
|
const { t } = useI18n();
|
|
2028
2042
|
const { accentColor } = useVolrUI();
|
|
2029
|
-
const [digits, setDigits] =
|
|
2030
|
-
const [error, setError] =
|
|
2031
|
-
const [isLoading, setIsLoading] =
|
|
2032
|
-
const inputRefs =
|
|
2033
|
-
|
|
2043
|
+
const [digits, setDigits] = React12.useState(Array(6).fill(""));
|
|
2044
|
+
const [error, setError] = React12.useState(null);
|
|
2045
|
+
const [isLoading, setIsLoading] = React12.useState(false);
|
|
2046
|
+
const inputRefs = React12.useRef([]);
|
|
2047
|
+
React12.useEffect(() => {
|
|
2034
2048
|
inputRefs.current[0]?.focus();
|
|
2035
2049
|
}, []);
|
|
2036
|
-
|
|
2050
|
+
React12.useEffect(() => {
|
|
2037
2051
|
const code = digits.join("");
|
|
2038
2052
|
if (code.length === 6 && !isLoading) {
|
|
2039
2053
|
handleSubmit(code);
|
|
@@ -2196,23 +2210,23 @@ function SiweLoginScreen({
|
|
|
2196
2210
|
checkSiweSession,
|
|
2197
2211
|
getSiweSignUrl
|
|
2198
2212
|
} = react.useVolrLogin();
|
|
2199
|
-
const [isLoading, setIsLoading] =
|
|
2200
|
-
const [loadingWallet, setLoadingWallet] =
|
|
2201
|
-
const [error, setError] =
|
|
2202
|
-
const [providers, setProviders] =
|
|
2203
|
-
const [isDetecting, setIsDetecting] =
|
|
2204
|
-
const [hasLegacyWallet, setHasLegacyWallet] =
|
|
2205
|
-
const [showOtherWallet, setShowOtherWallet] =
|
|
2206
|
-
const [sessionUrl, setSessionUrl] =
|
|
2207
|
-
const [isPolling, setIsPolling] =
|
|
2208
|
-
const pollingRef =
|
|
2209
|
-
const sessionCreatedRef =
|
|
2210
|
-
|
|
2213
|
+
const [isLoading, setIsLoading] = React12.useState(false);
|
|
2214
|
+
const [loadingWallet, setLoadingWallet] = React12.useState(null);
|
|
2215
|
+
const [error, setError] = React12.useState(null);
|
|
2216
|
+
const [providers, setProviders] = React12.useState([]);
|
|
2217
|
+
const [isDetecting, setIsDetecting] = React12.useState(true);
|
|
2218
|
+
const [hasLegacyWallet, setHasLegacyWallet] = React12.useState(false);
|
|
2219
|
+
const [showOtherWallet, setShowOtherWallet] = React12.useState(false);
|
|
2220
|
+
const [sessionUrl, setSessionUrl] = React12.useState(null);
|
|
2221
|
+
const [isPolling, setIsPolling] = React12.useState(false);
|
|
2222
|
+
const pollingRef = React12.useRef(null);
|
|
2223
|
+
const sessionCreatedRef = React12.useRef(false);
|
|
2224
|
+
React12.useEffect(() => {
|
|
2211
2225
|
return () => {
|
|
2212
2226
|
if (pollingRef.current) clearInterval(pollingRef.current);
|
|
2213
2227
|
};
|
|
2214
2228
|
}, []);
|
|
2215
|
-
|
|
2229
|
+
React12.useEffect(() => {
|
|
2216
2230
|
if (typeof window === "undefined") {
|
|
2217
2231
|
setIsDetecting(false);
|
|
2218
2232
|
return;
|
|
@@ -2238,7 +2252,7 @@ function SiweLoginScreen({
|
|
|
2238
2252
|
};
|
|
2239
2253
|
}, []);
|
|
2240
2254
|
const hasAnyWallet = providers.length > 0 || hasLegacyWallet;
|
|
2241
|
-
const createSession =
|
|
2255
|
+
const createSession = React12.useCallback(async () => {
|
|
2242
2256
|
if (sessionCreatedRef.current || sessionUrl) return;
|
|
2243
2257
|
sessionCreatedRef.current = true;
|
|
2244
2258
|
try {
|
|
@@ -2280,17 +2294,17 @@ function SiweLoginScreen({
|
|
|
2280
2294
|
onError(err instanceof Error ? err : new Error("Failed to create session"));
|
|
2281
2295
|
}
|
|
2282
2296
|
}, [createSiweSession, getSiweSignUrl, checkSiweSession, onSuccess, onError, t, sessionUrl]);
|
|
2283
|
-
|
|
2297
|
+
React12.useEffect(() => {
|
|
2284
2298
|
if (!isDetecting && !hasAnyWallet && !sessionUrl) {
|
|
2285
2299
|
createSession();
|
|
2286
2300
|
}
|
|
2287
2301
|
}, [isDetecting, hasAnyWallet, sessionUrl, createSession]);
|
|
2288
|
-
|
|
2302
|
+
React12.useEffect(() => {
|
|
2289
2303
|
if (showOtherWallet && !sessionUrl) {
|
|
2290
2304
|
createSession();
|
|
2291
2305
|
}
|
|
2292
2306
|
}, [showOtherWallet, sessionUrl, createSession]);
|
|
2293
|
-
const handleWalletClick =
|
|
2307
|
+
const handleWalletClick = React12.useCallback(async (provider, walletName, walletConnector) => {
|
|
2294
2308
|
setError(null);
|
|
2295
2309
|
setIsLoading(true);
|
|
2296
2310
|
setLoadingWallet(walletName);
|
|
@@ -2298,7 +2312,7 @@ function SiweLoginScreen({
|
|
|
2298
2312
|
const accounts = await provider.request({ method: "eth_requestAccounts" });
|
|
2299
2313
|
if (accounts.length === 0) throw new Error("No accounts found");
|
|
2300
2314
|
const walletAddress = accounts[0];
|
|
2301
|
-
const result = await signWithWallet(walletAddress);
|
|
2315
|
+
const result = await signWithWallet(walletAddress, { provider, walletConnector });
|
|
2302
2316
|
onSuccess({
|
|
2303
2317
|
userId: result.userId,
|
|
2304
2318
|
isNewUser: result.isNewUser,
|
|
@@ -2314,7 +2328,7 @@ function SiweLoginScreen({
|
|
|
2314
2328
|
setLoadingWallet(null);
|
|
2315
2329
|
}
|
|
2316
2330
|
}, [signWithWallet, onSuccess, onError]);
|
|
2317
|
-
const handleLegacyWalletClick =
|
|
2331
|
+
const handleLegacyWalletClick = React12.useCallback(async () => {
|
|
2318
2332
|
if (typeof window === "undefined" || !window.ethereum) return;
|
|
2319
2333
|
const ethereum = window.ethereum;
|
|
2320
2334
|
let walletName = "Wallet";
|
|
@@ -2323,7 +2337,7 @@ function SiweLoginScreen({
|
|
|
2323
2337
|
else if (ethereum.isRabby) walletName = "Rabby";
|
|
2324
2338
|
await handleWalletClick(ethereum, walletName);
|
|
2325
2339
|
}, [handleWalletClick]);
|
|
2326
|
-
const cancelOtherWallet =
|
|
2340
|
+
const cancelOtherWallet = React12.useCallback(() => {
|
|
2327
2341
|
if (pollingRef.current) {
|
|
2328
2342
|
clearInterval(pollingRef.current);
|
|
2329
2343
|
pollingRef.current = null;
|
|
@@ -2340,7 +2354,9 @@ function SiweLoginScreen({
|
|
|
2340
2354
|
id: p.info.uuid,
|
|
2341
2355
|
name: p.info.name,
|
|
2342
2356
|
icon: p.info.icon,
|
|
2343
|
-
provider: p.provider
|
|
2357
|
+
provider: p.provider,
|
|
2358
|
+
rdns: p.info.rdns
|
|
2359
|
+
// EIP-6963 rdns for accurate wallet identification
|
|
2344
2360
|
});
|
|
2345
2361
|
});
|
|
2346
2362
|
if (hasLegacyWallet && providers.length === 0) {
|
|
@@ -2361,7 +2377,7 @@ function SiweLoginScreen({
|
|
|
2361
2377
|
"button",
|
|
2362
2378
|
{
|
|
2363
2379
|
type: "button",
|
|
2364
|
-
onClick: () => wallet.isLegacy ? handleLegacyWalletClick() : handleWalletClick(wallet.provider, wallet.name),
|
|
2380
|
+
onClick: () => wallet.isLegacy ? handleLegacyWalletClick() : handleWalletClick(wallet.provider, wallet.name, wallet.rdns),
|
|
2365
2381
|
disabled: isLoading,
|
|
2366
2382
|
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 volr:disabled:cursor-not-allowed",
|
|
2367
2383
|
children: [
|
|
@@ -2467,13 +2483,13 @@ function SigninModal({ isOpen, onClose, onError }) {
|
|
|
2467
2483
|
const { logout, user } = react.useVolrContext();
|
|
2468
2484
|
const { appName, branding } = useVolrUI();
|
|
2469
2485
|
const { requestEmailCode, verifyEmailCode, handleSocialLogin } = react.useVolrLogin();
|
|
2470
|
-
const [currentScreen, setCurrentScreen] =
|
|
2471
|
-
const [email, setEmail] =
|
|
2486
|
+
const [currentScreen, setCurrentScreen] = React12.useState("method-select");
|
|
2487
|
+
const [email, setEmail] = React12.useState("");
|
|
2472
2488
|
const hasPasskey = user?.keyStorageType === "passkey";
|
|
2473
2489
|
const isMobile2 = useMediaQuery("(max-width: 500px)");
|
|
2474
2490
|
const isWideViewport = useMediaQuery("(min-width: 864px)");
|
|
2475
2491
|
const shouldUseWideLayout = !isMobile2 && isWideViewport && Boolean(branding) && currentScreen === "method-select";
|
|
2476
|
-
|
|
2492
|
+
React12.useEffect(() => {
|
|
2477
2493
|
if (!isOpen) {
|
|
2478
2494
|
setCurrentScreen("method-select");
|
|
2479
2495
|
setEmail("");
|
|
@@ -2634,7 +2650,7 @@ function SigninModal({ isOpen, onClose, onError }) {
|
|
|
2634
2650
|
function AccountModal({ isOpen, onClose, onError }) {
|
|
2635
2651
|
const { user, logout } = react.useVolrContext();
|
|
2636
2652
|
const { t } = useI18n();
|
|
2637
|
-
const [isLoggingOut, setIsLoggingOut] =
|
|
2653
|
+
const [isLoggingOut, setIsLoggingOut] = React12.useState(false);
|
|
2638
2654
|
if (!user) {
|
|
2639
2655
|
return /* @__PURE__ */ jsxRuntime.jsx(SigninModal, { isOpen, onClose, onError });
|
|
2640
2656
|
}
|
|
@@ -2768,7 +2784,7 @@ function AssetSelectView({
|
|
|
2768
2784
|
}) })
|
|
2769
2785
|
] });
|
|
2770
2786
|
}
|
|
2771
|
-
var TextLinkButton =
|
|
2787
|
+
var TextLinkButton = React12__default.default.forwardRef(({ showArrow = false, className, children, ...props }, ref) => {
|
|
2772
2788
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2773
2789
|
"button",
|
|
2774
2790
|
{
|
|
@@ -3027,7 +3043,7 @@ var DepositCompletedToast = ({
|
|
|
3027
3043
|
symbol
|
|
3028
3044
|
}) => {
|
|
3029
3045
|
const { t } = useI18n();
|
|
3030
|
-
const [expanded, setExpanded] =
|
|
3046
|
+
const [expanded, setExpanded] = React12.useState(false);
|
|
3031
3047
|
const formatAmount = (amount) => {
|
|
3032
3048
|
const divisor = BigInt(10 ** decimals);
|
|
3033
3049
|
const whole = amount / divisor;
|
|
@@ -3182,10 +3198,10 @@ function DepositQRView(props) {
|
|
|
3182
3198
|
const { t } = useI18n();
|
|
3183
3199
|
const { config } = react.useVolrContext();
|
|
3184
3200
|
const { client } = react.useInternalAuth();
|
|
3185
|
-
const [chainName, setChainName] =
|
|
3186
|
-
const [showOtherTokenModal, setShowOtherTokenModal] =
|
|
3187
|
-
const [showToast, setShowToast] =
|
|
3188
|
-
const [toastData, setToastData] =
|
|
3201
|
+
const [chainName, setChainName] = React12.useState(null);
|
|
3202
|
+
const [showOtherTokenModal, setShowOtherTokenModal] = React12.useState(false);
|
|
3203
|
+
const [showToast, setShowToast] = React12.useState(false);
|
|
3204
|
+
const [toastData, setToastData] = React12.useState(null);
|
|
3189
3205
|
const eip681 = `ethereum:${props.address}`;
|
|
3190
3206
|
const status = react.useDepositListener({
|
|
3191
3207
|
chainId: props.chainId,
|
|
@@ -3198,7 +3214,7 @@ function DepositQRView(props) {
|
|
|
3198
3214
|
},
|
|
3199
3215
|
address: props.address
|
|
3200
3216
|
});
|
|
3201
|
-
|
|
3217
|
+
React12.useEffect(() => {
|
|
3202
3218
|
if (status.state === "detected") {
|
|
3203
3219
|
setToastData({
|
|
3204
3220
|
previousBalance: status.previousBalance,
|
|
@@ -3208,11 +3224,11 @@ function DepositQRView(props) {
|
|
|
3208
3224
|
setShowToast(true);
|
|
3209
3225
|
}
|
|
3210
3226
|
}, [status]);
|
|
3211
|
-
const getNetworkInfo =
|
|
3227
|
+
const getNetworkInfo = React12.useCallback(
|
|
3212
3228
|
react.createGetNetworkInfo({ client, rpcOverrides: config.rpcOverrides }),
|
|
3213
3229
|
[client, config.rpcOverrides]
|
|
3214
3230
|
);
|
|
3215
|
-
|
|
3231
|
+
React12.useEffect(() => {
|
|
3216
3232
|
let cancelled = false;
|
|
3217
3233
|
const loadChainName = async () => {
|
|
3218
3234
|
try {
|
|
@@ -3379,11 +3395,11 @@ var DepositModal = ({
|
|
|
3379
3395
|
}) => {
|
|
3380
3396
|
const { user } = react.useVolrContext();
|
|
3381
3397
|
const { client } = react.useInternalAuth();
|
|
3382
|
-
const [depositAssets, setDepositAssets] =
|
|
3383
|
-
const [isLoading, setIsLoading] =
|
|
3384
|
-
const [error, setError] =
|
|
3385
|
-
const [selectedIdx, setSelectedIdx] =
|
|
3386
|
-
|
|
3398
|
+
const [depositAssets, setDepositAssets] = React12.useState([]);
|
|
3399
|
+
const [isLoading, setIsLoading] = React12.useState(true);
|
|
3400
|
+
const [error, setError] = React12.useState(null);
|
|
3401
|
+
const [selectedIdx, setSelectedIdx] = React12.useState(-1);
|
|
3402
|
+
React12.useEffect(() => {
|
|
3387
3403
|
if (!open) return;
|
|
3388
3404
|
setIsLoading(true);
|
|
3389
3405
|
setError(null);
|
|
@@ -3410,12 +3426,12 @@ var DepositModal = ({
|
|
|
3410
3426
|
if (depositAssets.length === 1) return 0;
|
|
3411
3427
|
return -1;
|
|
3412
3428
|
};
|
|
3413
|
-
|
|
3429
|
+
React12.useEffect(() => {
|
|
3414
3430
|
if (open && !isLoading && depositAssets.length > 0) {
|
|
3415
3431
|
setSelectedIdx(getInitialIndex());
|
|
3416
3432
|
}
|
|
3417
3433
|
}, [open, isLoading, depositAssets.length, asset]);
|
|
3418
|
-
|
|
3434
|
+
React12.useEffect(() => {
|
|
3419
3435
|
if (!open) {
|
|
3420
3436
|
setSelectedIdx(-1);
|
|
3421
3437
|
}
|
|
@@ -3537,8 +3553,8 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3537
3553
|
const { evm } = react.useVolr();
|
|
3538
3554
|
const { paymentOptions } = useVolrModal();
|
|
3539
3555
|
const { createPayment, updatePaymentToProcessing, pollPaymentStatus, failPendingPayment } = react.useVolrPaymentApi();
|
|
3540
|
-
const [state, dispatch] =
|
|
3541
|
-
const fetchBalance =
|
|
3556
|
+
const [state, dispatch] = React12.useReducer(paymentModalReducer, initialState);
|
|
3557
|
+
const fetchBalance = React12.useCallback(
|
|
3542
3558
|
async (tokenInfo) => {
|
|
3543
3559
|
if (!user?.evmAddress) {
|
|
3544
3560
|
dispatch({ type: "SET_BALANCE_LOADING", loading: false });
|
|
@@ -3573,14 +3589,14 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3573
3589
|
},
|
|
3574
3590
|
[user, evm]
|
|
3575
3591
|
);
|
|
3576
|
-
const fetchBranding =
|
|
3592
|
+
const fetchBranding = React12.useCallback(async () => {
|
|
3577
3593
|
try {
|
|
3578
3594
|
const response = await client.get("/auth/branding");
|
|
3579
3595
|
dispatch({ type: "SET_LOGO_URL", logoUrl: response.logoUrl });
|
|
3580
3596
|
} catch {
|
|
3581
3597
|
}
|
|
3582
3598
|
}, [client]);
|
|
3583
|
-
const fetchPaymentConfig =
|
|
3599
|
+
const fetchPaymentConfig = React12.useCallback(async () => {
|
|
3584
3600
|
dispatch({ type: "SET_CONFIG_LOADING", loading: true });
|
|
3585
3601
|
try {
|
|
3586
3602
|
const response = await client.get("/payments/config");
|
|
@@ -3596,7 +3612,7 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3596
3612
|
dispatch({ type: "SET_CONFIG_LOADING", loading: false });
|
|
3597
3613
|
}
|
|
3598
3614
|
}, [client, fetchBalance]);
|
|
3599
|
-
|
|
3615
|
+
React12.useEffect(() => {
|
|
3600
3616
|
if (open && paymentOptions?.options) {
|
|
3601
3617
|
if (state.step === "processing" || state.step === "result") {
|
|
3602
3618
|
return;
|
|
@@ -3608,7 +3624,7 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3608
3624
|
dispatch({ type: "RESET" });
|
|
3609
3625
|
}
|
|
3610
3626
|
}, [open, paymentOptions?.options?.amount]);
|
|
3611
|
-
const handlePay =
|
|
3627
|
+
const handlePay = React12.useCallback(async () => {
|
|
3612
3628
|
const { payOptions, receiverAddress, tokenInfo } = state;
|
|
3613
3629
|
if (!payOptions || !user?.evmAddress || !paymentOptions || !receiverAddress || !tokenInfo) {
|
|
3614
3630
|
return;
|
|
@@ -3688,10 +3704,10 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3688
3704
|
pollPaymentStatus,
|
|
3689
3705
|
failPendingPayment
|
|
3690
3706
|
]);
|
|
3691
|
-
const handleDeposit =
|
|
3707
|
+
const handleDeposit = React12.useCallback(() => {
|
|
3692
3708
|
dispatch({ type: "SHOW_DEPOSIT" });
|
|
3693
3709
|
}, []);
|
|
3694
|
-
const handleDepositClose =
|
|
3710
|
+
const handleDepositClose = React12.useCallback(
|
|
3695
3711
|
(depositOpen) => {
|
|
3696
3712
|
if (!depositOpen) {
|
|
3697
3713
|
dispatch({ type: "HIDE_DEPOSIT" });
|
|
@@ -3702,19 +3718,19 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3702
3718
|
},
|
|
3703
3719
|
[state.tokenInfo, fetchBalance]
|
|
3704
3720
|
);
|
|
3705
|
-
const handleDone =
|
|
3721
|
+
const handleDone = React12.useCallback(() => {
|
|
3706
3722
|
if (state.createdPayment?.status === "CONFIRMED") {
|
|
3707
3723
|
paymentOptions?.onComplete?.(state.createdPayment);
|
|
3708
3724
|
}
|
|
3709
3725
|
onOpenChange(false);
|
|
3710
3726
|
}, [state.createdPayment, paymentOptions, onOpenChange]);
|
|
3711
|
-
const handleRetry =
|
|
3727
|
+
const handleRetry = React12.useCallback(() => {
|
|
3712
3728
|
dispatch({ type: "RETRY" });
|
|
3713
3729
|
if (state.tokenInfo) {
|
|
3714
3730
|
fetchBalance(state.tokenInfo);
|
|
3715
3731
|
}
|
|
3716
3732
|
}, [state.tokenInfo, fetchBalance]);
|
|
3717
|
-
const handleClose =
|
|
3733
|
+
const handleClose = React12.useCallback(() => {
|
|
3718
3734
|
if (state.step === "processing") {
|
|
3719
3735
|
return;
|
|
3720
3736
|
}
|
|
@@ -3723,7 +3739,7 @@ function usePaymentModalState(open, onOpenChange) {
|
|
|
3723
3739
|
}
|
|
3724
3740
|
onOpenChange(false);
|
|
3725
3741
|
}, [state.step, paymentOptions, onOpenChange]);
|
|
3726
|
-
const handleReport =
|
|
3742
|
+
const handleReport = React12.useCallback(async () => {
|
|
3727
3743
|
const { createdPayment, error, step, txHash, tokenInfo } = state;
|
|
3728
3744
|
if (!createdPayment || !error) return;
|
|
3729
3745
|
try {
|
|
@@ -4213,16 +4229,273 @@ var PaymentModal = ({
|
|
|
4213
4229
|
)
|
|
4214
4230
|
] });
|
|
4215
4231
|
};
|
|
4216
|
-
var
|
|
4232
|
+
var SignRequestContext = React12.createContext(null);
|
|
4233
|
+
function SignRequestProvider({ children }) {
|
|
4234
|
+
const [pendingRequest, setPendingRequest] = React12.useState(null);
|
|
4235
|
+
const resolveRef = React12.useRef(null);
|
|
4236
|
+
const rejectRef = React12.useRef(null);
|
|
4237
|
+
const requestSign = React12.useCallback((request) => {
|
|
4238
|
+
return new Promise((resolve, reject2) => {
|
|
4239
|
+
setPendingRequest(request);
|
|
4240
|
+
resolveRef.current = resolve;
|
|
4241
|
+
rejectRef.current = reject2;
|
|
4242
|
+
});
|
|
4243
|
+
}, []);
|
|
4244
|
+
const approve = React12.useCallback(() => {
|
|
4245
|
+
if (resolveRef.current) {
|
|
4246
|
+
resolveRef.current();
|
|
4247
|
+
resolveRef.current = null;
|
|
4248
|
+
rejectRef.current = null;
|
|
4249
|
+
}
|
|
4250
|
+
setPendingRequest(null);
|
|
4251
|
+
}, []);
|
|
4252
|
+
const reject = React12.useCallback(() => {
|
|
4253
|
+
if (rejectRef.current) {
|
|
4254
|
+
rejectRef.current(new Error("Sign request cancelled by user"));
|
|
4255
|
+
resolveRef.current = null;
|
|
4256
|
+
rejectRef.current = null;
|
|
4257
|
+
}
|
|
4258
|
+
setPendingRequest(null);
|
|
4259
|
+
}, []);
|
|
4260
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4261
|
+
SignRequestContext.Provider,
|
|
4262
|
+
{
|
|
4263
|
+
value: {
|
|
4264
|
+
requestSign,
|
|
4265
|
+
pendingRequest,
|
|
4266
|
+
approve,
|
|
4267
|
+
reject
|
|
4268
|
+
},
|
|
4269
|
+
children
|
|
4270
|
+
}
|
|
4271
|
+
);
|
|
4272
|
+
}
|
|
4273
|
+
function useSignRequest() {
|
|
4274
|
+
const context = React12.useContext(SignRequestContext);
|
|
4275
|
+
if (!context) {
|
|
4276
|
+
throw new Error("useSignRequest must be used within SignRequestProvider");
|
|
4277
|
+
}
|
|
4278
|
+
return {
|
|
4279
|
+
requestSign: context.requestSign
|
|
4280
|
+
};
|
|
4281
|
+
}
|
|
4282
|
+
function useSignRequestInternal() {
|
|
4283
|
+
const context = React12.useContext(SignRequestContext);
|
|
4284
|
+
if (!context) {
|
|
4285
|
+
throw new Error("useSignRequestInternal must be used within SignRequestProvider");
|
|
4286
|
+
}
|
|
4287
|
+
return context;
|
|
4288
|
+
}
|
|
4289
|
+
function toHexString(bytes) {
|
|
4290
|
+
return "0x" + Array.from(bytes).map((b) => b.toString(16).padStart(2, "0")).join("");
|
|
4291
|
+
}
|
|
4292
|
+
function MessageSignView({ message }) {
|
|
4293
|
+
const isBytes = message instanceof Uint8Array;
|
|
4294
|
+
const displayValue = isBytes ? toHexString(message) : message;
|
|
4295
|
+
const isHex = isBytes || typeof message === "string" && message.startsWith("0x");
|
|
4296
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-3", children: [
|
|
4297
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-sm volr:font-medium volr-text-secondary", children: "Message" }),
|
|
4298
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4299
|
+
"div",
|
|
4300
|
+
{
|
|
4301
|
+
className: "volr:p-4 volr:rounded-xl volr:max-h-60 volr:overflow-y-auto volr-bg-tertiary",
|
|
4302
|
+
style: {
|
|
4303
|
+
fontFamily: isHex ? 'ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace' : "inherit",
|
|
4304
|
+
fontSize: isHex ? "0.8125rem" : "0.875rem",
|
|
4305
|
+
wordBreak: "break-all",
|
|
4306
|
+
lineHeight: "1.5"
|
|
4307
|
+
},
|
|
4308
|
+
children: displayValue
|
|
4309
|
+
}
|
|
4310
|
+
),
|
|
4311
|
+
isBytes && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-xs volr-text-secondary", children: [
|
|
4312
|
+
message.length,
|
|
4313
|
+
" bytes (shown as hex)"
|
|
4314
|
+
] })
|
|
4315
|
+
] });
|
|
4316
|
+
}
|
|
4317
|
+
function CollapsibleSection({
|
|
4318
|
+
title,
|
|
4319
|
+
children,
|
|
4320
|
+
defaultExpanded = false
|
|
4321
|
+
}) {
|
|
4322
|
+
const [isExpanded, setIsExpanded] = React12.useState(defaultExpanded);
|
|
4323
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:border volr:rounded-xl volr:overflow-hidden volr-border-strong", children: [
|
|
4324
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
4325
|
+
"button",
|
|
4326
|
+
{
|
|
4327
|
+
type: "button",
|
|
4328
|
+
onClick: () => setIsExpanded(!isExpanded),
|
|
4329
|
+
className: "volr:w-full volr:px-4 volr:py-3 volr:flex volr:items-center volr:justify-between volr-bg-tertiary volr:transition-colors hover:volr-bg-secondary",
|
|
4330
|
+
children: [
|
|
4331
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:font-medium volr-text", children: title }),
|
|
4332
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4333
|
+
"svg",
|
|
4334
|
+
{
|
|
4335
|
+
className: `volr:w-4 volr:h-4 volr:transition-transform volr-text-secondary ${isExpanded ? "volr:rotate-180" : ""}`,
|
|
4336
|
+
fill: "none",
|
|
4337
|
+
viewBox: "0 0 24 24",
|
|
4338
|
+
stroke: "currentColor",
|
|
4339
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" })
|
|
4340
|
+
}
|
|
4341
|
+
)
|
|
4342
|
+
]
|
|
4343
|
+
}
|
|
4344
|
+
),
|
|
4345
|
+
isExpanded && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:px-4 volr:py-3 volr:border-t volr-border-strong", children })
|
|
4346
|
+
] });
|
|
4347
|
+
}
|
|
4348
|
+
function renderValue(value, depth = 0) {
|
|
4349
|
+
if (value === null || value === void 0) {
|
|
4350
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr-text-secondary", children: "null" });
|
|
4351
|
+
}
|
|
4352
|
+
if (typeof value === "boolean") {
|
|
4353
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-blue-600", children: String(value) });
|
|
4354
|
+
}
|
|
4355
|
+
if (typeof value === "number" || typeof value === "bigint") {
|
|
4356
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-green-600", children: String(value) });
|
|
4357
|
+
}
|
|
4358
|
+
if (typeof value === "string") {
|
|
4359
|
+
if (value.startsWith("0x") && value.length === 42) {
|
|
4360
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4361
|
+
"span",
|
|
4362
|
+
{
|
|
4363
|
+
className: "volr:text-purple-600",
|
|
4364
|
+
style: { fontFamily: "ui-monospace, monospace", fontSize: "0.8125rem" },
|
|
4365
|
+
children: value
|
|
4366
|
+
}
|
|
4367
|
+
);
|
|
4368
|
+
}
|
|
4369
|
+
if (value.startsWith("0x")) {
|
|
4370
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4371
|
+
"span",
|
|
4372
|
+
{
|
|
4373
|
+
className: "volr:text-orange-600",
|
|
4374
|
+
style: { fontFamily: "ui-monospace, monospace", fontSize: "0.8125rem", wordBreak: "break-all" },
|
|
4375
|
+
children: value
|
|
4376
|
+
}
|
|
4377
|
+
);
|
|
4378
|
+
}
|
|
4379
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr-text", children: value });
|
|
4380
|
+
}
|
|
4381
|
+
if (Array.isArray(value)) {
|
|
4382
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:pl-4", children: value.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:gap-2", children: [
|
|
4383
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr-text-secondary", children: [
|
|
4384
|
+
"[",
|
|
4385
|
+
index,
|
|
4386
|
+
"]:"
|
|
4387
|
+
] }),
|
|
4388
|
+
renderValue(item, depth + 1)
|
|
4389
|
+
] }, index)) });
|
|
4390
|
+
}
|
|
4391
|
+
if (typeof value === "object") {
|
|
4392
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: depth > 0 ? "volr:pl-4" : "", children: Object.entries(value).map(([key, val]) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:py-1", children: [
|
|
4393
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-medium volr-text-secondary", children: [
|
|
4394
|
+
key,
|
|
4395
|
+
":"
|
|
4396
|
+
] }),
|
|
4397
|
+
" ",
|
|
4398
|
+
renderValue(val, depth + 1)
|
|
4399
|
+
] }, key)) });
|
|
4400
|
+
}
|
|
4401
|
+
return String(value);
|
|
4402
|
+
}
|
|
4403
|
+
function TypedDataSignView({ typedData }) {
|
|
4404
|
+
const { domain, message } = typedData;
|
|
4405
|
+
const domainInfo = {
|
|
4406
|
+
...domain.name && { Name: domain.name },
|
|
4407
|
+
...domain.version && { Version: domain.version },
|
|
4408
|
+
...domain.chainId !== void 0 && { "Chain ID": domain.chainId },
|
|
4409
|
+
...domain.verifyingContract && { Contract: domain.verifyingContract }
|
|
4410
|
+
};
|
|
4411
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-3", children: [
|
|
4412
|
+
/* @__PURE__ */ jsxRuntime.jsx(CollapsibleSection, { title: "Domain", defaultExpanded: false, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-sm volr:space-y-2", children: Object.entries(domainInfo).map(([key, value]) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:gap-2 volr:flex-wrap", children: [
|
|
4413
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-medium volr-text-secondary", children: [
|
|
4414
|
+
key,
|
|
4415
|
+
":"
|
|
4416
|
+
] }),
|
|
4417
|
+
renderValue(value)
|
|
4418
|
+
] }, key)) }) }),
|
|
4419
|
+
/* @__PURE__ */ jsxRuntime.jsx(CollapsibleSection, { title: "Message", defaultExpanded: true, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-sm", children: renderValue(message) }) })
|
|
4420
|
+
] });
|
|
4421
|
+
}
|
|
4422
|
+
function SignRequestModal({ open, onOpenChange }) {
|
|
4423
|
+
const { pendingRequest, approve, reject } = useSignRequestInternal();
|
|
4424
|
+
const { t } = useI18n();
|
|
4425
|
+
const handleCancel = () => {
|
|
4426
|
+
reject();
|
|
4427
|
+
onOpenChange(false);
|
|
4428
|
+
};
|
|
4429
|
+
const handleSign = () => {
|
|
4430
|
+
approve();
|
|
4431
|
+
onOpenChange(false);
|
|
4432
|
+
};
|
|
4433
|
+
if (!pendingRequest) {
|
|
4434
|
+
return null;
|
|
4435
|
+
}
|
|
4436
|
+
const isMessage = pendingRequest.type === "message";
|
|
4437
|
+
const isTypedData = pendingRequest.type === "typedData";
|
|
4438
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4439
|
+
Modal,
|
|
4440
|
+
{
|
|
4441
|
+
open,
|
|
4442
|
+
onOpenChange: (newOpen) => {
|
|
4443
|
+
if (!newOpen) {
|
|
4444
|
+
handleCancel();
|
|
4445
|
+
}
|
|
4446
|
+
},
|
|
4447
|
+
onPointerDownOutside: (e) => e.preventDefault(),
|
|
4448
|
+
onEscapeKeyDown: (e) => {
|
|
4449
|
+
e.preventDefault();
|
|
4450
|
+
handleCancel();
|
|
4451
|
+
},
|
|
4452
|
+
ariaLabel: t("sign.title"),
|
|
4453
|
+
children: [
|
|
4454
|
+
/* @__PURE__ */ jsxRuntime.jsx(ModalHeader, { title: t("sign.title"), onClose: handleCancel }),
|
|
4455
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-4", children: [
|
|
4456
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr-text-secondary", children: t("sign.description") }),
|
|
4457
|
+
isMessage && /* @__PURE__ */ jsxRuntime.jsx(MessageSignView, { message: pendingRequest.message }),
|
|
4458
|
+
isTypedData && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4459
|
+
TypedDataSignView,
|
|
4460
|
+
{
|
|
4461
|
+
typedData: pendingRequest.typedData
|
|
4462
|
+
}
|
|
4463
|
+
),
|
|
4464
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:gap-3 volr:pt-2", children: [
|
|
4465
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4466
|
+
Button,
|
|
4467
|
+
{
|
|
4468
|
+
variant: "secondary",
|
|
4469
|
+
onClick: handleCancel,
|
|
4470
|
+
fullWidth: true,
|
|
4471
|
+
children: t("common.cancel")
|
|
4472
|
+
}
|
|
4473
|
+
),
|
|
4474
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4475
|
+
Button,
|
|
4476
|
+
{
|
|
4477
|
+
variant: "primary",
|
|
4478
|
+
onClick: handleSign,
|
|
4479
|
+
fullWidth: true,
|
|
4480
|
+
children: t("sign.confirm")
|
|
4481
|
+
}
|
|
4482
|
+
)
|
|
4483
|
+
] })
|
|
4484
|
+
] })
|
|
4485
|
+
]
|
|
4486
|
+
}
|
|
4487
|
+
);
|
|
4488
|
+
}
|
|
4489
|
+
var VolrUIContext = React12__default.default.createContext(null);
|
|
4217
4490
|
var useVolrUI = () => {
|
|
4218
|
-
const context =
|
|
4491
|
+
const context = React12.useContext(VolrUIContext);
|
|
4219
4492
|
if (!context) {
|
|
4220
4493
|
throw new Error("useVolrUI must be used within VolrUIProvider");
|
|
4221
4494
|
}
|
|
4222
4495
|
return context;
|
|
4223
4496
|
};
|
|
4224
4497
|
var useVolrUIOptional = () => {
|
|
4225
|
-
return
|
|
4498
|
+
return React12.useContext(VolrUIContext);
|
|
4226
4499
|
};
|
|
4227
4500
|
function OnboardingFlow({
|
|
4228
4501
|
keyStorageType,
|
|
@@ -4278,11 +4551,10 @@ var VolrUIProvider = ({
|
|
|
4278
4551
|
const providerPolicy = config.providerPolicy ?? {
|
|
4279
4552
|
enforceOnFirstLogin: true
|
|
4280
4553
|
};
|
|
4281
|
-
const [
|
|
4282
|
-
const [keyStorageTypeError, setKeyStorageTypeError] = React10.useState(
|
|
4554
|
+
const [keyStorageTypeError, setKeyStorageTypeError] = React12.useState(
|
|
4283
4555
|
null
|
|
4284
4556
|
);
|
|
4285
|
-
|
|
4557
|
+
React12.useEffect(() => {
|
|
4286
4558
|
if (providerPolicy.enforceOnFirstLogin !== false && !keyStorageType) {
|
|
4287
4559
|
const errorMessage = "keyStorageType must be specified in VolrUIProvider props. Please set keyStorageType prop in VolrUIProvider.";
|
|
4288
4560
|
console.error(errorMessage);
|
|
@@ -4298,7 +4570,41 @@ var VolrUIProvider = ({
|
|
|
4298
4570
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-sm volr:mb-6 volr:leading-relaxed volr-text-secondary", children: keyStorageTypeError })
|
|
4299
4571
|
] }) });
|
|
4300
4572
|
}
|
|
4301
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4573
|
+
return /* @__PURE__ */ jsxRuntime.jsx(SignRequestProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4574
|
+
VolrUIProviderInner,
|
|
4575
|
+
{
|
|
4576
|
+
config,
|
|
4577
|
+
accentColor,
|
|
4578
|
+
appName,
|
|
4579
|
+
theme,
|
|
4580
|
+
enabledLoginMethods,
|
|
4581
|
+
socialProviders,
|
|
4582
|
+
branding,
|
|
4583
|
+
keyStorageType,
|
|
4584
|
+
providerPolicy,
|
|
4585
|
+
children
|
|
4586
|
+
}
|
|
4587
|
+
) });
|
|
4588
|
+
};
|
|
4589
|
+
function VolrUIProviderInner({
|
|
4590
|
+
config,
|
|
4591
|
+
accentColor,
|
|
4592
|
+
appName,
|
|
4593
|
+
theme,
|
|
4594
|
+
enabledLoginMethods,
|
|
4595
|
+
socialProviders,
|
|
4596
|
+
branding,
|
|
4597
|
+
keyStorageType,
|
|
4598
|
+
providerPolicy,
|
|
4599
|
+
children
|
|
4600
|
+
}) {
|
|
4601
|
+
const [showOnboarding, setShowOnboarding] = React12.useState(false);
|
|
4602
|
+
const { requestSign } = useSignRequest();
|
|
4603
|
+
const configWithSignRequest = {
|
|
4604
|
+
...config,
|
|
4605
|
+
onSignRequest: requestSign
|
|
4606
|
+
};
|
|
4607
|
+
return /* @__PURE__ */ jsxRuntime.jsx(react.VolrProvider, { config: configWithSignRequest, children: /* @__PURE__ */ jsxRuntime.jsx(I18nProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4302
4608
|
VolrUIContext.Provider,
|
|
4303
4609
|
{
|
|
4304
4610
|
value: {
|
|
@@ -4329,6 +4635,7 @@ var VolrUIProvider = ({
|
|
|
4329
4635
|
/* @__PURE__ */ jsxRuntime.jsx(AccountModalPortal, {}),
|
|
4330
4636
|
/* @__PURE__ */ jsxRuntime.jsx(DepositModalPortal, {}),
|
|
4331
4637
|
/* @__PURE__ */ jsxRuntime.jsx(PaymentModalPortal, {}),
|
|
4638
|
+
/* @__PURE__ */ jsxRuntime.jsx(SignRequestModalPortal, {}),
|
|
4332
4639
|
showOnboarding && keyStorageType && /* @__PURE__ */ jsxRuntime.jsx(
|
|
4333
4640
|
Modal,
|
|
4334
4641
|
{
|
|
@@ -4351,12 +4658,12 @@ var VolrUIProvider = ({
|
|
|
4351
4658
|
] })
|
|
4352
4659
|
}
|
|
4353
4660
|
) }) });
|
|
4354
|
-
}
|
|
4661
|
+
}
|
|
4355
4662
|
function AccountModalPortal() {
|
|
4356
4663
|
const { isOpen, mode, close } = useVolrModal();
|
|
4357
|
-
const [portalRoot, setPortalRoot] =
|
|
4358
|
-
const [error, setError] =
|
|
4359
|
-
|
|
4664
|
+
const [portalRoot, setPortalRoot] = React12.useState(null);
|
|
4665
|
+
const [error, setError] = React12.useState(null);
|
|
4666
|
+
React12.useEffect(() => {
|
|
4360
4667
|
if (typeof window === "undefined") return;
|
|
4361
4668
|
let root = document.getElementById("volr-modal-root");
|
|
4362
4669
|
if (!root) {
|
|
@@ -4415,9 +4722,9 @@ function AccountModalPortal() {
|
|
|
4415
4722
|
function DepositModalPortal() {
|
|
4416
4723
|
const { isOpen, mode, asset, close } = useVolrModal();
|
|
4417
4724
|
const { user } = react.useVolrContext();
|
|
4418
|
-
const [portalRoot, setPortalRoot] =
|
|
4419
|
-
const [showLogin, setShowLogin] =
|
|
4420
|
-
|
|
4725
|
+
const [portalRoot, setPortalRoot] = React12.useState(null);
|
|
4726
|
+
const [showLogin, setShowLogin] = React12.useState(false);
|
|
4727
|
+
React12.useEffect(() => {
|
|
4421
4728
|
if (typeof window === "undefined") return;
|
|
4422
4729
|
let root = document.getElementById("volr-modal-root");
|
|
4423
4730
|
if (!root) {
|
|
@@ -4432,7 +4739,7 @@ function DepositModalPortal() {
|
|
|
4432
4739
|
}
|
|
4433
4740
|
};
|
|
4434
4741
|
}, []);
|
|
4435
|
-
|
|
4742
|
+
React12.useEffect(() => {
|
|
4436
4743
|
if (isOpen && mode === "deposit" && !user) {
|
|
4437
4744
|
setShowLogin(true);
|
|
4438
4745
|
} else {
|
|
@@ -4466,8 +4773,8 @@ function DepositModalPortal() {
|
|
|
4466
4773
|
}
|
|
4467
4774
|
function PaymentModalPortal() {
|
|
4468
4775
|
const { isOpen, mode, close } = useVolrModal();
|
|
4469
|
-
const [portalRoot, setPortalRoot] =
|
|
4470
|
-
|
|
4776
|
+
const [portalRoot, setPortalRoot] = React12.useState(null);
|
|
4777
|
+
React12.useEffect(() => {
|
|
4471
4778
|
if (typeof window === "undefined") return;
|
|
4472
4779
|
let root = document.getElementById("volr-modal-root");
|
|
4473
4780
|
if (!root) {
|
|
@@ -4494,11 +4801,42 @@ function PaymentModalPortal() {
|
|
|
4494
4801
|
portalRoot
|
|
4495
4802
|
);
|
|
4496
4803
|
}
|
|
4804
|
+
function SignRequestModalPortal() {
|
|
4805
|
+
const { pendingRequest } = useSignRequestInternal();
|
|
4806
|
+
const [portalRoot, setPortalRoot] = React12.useState(null);
|
|
4807
|
+
React12.useEffect(() => {
|
|
4808
|
+
if (typeof window === "undefined") return;
|
|
4809
|
+
let root = document.getElementById("volr-modal-root");
|
|
4810
|
+
if (!root) {
|
|
4811
|
+
root = document.createElement("div");
|
|
4812
|
+
root.id = "volr-modal-root";
|
|
4813
|
+
document.body.appendChild(root);
|
|
4814
|
+
}
|
|
4815
|
+
setPortalRoot(root);
|
|
4816
|
+
return () => {
|
|
4817
|
+
if (root && root.childNodes.length === 0) {
|
|
4818
|
+
root.remove();
|
|
4819
|
+
}
|
|
4820
|
+
};
|
|
4821
|
+
}, []);
|
|
4822
|
+
if (!portalRoot) return null;
|
|
4823
|
+
return reactDom.createPortal(
|
|
4824
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4825
|
+
SignRequestModal,
|
|
4826
|
+
{
|
|
4827
|
+
open: pendingRequest !== null,
|
|
4828
|
+
onOpenChange: () => {
|
|
4829
|
+
}
|
|
4830
|
+
}
|
|
4831
|
+
),
|
|
4832
|
+
portalRoot
|
|
4833
|
+
);
|
|
4834
|
+
}
|
|
4497
4835
|
function OAuthCallbackHandler({
|
|
4498
4836
|
onShowOnboarding
|
|
4499
4837
|
}) {
|
|
4500
|
-
const [hasCode, setHasCode] =
|
|
4501
|
-
|
|
4838
|
+
const [hasCode, setHasCode] = React12.useState(false);
|
|
4839
|
+
React12.useEffect(() => {
|
|
4502
4840
|
if (typeof window === "undefined") return;
|
|
4503
4841
|
const params = new URLSearchParams(window.location.search);
|
|
4504
4842
|
const code = params.get("code");
|
|
@@ -4541,13 +4879,13 @@ function OnboardingChecker({
|
|
|
4541
4879
|
}) {
|
|
4542
4880
|
const { user, provider, isLoading } = react.useVolrContext();
|
|
4543
4881
|
const { isOpen: isModalOpen } = useVolrModal();
|
|
4544
|
-
const modalWasOpened =
|
|
4545
|
-
|
|
4882
|
+
const modalWasOpened = React12__default.default.useRef(false);
|
|
4883
|
+
React12.useEffect(() => {
|
|
4546
4884
|
if (isModalOpen) {
|
|
4547
4885
|
modalWasOpened.current = true;
|
|
4548
4886
|
}
|
|
4549
4887
|
}, [isModalOpen]);
|
|
4550
|
-
|
|
4888
|
+
React12.useEffect(() => {
|
|
4551
4889
|
if (isLoading) {
|
|
4552
4890
|
return;
|
|
4553
4891
|
}
|
|
@@ -4590,7 +4928,7 @@ function OnboardingChecker({
|
|
|
4590
4928
|
}
|
|
4591
4929
|
function useSwitchNetwork() {
|
|
4592
4930
|
const { client } = react.useInternalAuth();
|
|
4593
|
-
return
|
|
4931
|
+
return React12.useCallback(
|
|
4594
4932
|
async (chainId) => {
|
|
4595
4933
|
if (typeof window === "undefined" || !window.ethereum) {
|
|
4596
4934
|
throw new Error("No wallet found");
|
|
@@ -4654,8 +4992,8 @@ var paymentPromiseResolver = null;
|
|
|
4654
4992
|
function useVolrPay() {
|
|
4655
4993
|
const { open: openModal, close: closeModal } = useVolrModal();
|
|
4656
4994
|
const { checkPayment, getPaymentHistory } = react.useVolrPaymentApi();
|
|
4657
|
-
const isInProgressRef =
|
|
4658
|
-
const pay =
|
|
4995
|
+
const isInProgressRef = React12.useRef(false);
|
|
4996
|
+
const pay = React12.useCallback(
|
|
4659
4997
|
(options) => {
|
|
4660
4998
|
isInProgressRef.current = true;
|
|
4661
4999
|
const waitPromise = new Promise((resolve, reject) => {
|