@retinalabsllc/zairusjs 18.0.1 → 20.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +1 -38
- package/dist/index.d.ts +1 -38
- package/dist/index.js +466 -704
- package/dist/index.mjs +474 -719
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -21,6 +21,7 @@ var Faq = ({
|
|
|
21
21
|
}
|
|
22
22
|
},
|
|
23
23
|
{ threshold: 0.1 }
|
|
24
|
+
// Triggers when 10% of the title is visible
|
|
24
25
|
);
|
|
25
26
|
if (titleRef.current) {
|
|
26
27
|
observer.observe(titleRef.current);
|
|
@@ -34,39 +35,57 @@ var Faq = ({
|
|
|
34
35
|
"h2",
|
|
35
36
|
{
|
|
36
37
|
ref: titleRef,
|
|
37
|
-
className:
|
|
38
|
+
className: `text-3xl text-black tracking-tight leading-[1.15] ${isAnimating ? "" : ""}`,
|
|
39
|
+
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
38
40
|
},
|
|
39
41
|
"FAQ"
|
|
40
42
|
)), /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-3 w-full" }, items.map((faq, index) => {
|
|
41
43
|
const isOpen = activeFaq === index;
|
|
44
|
+
const getShadowStyle = () => {
|
|
45
|
+
if (isOpen) return `
|
|
46
|
+
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.2),
|
|
47
|
+
inset 0 -3px 0 0 rgba(0, 0, 0, 0.3),
|
|
48
|
+
0 4px 0 0 #0c0c0c,
|
|
49
|
+
0 12px 24px rgba(0, 0, 0, 0.1)
|
|
50
|
+
`;
|
|
51
|
+
return "none";
|
|
52
|
+
};
|
|
42
53
|
return /* @__PURE__ */ React.createElement(
|
|
43
54
|
"div",
|
|
44
55
|
{
|
|
45
56
|
key: index,
|
|
46
|
-
className: `transition-all duration-
|
|
57
|
+
className: `relative transition-all duration-500 rounded-4xl overflow-hidden ${isOpen ? "bg-black border-transparent" : "border border-stone-200 hover:border-stone-300"}`,
|
|
58
|
+
style: { boxShadow: getShadowStyle() }
|
|
47
59
|
},
|
|
60
|
+
isOpen && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
|
|
61
|
+
"div",
|
|
62
|
+
{
|
|
63
|
+
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
64
|
+
style: { backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")` }
|
|
65
|
+
}
|
|
66
|
+
), /* @__PURE__ */ React.createElement("span", { className: "absolute inset-0 rounded-4xl bg-linear-to-b from-white/10 via-white/5 to-transparent pointer-events-none z-10" })),
|
|
48
67
|
/* @__PURE__ */ React.createElement(
|
|
49
68
|
"button",
|
|
50
69
|
{
|
|
51
|
-
className: "flex items-center justify-between w-full gap-4 text-left px-6 py-5 outline-none cursor-pointer group",
|
|
70
|
+
className: "relative z-20 flex items-center justify-between w-full gap-4 text-left px-6 py-5 outline-none cursor-pointer group",
|
|
52
71
|
onClick: () => toggleFaq(index)
|
|
53
72
|
},
|
|
54
73
|
/* @__PURE__ */ React.createElement(
|
|
55
74
|
"span",
|
|
56
75
|
{
|
|
57
|
-
className: `text-
|
|
76
|
+
className: `text-sm transition-colors duration-300 flex items-center gap-2 ${isOpen ? "text-white" : "text-black"}`
|
|
58
77
|
},
|
|
59
|
-
/* @__PURE__ */ React.createElement("span", { className: isOpen ? "text-
|
|
78
|
+
/* @__PURE__ */ React.createElement("span", { className: isOpen ? "text-stone-400" : "text-stone-400" }, index + 1, "."),
|
|
60
79
|
faq.question
|
|
61
80
|
),
|
|
62
|
-
/* @__PURE__ */ React.createElement("div", { className: `shrink-0 transition-colors duration-300 ${isOpen ? "text-white" : "text-
|
|
81
|
+
/* @__PURE__ */ React.createElement("div", { className: `shrink-0 transition-colors duration-300 ${isOpen ? "text-white" : "text-black group-hover:text-black/70"}` }, isOpen ? /* @__PURE__ */ React.createElement("svg", { width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }, /* @__PURE__ */ React.createElement("circle", { cx: "12", cy: "12", r: "10" }), /* @__PURE__ */ React.createElement("path", { d: "M8 12h8", strokeLinecap: "round" })) : /* @__PURE__ */ React.createElement("svg", { width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }, /* @__PURE__ */ React.createElement("circle", { cx: "12", cy: "12", r: "10" }), /* @__PURE__ */ React.createElement("path", { d: "M12 8v8M8 12h8", strokeLinecap: "round" })))
|
|
63
82
|
),
|
|
64
83
|
/* @__PURE__ */ React.createElement(
|
|
65
84
|
"div",
|
|
66
85
|
{
|
|
67
|
-
className: `grid transition-all duration-300 ease-in-out ${isOpen ? "grid-rows-[1fr] opacity-100" : "grid-rows-[0fr] opacity-0"}`
|
|
86
|
+
className: `relative z-20 grid transition-all duration-300 ease-in-out ${isOpen ? "grid-rows-[1fr] opacity-100" : "grid-rows-[0fr] opacity-0"}`
|
|
68
87
|
},
|
|
69
|
-
/* @__PURE__ */ React.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ React.createElement("p", { className: `text-
|
|
88
|
+
/* @__PURE__ */ React.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ React.createElement("p", { className: `text-sm leading-relaxed px-6 pb-6 pt-0 pr-12 transition-colors duration-300 ${isOpen ? "text-stone-300" : "text-transparent"}` }, faq.answer))
|
|
70
89
|
)
|
|
71
90
|
);
|
|
72
91
|
}))));
|
|
@@ -88,7 +107,7 @@ var ThreeDButton = ({
|
|
|
88
107
|
onClick,
|
|
89
108
|
className: `
|
|
90
109
|
relative inline-flex items-center justify-center py-2.5 px-8 rounded-full
|
|
91
|
-
bg-[#
|
|
110
|
+
bg-[#d97757] hover:bg-[#d97757] text-white text-xs
|
|
92
111
|
transition-colors duration-150 select-none group outline-none
|
|
93
112
|
${className}
|
|
94
113
|
`
|
|
@@ -120,9 +139,9 @@ var ThreeDActionButton = ({
|
|
|
120
139
|
style,
|
|
121
140
|
className: `
|
|
122
141
|
relative inline-flex items-center justify-center py-2.5 px-8 rounded-full
|
|
123
|
-
bg-[#
|
|
142
|
+
bg-[#d97757] text-white text-xs tracking-widest
|
|
124
143
|
transition-colors duration-150 select-none group outline-none
|
|
125
|
-
${isInteractionDisabled ? "opacity-50 cursor-not-allowed" : "hover:bg-[#
|
|
144
|
+
${isInteractionDisabled ? "opacity-50 cursor-not-allowed" : "hover:bg-[#d97757]"}
|
|
126
145
|
${className}
|
|
127
146
|
`
|
|
128
147
|
},
|
|
@@ -142,8 +161,8 @@ var NavLink = ({
|
|
|
142
161
|
}) => {
|
|
143
162
|
const pathname = usePathname();
|
|
144
163
|
const isActive = pathname === href;
|
|
145
|
-
const activeClass = "text-
|
|
146
|
-
const inactiveClass = "text-
|
|
164
|
+
const activeClass = "text-stone-900 ";
|
|
165
|
+
const inactiveClass = "text-stone-500 hover:text-stone-900";
|
|
147
166
|
return /* @__PURE__ */ React4.createElement(
|
|
148
167
|
Link2,
|
|
149
168
|
{
|
|
@@ -170,8 +189,8 @@ var Header = ({
|
|
|
170
189
|
const headerLayoutWidth = compact ? "w-fit mx-auto gap-8 md:gap-16" : "w-full justify-between";
|
|
171
190
|
const hasBrandSection = showLogo || !hideHeaderText;
|
|
172
191
|
const headerBgClass = "bg-white/80";
|
|
173
|
-
const brandTitleClass = "text-
|
|
174
|
-
const brandSubtitleClass = "text-
|
|
192
|
+
const brandTitleClass = "text-stone-900";
|
|
193
|
+
const brandSubtitleClass = "text-stone-500";
|
|
175
194
|
const shouldInvertLogo = !invert;
|
|
176
195
|
if (!mounted) {
|
|
177
196
|
return /* @__PURE__ */ React4.createElement("div", { className: "w-full h-20 px-4 pt-4 sm:pt-6" });
|
|
@@ -188,7 +207,7 @@ var Header = ({
|
|
|
188
207
|
className: `object-contain w-8 h-auto ${shouldInvertLogo ? "invert" : ""}`,
|
|
189
208
|
priority: true
|
|
190
209
|
}
|
|
191
|
-
), !hideHeaderText && /* @__PURE__ */ React4.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ React4.createElement("span", { className: `text-
|
|
210
|
+
), !hideHeaderText && /* @__PURE__ */ React4.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ React4.createElement("span", { className: `text-sm leading-none tracking-wide mb-1 ${brandTitleClass}` }, companyName), subtitle && /* @__PURE__ */ React4.createElement("span", { className: `text-xs tracking-widest leading-none ${brandSubtitleClass}` }, subtitle)))), /* @__PURE__ */ React4.createElement("nav", { className: "flex items-center gap-1 md:gap-2 shrink-0" }, links.map((link, index) => /* @__PURE__ */ React4.createElement(
|
|
192
211
|
NavLink,
|
|
193
212
|
{
|
|
194
213
|
key: index,
|
|
@@ -208,10 +227,10 @@ import { useGoogleReCaptcha, GoogleReCaptchaProvider } from "react-google-recapt
|
|
|
208
227
|
import { startAuthentication } from "@simplewebauthn/browser";
|
|
209
228
|
import { HugeiconsIcon as HugeiconsIcon2 } from "@hugeicons/react";
|
|
210
229
|
import { Loading03Icon as Loading03Icon2 } from "@hugeicons/core-free-icons";
|
|
211
|
-
var InputSpinner = () => /* @__PURE__ */ React5.createElement("svg", { className: "animate-spin h-4 w-4 text-
|
|
230
|
+
var InputSpinner = () => /* @__PURE__ */ React5.createElement("svg", { className: "animate-spin h-4 w-4 text-stone-400", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, /* @__PURE__ */ React5.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ React5.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" }));
|
|
212
231
|
var ImageLoader = ({ src }) => {
|
|
213
232
|
const [loaded, setLoaded] = useState3(false);
|
|
214
|
-
return /* @__PURE__ */ React5.createElement("div", { className: "relative w-full h-full bg-
|
|
233
|
+
return /* @__PURE__ */ React5.createElement("div", { className: "relative w-full h-full bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && /* @__PURE__ */ React5.createElement(HugeiconsIcon2, { icon: Loading03Icon2, className: "animate-spin text-stone-400 absolute", size: 24 }), /* @__PURE__ */ React5.createElement(
|
|
215
234
|
"img",
|
|
216
235
|
{
|
|
217
236
|
src,
|
|
@@ -408,25 +427,25 @@ function AuthFormInner({
|
|
|
408
427
|
}
|
|
409
428
|
return false;
|
|
410
429
|
};
|
|
411
|
-
return /* @__PURE__ */ React5.createElement("div", { className: "min-h-screen w-full bg-white flex flex-col md:flex-row" }, /* @__PURE__ */ React5.createElement("div", { className: "hidden md:flex md:w-1/2 lg:w-[45%] h-screen sticky top-0 left-0 bg-
|
|
430
|
+
return /* @__PURE__ */ React5.createElement("div", { className: "min-h-screen w-full bg-white flex flex-col md:flex-row" }, /* @__PURE__ */ React5.createElement("div", { className: "hidden md:flex md:w-1/2 lg:w-[45%] h-screen sticky top-0 left-0 bg-stone-100" }, /* @__PURE__ */ React5.createElement(ImageLoader, { src: heroImageUrl })), /* @__PURE__ */ React5.createElement("div", { className: "flex-1 flex flex-col items-center pt-16 md:pt-0 md:justify-center px-6 sm:px-12 w-full animate-in fade-in duration-300" }, /* @__PURE__ */ React5.createElement("div", { className: "w-full max-w-sm mx-auto" }, step === "INPUT" && /* @__PURE__ */ React5.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ React5.createElement("div", { className: "mb-12 mt-2" }, /* @__PURE__ */ React5.createElement("h2", { className: "text-2xl text-black mb-2 tracking-tight" }, mode === "LOGIN" ? `${companyName} ${workspaceLabel}` : "Create Account"), /* @__PURE__ */ React5.createElement("div", { className: "text-sm text-stone-500" }, mode === "LOGIN" ? /* @__PURE__ */ React5.createElement(React5.Fragment, null, "Don't have an account? ", /* @__PURE__ */ React5.createElement("button", { type: "button", onClick: () => {
|
|
412
431
|
setMode("SIGNUP");
|
|
413
432
|
setSignupStep(getInitialSignupStep());
|
|
414
|
-
}, className: "text-[#
|
|
433
|
+
}, className: "text-[#d97757] transition-colors ml-1 outline-none" }, "Sign up")) : /* @__PURE__ */ React5.createElement(React5.Fragment, null, "Already have an account? ", /* @__PURE__ */ React5.createElement("button", { type: "button", onClick: () => setMode("LOGIN"), className: "text-[#d97757] transition-colors ml-1 outline-none" }, "Log in")))), /* @__PURE__ */ React5.createElement("form", { className: "space-y-6", autoComplete: "off", onSubmit: (e) => {
|
|
415
434
|
e.preventDefault();
|
|
416
435
|
if (mode === "SIGNUP" && signupStep === "NAME") handleNextSignupStep();
|
|
417
436
|
else if (mode === "SIGNUP" && signupStep === "ORGANIZATION") handleNextSignupStep();
|
|
418
437
|
else handleAuthRequestSubmit();
|
|
419
|
-
} }, mode === "SIGNUP" && signupStep === "NAME" && requireNames && /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-
|
|
438
|
+
} }, mode === "SIGNUP" && signupStep === "NAME" && requireNames && /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block " }, "First Name"), /* @__PURE__ */ React5.createElement("input", { type: "text", value: firstName, onChange: (e) => setFirstName(cleanAlpha(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-stone-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "First name" })), /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block " }, "Last Name"), /* @__PURE__ */ React5.createElement("input", { type: "text", value: lastName, onChange: (e) => setLastName(cleanAlpha(e.target.value)), required: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-stone-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Last name" }))), mode === "SIGNUP" && signupStep === "ORGANIZATION" && requireOrganization && /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in zoom-in-95 duration-200" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ React5.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block " }, "Workspace Name"), /* @__PURE__ */ React5.createElement("input", { type: "text", value: orgName, onChange: (e) => setOrgName(cleanOrgName(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-stone-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Acme Corporation" }))), (mode === "LOGIN" || mode === "SIGNUP" && signupStep === "EMAIL_ID") && /* @__PURE__ */ React5.createElement("div", { className: "space-y-6 animate-in fade-in zoom-in-95 duration-200" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block " }, "Email ID"), /* @__PURE__ */ React5.createElement("input", { type: "email", value: emailId, onChange: (e) => setEmailId(cleanEmailId(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-stone-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "name@company.com" })), mode === "SIGNUP" && /* @__PURE__ */ React5.createElement("div", { className: "flex items-start gap-3 mt-4" }, /* @__PURE__ */ React5.createElement(
|
|
420
439
|
"input",
|
|
421
440
|
{
|
|
422
441
|
type: "checkbox",
|
|
423
442
|
id: "zairus-terms",
|
|
424
443
|
checked: agreedToTerms,
|
|
425
444
|
onChange: (e) => setAgreedToTerms(e.target.checked),
|
|
426
|
-
className: "mt-0.5 w-4 h-4 bg-white border-
|
|
445
|
+
className: "mt-0.5 w-4 h-4 bg-white border-stone-300 rounded text-[#d97757] focus:ring-[#d97757] accent-[#d97757] cursor-pointer",
|
|
427
446
|
required: true
|
|
428
447
|
}
|
|
429
|
-
), /* @__PURE__ */ React5.createElement("label", { htmlFor: "zairus-terms", className: "text-
|
|
448
|
+
), /* @__PURE__ */ React5.createElement("label", { htmlFor: "zairus-terms", className: "text-xs text-stone-500 cursor-pointer leading-snug select-none" }, "I agree to ", companyName, "'s ", /* @__PURE__ */ React5.createElement("a", { href: termsUrl, target: "_blank", rel: "noreferrer", className: "text-[#d97757] hover:underline outline-none" }, "Terms of Service"), " and ", /* @__PURE__ */ React5.createElement("a", { href: privacyUrl, target: "_blank", rel: "noreferrer", className: "text-[#d97757] hover:underline outline-none" }, "Privacy Policy"), "."))), /* @__PURE__ */ React5.createElement("div", { className: "pt-4" }, /* @__PURE__ */ React5.createElement(ThreeDActionButton, { type: "submit", disabled: isContinueDisabled(), isLoading: isSubmitting, className: "w-full shadow-md shadow-stone-200/50" }, "Continue")))), step === "OTP" && /* @__PURE__ */ React5.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ React5.createElement("div", { className: "mb-10 mt-2" }, /* @__PURE__ */ React5.createElement("h2", { className: "text-2xl text-black mb-2 tracking-tight" }, "Security Check"), /* @__PURE__ */ React5.createElement("p", { className: "text-sm text-stone-500" }, userHas2FA ? "Enter the code from your authenticator app." : `Enter the code sent to ${emailId}`)), /* @__PURE__ */ React5.createElement("form", { className: "space-y-8", autoComplete: "off", onSubmit: (e) => {
|
|
430
449
|
e.preventDefault();
|
|
431
450
|
verifyOtpCode(otp.join(""));
|
|
432
451
|
} }, /* @__PURE__ */ React5.createElement("div", { className: "flex justify-between gap-2", onPaste: handlePaste }, otp.map((digit, index) => /* @__PURE__ */ React5.createElement(
|
|
@@ -444,15 +463,15 @@ function AuthFormInner({
|
|
|
444
463
|
onKeyDown: (e) => {
|
|
445
464
|
if (e.key === "Backspace" && !otp[index] && index > 0) inputRefs.current[index - 1]?.focus();
|
|
446
465
|
},
|
|
447
|
-
className: "w-10 h-10 text-center text-sm bg-transparent border-b-2 border-
|
|
466
|
+
className: "w-10 h-10 text-center text-sm bg-transparent border-b-2 border-stone-200 text-black outline-none focus:border-black transition-all duration-300"
|
|
448
467
|
}
|
|
449
|
-
))), /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React5.createElement(ThreeDActionButton, { type: "submit", disabled: otp.join("").length < 6, isLoading: isSubmitting, className: "w-full shadow-md shadow-
|
|
468
|
+
))), /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React5.createElement(ThreeDActionButton, { type: "submit", disabled: otp.join("").length < 6, isLoading: isSubmitting, className: "w-full shadow-md shadow-stone-200/50" }, "Verify Code"), !userHas2FA && /* @__PURE__ */ React5.createElement("div", { className: "text-center pt-2" }, /* @__PURE__ */ React5.createElement(
|
|
450
469
|
"button",
|
|
451
470
|
{
|
|
452
471
|
type: "button",
|
|
453
472
|
onClick: handleResendCode,
|
|
454
473
|
disabled: countdown > 0 || isSubmitting,
|
|
455
|
-
className: "text-
|
|
474
|
+
className: "text-xs text-stone-500 hover:text-black transition-colors outline-none disabled:opacity-50"
|
|
456
475
|
},
|
|
457
476
|
countdown > 0 ? `Resend code in ${countdown}s` : "Resend verification code"
|
|
458
477
|
)))), userHasPasskey && /* @__PURE__ */ React5.createElement("div", { className: "pt-6 " }, /* @__PURE__ */ React5.createElement(
|
|
@@ -460,7 +479,7 @@ function AuthFormInner({
|
|
|
460
479
|
{
|
|
461
480
|
onClick: triggerPasskeyLogin,
|
|
462
481
|
disabled: isSubmitting,
|
|
463
|
-
className: "w-full py-2.5 rounded-full text-black border border-
|
|
482
|
+
className: "w-full py-2.5 rounded-full text-black border border-stone-200 hover:bg-stone-50 text-sm tracking-wide transition-colors outline-none disabled:opacity-50"
|
|
464
483
|
},
|
|
465
484
|
"Use Passkey Biometrics"
|
|
466
485
|
))))));
|
|
@@ -487,37 +506,37 @@ var Footer = ({
|
|
|
487
506
|
const toggleColumn = (idx) => {
|
|
488
507
|
setOpenCol(openCol === idx ? null : idx);
|
|
489
508
|
};
|
|
490
|
-
return /* @__PURE__ */ React6.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ React6.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ React6.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ React6.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ React6.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-12 lg:gap-16 mb-12 text-left" }, /* @__PURE__ */ React6.createElement("div", { className: "w-full lg:max-w-sm flex flex-col items-start justify-between shrink-0" }, /* @__PURE__ */ React6.createElement("div", { className: "flex items-center gap-4 mb-4" }, /* @__PURE__ */ React6.createElement("img", { src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/ndpr.avif", alt: "NDPR", className: "w-28 h-auto object-contain filter grayscale opacity-80" }), /* @__PURE__ */ React6.createElement("img", { src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/gdpr.avif", alt: "GDPR", className: "w-12 h-12 object-contain filter grayscale opacity-80" })), /* @__PURE__ */ React6.createElement("div", null, /* @__PURE__ */ React6.createElement("p", { className: "text-
|
|
509
|
+
return /* @__PURE__ */ React6.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ React6.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ React6.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ React6.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ React6.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-12 lg:gap-16 mb-12 text-left" }, /* @__PURE__ */ React6.createElement("div", { className: "w-full lg:max-w-sm flex flex-col items-start justify-between shrink-0" }, /* @__PURE__ */ React6.createElement("div", { className: "flex items-center gap-4 mb-4" }, /* @__PURE__ */ React6.createElement("img", { src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/ndpr.avif", alt: "NDPR", className: "w-28 h-auto object-contain filter grayscale opacity-80" }), /* @__PURE__ */ React6.createElement("img", { src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/gdpr.avif", alt: "GDPR", className: "w-12 h-12 object-contain filter grayscale opacity-80" })), /* @__PURE__ */ React6.createElement("div", null, /* @__PURE__ */ React6.createElement("p", { className: "text-xs text-stone-600 leading-relaxed pr-4" }, description))), /* @__PURE__ */ React6.createElement("div", { className: "w-full lg:flex-1 lg:max-w-2xl" }, /* @__PURE__ */ React6.createElement("div", { className: "hidden md:grid grid-cols-2 gap-x-16 lg:gap-x-24 gap-y-12" }, columns.map((col, idx) => /* @__PURE__ */ React6.createElement("div", { key: idx, className: "flex flex-col" }, /* @__PURE__ */ React6.createElement("h4", { className: "text-sm tracking-[0.2em] text-black mb-6 " }, col.title), /* @__PURE__ */ React6.createElement("ul", { className: "space-y-4 text-xs text-stone-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ React6.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ React6.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors block truncate" }, link.label) : /* @__PURE__ */ React6.createElement(Link3, { href: link.href, className: "hover:text-black transition-colors block truncate" }, link.label))))))), /* @__PURE__ */ React6.createElement("div", { className: "flex flex-col md:hidden w-full border-t border-stone-200 mt-4" }, columns.map((col, idx) => {
|
|
491
510
|
const isOpen = openCol === idx;
|
|
492
|
-
return /* @__PURE__ */ React6.createElement("div", { key: idx, className: "border-b border-
|
|
511
|
+
return /* @__PURE__ */ React6.createElement("div", { key: idx, className: "border-b border-stone-200" }, /* @__PURE__ */ React6.createElement(
|
|
493
512
|
"button",
|
|
494
513
|
{
|
|
495
514
|
onClick: () => toggleColumn(idx),
|
|
496
515
|
className: "w-full flex items-center justify-between py-5 text-left outline-none"
|
|
497
516
|
},
|
|
498
|
-
/* @__PURE__ */ React6.createElement("span", { className: "text-
|
|
517
|
+
/* @__PURE__ */ React6.createElement("span", { className: "text-xs tracking-[0.2em] text-black " }, col.title),
|
|
499
518
|
/* @__PURE__ */ React6.createElement(
|
|
500
519
|
"svg",
|
|
501
520
|
{
|
|
502
|
-
className: `w-4 h-4 text-
|
|
521
|
+
className: `w-4 h-4 text-stone-400 transition-transform duration-300 ${isOpen ? "rotate-180" : ""}`,
|
|
503
522
|
fill: "none",
|
|
504
523
|
viewBox: "0 0 24 24",
|
|
505
524
|
stroke: "currentColor"
|
|
506
525
|
},
|
|
507
526
|
/* @__PURE__ */ React6.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M19 9l-7 7-7-7" })
|
|
508
527
|
)
|
|
509
|
-
), /* @__PURE__ */ React6.createElement("div", { className: `grid transition-all duration-300 ease-in-out ${isOpen ? "grid-rows-[1fr] pb-6 opacity-100" : "grid-rows-[0fr] opacity-0"}` }, /* @__PURE__ */ React6.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ React6.createElement("ul", { className: "space-y-4 text-
|
|
510
|
-
})))), /* @__PURE__ */ React6.createElement("div", { className: "pt-12 mt-4 border-t border-
|
|
528
|
+
), /* @__PURE__ */ React6.createElement("div", { className: `grid transition-all duration-300 ease-in-out ${isOpen ? "grid-rows-[1fr] pb-6 opacity-100" : "grid-rows-[0fr] opacity-0"}` }, /* @__PURE__ */ React6.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ React6.createElement("ul", { className: "space-y-4 text-xs text-stone-500 pt-2" }, col.links.map((link, lIdx) => /* @__PURE__ */ React6.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ React6.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors" }, link.label) : /* @__PURE__ */ React6.createElement(Link3, { href: link.href, className: "hover:text-black transition-colors" }, link.label)))))));
|
|
529
|
+
})))), /* @__PURE__ */ React6.createElement("div", { className: "pt-12 mt-4 border-t border-stone-200 flex flex-col items-center justify-center gap-8 relative z-20 text-center" }, socialLinks && socialLinks.length > 0 && /* @__PURE__ */ React6.createElement("div", { className: "flex items-center justify-center gap-6" }, socialLinks.map((social, idx) => /* @__PURE__ */ React6.createElement(
|
|
511
530
|
"a",
|
|
512
531
|
{
|
|
513
532
|
key: idx,
|
|
514
533
|
href: social.href,
|
|
515
534
|
target: "_blank",
|
|
516
535
|
rel: "noopener noreferrer",
|
|
517
|
-
className: "text-
|
|
536
|
+
className: "text-stone-400 hover:text-black transition-colors"
|
|
518
537
|
},
|
|
519
538
|
/* @__PURE__ */ React6.createElement(HugeiconsIcon3, { icon: social.icon, size: 20 })
|
|
520
|
-
))), /* @__PURE__ */ React6.createElement("p", { className: "text-
|
|
539
|
+
))), /* @__PURE__ */ React6.createElement("p", { className: "text-xs text-stone-400 leading-relaxed max-w-5xl mx-auto" }, "Retina Labs Company (RC - 9235780) is an artificial intelligence research organization and software developer headquartered in Lagos, Nigeria, and the Netherlands. Unauthorized reproduction or redistribution of copyrighted materials on this website and Retina Labs Company's digital media pages is strictly prohibited. By clicking on some of the links above, you may leave our website and be directed to a third-party website. The privacy practices of those third parties may differ from ours. We recommend you review the privacy statements of those third-party websites, as Retina Labs Company is not responsible for those third parties' privacy or security practices. For inquiries, contact us via phone at +234 201 700 1157 / +1 507 773 0007 or email at labs@theretinalabs.com. Additional disclosures and legal resources can be found in the respective sections of our platform."), /* @__PURE__ */ React6.createElement("p", { className: "text-xs text-stone-500 tracking-widest mt-8" }, copyrightText))))));
|
|
521
540
|
};
|
|
522
541
|
|
|
523
542
|
// src/components/UniversalHuddleDetails.tsx
|
|
@@ -587,16 +606,16 @@ var ReusableOptions = ({
|
|
|
587
606
|
const filteredOptions = options.filter(
|
|
588
607
|
(opt) => opt.toLowerCase().includes(searchQuery.toLowerCase())
|
|
589
608
|
);
|
|
590
|
-
return /* @__PURE__ */ React8.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React8.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: onClose }), /* @__PURE__ */ React8.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[80vh]" }, /* @__PURE__ */ React8.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React8.createElement("h3", { className: "text-
|
|
609
|
+
return /* @__PURE__ */ React8.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React8.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: onClose }), /* @__PURE__ */ React8.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[80vh]" }, /* @__PURE__ */ React8.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React8.createElement("h3", { className: "text-sm text-black tracking-tight" }, title), /* @__PURE__ */ React8.createElement("button", { onClick: onClose, className: "text-stone-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React8.createElement(HugeiconsIcon4, { icon: CancelCircleIcon, size: 18 }))), showSearch && /* @__PURE__ */ React8.createElement("div", { className: "p-4 shrink-0 " }, /* @__PURE__ */ React8.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React8.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React8.createElement(HugeiconsIcon4, { icon: Search01Icon, size: 16, className: "text-stone-400" })), /* @__PURE__ */ React8.createElement(
|
|
591
610
|
"input",
|
|
592
611
|
{
|
|
593
612
|
type: "text",
|
|
594
613
|
placeholder: "Search...",
|
|
595
614
|
value: searchQuery,
|
|
596
615
|
onChange: (e) => setSearchQuery(e.target.value),
|
|
597
|
-
className: "w-full pl-10 pr-4 py-2.5 bg-
|
|
616
|
+
className: "w-full pl-10 pr-4 py-2.5 bg-stone-100 rounded-full text-sm text-black placeholder-stone-400 outline-none focus:bg-stone-200 transition-colors"
|
|
598
617
|
}
|
|
599
|
-
))), /* @__PURE__ */ React8.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2" }, filteredOptions.length === 0 ? /* @__PURE__ */ React8.createElement("div", { className: "p-6 text-center text-
|
|
618
|
+
))), /* @__PURE__ */ React8.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2" }, filteredOptions.length === 0 ? /* @__PURE__ */ React8.createElement("div", { className: "p-6 text-center text-xs text-stone-400" }, "No options found.") : filteredOptions.map((opt) => {
|
|
600
619
|
const isSelected = selectedOption === opt;
|
|
601
620
|
return /* @__PURE__ */ React8.createElement(
|
|
602
621
|
"button",
|
|
@@ -606,7 +625,7 @@ var ReusableOptions = ({
|
|
|
606
625
|
onSelect(opt);
|
|
607
626
|
onClose();
|
|
608
627
|
},
|
|
609
|
-
className: `w-full text-left p-4 text-
|
|
628
|
+
className: `w-full text-left p-4 text-sm tracking-tight rounded-full transition-colors outline-none ${isSelected ? "text-[#d97757] bg-[#d97757]/10" : "text-stone-600 hover:bg-stone-50/50"}`
|
|
610
629
|
},
|
|
611
630
|
opt.charAt(0).toUpperCase() + opt.slice(1).toLowerCase()
|
|
612
631
|
);
|
|
@@ -709,26 +728,26 @@ var CalendarPicker = ({
|
|
|
709
728
|
onConfirm(final);
|
|
710
729
|
onClose();
|
|
711
730
|
};
|
|
712
|
-
return /* @__PURE__ */ React9.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React9.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: onClose }), /* @__PURE__ */ React9.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React9.createElement("div", { className: "p-4 pb-0 flex flex-col gap-4" }, /* @__PURE__ */ React9.createElement("div", { className: "flex items-center justify-between shrink-0" }, /* @__PURE__ */ React9.createElement("h3", { className: "text-
|
|
731
|
+
return /* @__PURE__ */ React9.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React9.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: onClose }), /* @__PURE__ */ React9.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React9.createElement("div", { className: "p-4 pb-0 flex flex-col gap-4" }, /* @__PURE__ */ React9.createElement("div", { className: "flex items-center justify-between shrink-0" }, /* @__PURE__ */ React9.createElement("h3", { className: "text-sm text-black tracking-tight " }, "Select Date & Time"), /* @__PURE__ */ React9.createElement("button", { onClick: onClose, className: "text-stone-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: CancelCircleIcon2, size: 18 }))), /* @__PURE__ */ React9.createElement("div", { className: "flex gap-4" }, /* @__PURE__ */ React9.createElement(
|
|
713
732
|
"button",
|
|
714
733
|
{
|
|
715
734
|
onClick: () => setMode("DATE"),
|
|
716
|
-
className: `pb-2 text-
|
|
735
|
+
className: `pb-2 text-xs tracking-wide outline-none border-b-2 transition-colors ${mode === "DATE" ? "border-[#d97757] text-[#d97757]" : "border-transparent text-stone-500 hover:text-black"}`
|
|
717
736
|
},
|
|
718
737
|
"Date"
|
|
719
738
|
), /* @__PURE__ */ React9.createElement(
|
|
720
739
|
"button",
|
|
721
740
|
{
|
|
722
741
|
onClick: () => setMode("TIME"),
|
|
723
|
-
className: `pb-2 text-
|
|
742
|
+
className: `pb-2 text-xs tracking-wide outline-none border-b-2 transition-colors ${mode === "TIME" ? "border-[#d97757] text-[#d97757]" : "border-transparent text-stone-500 hover:text-black"}`
|
|
724
743
|
},
|
|
725
744
|
"Time"
|
|
726
|
-
))), /* @__PURE__ */ React9.createElement("div", { className: "p-5" }, mode === "DATE" && /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col gap-4 animate-in fade-in duration-200" }, /* @__PURE__ */ React9.createElement("div", { className: "flex items-center justify-between px-2" }, /* @__PURE__ */ React9.createElement("span", { className: "text-
|
|
745
|
+
))), /* @__PURE__ */ React9.createElement("div", { className: "p-5" }, mode === "DATE" && /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col gap-4 animate-in fade-in duration-200" }, /* @__PURE__ */ React9.createElement("div", { className: "flex items-center justify-between px-2" }, /* @__PURE__ */ React9.createElement("span", { className: "text-sm text-black" }, MONTHS[viewMonth], " ", viewYear), /* @__PURE__ */ React9.createElement("div", { className: "flex gap-1" }, /* @__PURE__ */ React9.createElement(
|
|
727
746
|
"button",
|
|
728
747
|
{
|
|
729
748
|
onClick: handlePrevMonth,
|
|
730
749
|
disabled: viewYear === today.getFullYear() && viewMonth === today.getMonth(),
|
|
731
|
-
className: "w-8 h-8 flex items-center justify-center rounded-full hover:bg-
|
|
750
|
+
className: "w-8 h-8 flex items-center justify-center rounded-full hover:bg-stone-100 disabled:opacity-30 disabled:cursor-not-allowed outline-none transition-colors"
|
|
732
751
|
},
|
|
733
752
|
/* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: ArrowLeft01Icon, size: 16, className: "text-black" })
|
|
734
753
|
), /* @__PURE__ */ React9.createElement(
|
|
@@ -736,10 +755,10 @@ var CalendarPicker = ({
|
|
|
736
755
|
{
|
|
737
756
|
onClick: handleNextMonth,
|
|
738
757
|
disabled: viewYear === maxDate.getFullYear() && viewMonth === 11,
|
|
739
|
-
className: "w-8 h-8 flex items-center justify-center rounded-full hover:bg-
|
|
758
|
+
className: "w-8 h-8 flex items-center justify-center rounded-full hover:bg-stone-100 disabled:opacity-30 disabled:cursor-not-allowed outline-none transition-colors"
|
|
740
759
|
},
|
|
741
760
|
/* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: ArrowRight01Icon, size: 16, className: "text-black" })
|
|
742
|
-
))), /* @__PURE__ */ React9.createElement("div", { className: "grid grid-cols-7 gap-1" }, DAYS_OF_WEEK.map((d) => /* @__PURE__ */ React9.createElement("div", { key: d, className: "text-center text-
|
|
761
|
+
))), /* @__PURE__ */ React9.createElement("div", { className: "grid grid-cols-7 gap-1" }, DAYS_OF_WEEK.map((d) => /* @__PURE__ */ React9.createElement("div", { key: d, className: "text-center text-xs text-stone-400 py-2" }, d)), Array.from({ length: firstDayOffset }).map((_, i) => /* @__PURE__ */ React9.createElement("div", { key: `empty-${i}` })), Array.from({ length: daysInMonth }).map((_, i) => {
|
|
743
762
|
const day = i + 1;
|
|
744
763
|
const isDisabled = isDateDisabled(viewYear, viewMonth, day);
|
|
745
764
|
const isSelected = selectedDate.getFullYear() === viewYear && selectedDate.getMonth() === viewMonth && selectedDate.getDate() === day;
|
|
@@ -749,16 +768,16 @@ var CalendarPicker = ({
|
|
|
749
768
|
key: day,
|
|
750
769
|
disabled: isDisabled,
|
|
751
770
|
onClick: () => setSelectedDate(new Date(viewYear, viewMonth, day)),
|
|
752
|
-
className: `h-9 w-9 rounded-full flex items-center justify-center text-
|
|
753
|
-
${isDisabled ? "text-
|
|
771
|
+
className: `h-9 w-9 rounded-full flex items-center justify-center text-xs transition-colors outline-none
|
|
772
|
+
${isDisabled ? "text-stone-300 cursor-not-allowed" : isSelected ? "bg-[#d97757] text-white" : "text-black hover:bg-stone-100"}`
|
|
754
773
|
},
|
|
755
774
|
day
|
|
756
775
|
);
|
|
757
|
-
}))), mode === "TIME" && /* @__PURE__ */ React9.createElement("div", { className: "flex items-center justify-center gap-6 py-6 animate-in fade-in duration-200" }, /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col items-center gap-4" }, /* @__PURE__ */ React9.createElement("button", { onClick: () => adjustTime("H", 1), className: "p-2 rounded-full hover:bg-
|
|
776
|
+
}))), mode === "TIME" && /* @__PURE__ */ React9.createElement("div", { className: "flex items-center justify-center gap-6 py-6 animate-in fade-in duration-200" }, /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col items-center gap-4" }, /* @__PURE__ */ React9.createElement("button", { onClick: () => adjustTime("H", 1), className: "p-2 rounded-full hover:bg-stone-100 outline-none" }, /* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: ArrowUp01Icon, size: 20, className: "text-stone-500" })), /* @__PURE__ */ React9.createElement("span", { className: "text-3xl text-black w-12 text-center" }, hour.toString().padStart(2, "0")), /* @__PURE__ */ React9.createElement("button", { onClick: () => adjustTime("H", -1), className: "p-2 rounded-full hover:bg-stone-100 outline-none" }, /* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: ArrowDown01Icon, size: 20, className: "text-stone-500" }))), /* @__PURE__ */ React9.createElement("span", { className: "text-3xl text-stone-300 pb-2" }, ":"), /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col items-center gap-4" }, /* @__PURE__ */ React9.createElement("button", { onClick: () => adjustTime("M", 1), className: "p-2 rounded-full hover:bg-stone-100 outline-none" }, /* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: ArrowUp01Icon, size: 20, className: "text-stone-500" })), /* @__PURE__ */ React9.createElement("span", { className: "text-3xl text-black w-12 text-center" }, minute.toString().padStart(2, "0")), /* @__PURE__ */ React9.createElement("button", { onClick: () => adjustTime("M", -1), className: "p-2 rounded-full hover:bg-stone-100 outline-none" }, /* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: ArrowDown01Icon, size: 20, className: "text-stone-500" }))), /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col items-center gap-4 ml-2" }, /* @__PURE__ */ React9.createElement("button", { onClick: () => adjustTime("A", 1), className: "p-2 rounded-full hover:bg-stone-100 outline-none" }, /* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: ArrowUp01Icon, size: 20, className: "text-stone-500" })), /* @__PURE__ */ React9.createElement("span", { className: "text-xl text-[#d97757] w-12 text-center" }, ampm), /* @__PURE__ */ React9.createElement("button", { onClick: () => adjustTime("A", -1), className: "p-2 rounded-full hover:bg-stone-100 outline-none" }, /* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: ArrowDown01Icon, size: 20, className: "text-stone-500" }))))), /* @__PURE__ */ React9.createElement("div", { className: "p-5 flex justify-end shrink-0" }, /* @__PURE__ */ React9.createElement(
|
|
758
777
|
"button",
|
|
759
778
|
{
|
|
760
779
|
onClick: handleSave,
|
|
761
|
-
className: "text-[#
|
|
780
|
+
className: "text-[#d97757] hover:text-[#d97757] transition-colors outline-none text-sm tracking-wide"
|
|
762
781
|
},
|
|
763
782
|
"Done"
|
|
764
783
|
))));
|
|
@@ -786,12 +805,12 @@ var ConfirmationDialog = ({
|
|
|
786
805
|
className: "absolute inset-0 bg-black/40 ",
|
|
787
806
|
onClick: () => !isProcessing && onClose()
|
|
788
807
|
}
|
|
789
|
-
), /* @__PURE__ */ React10.createElement("div", { className: "relative w-72 bg-white rounded-2xl flex flex-col items-center overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React10.createElement("div", { className: "p-6 pb-4 text-center w-full" }, /* @__PURE__ */ React10.createElement("h3", { className: "text-
|
|
808
|
+
), /* @__PURE__ */ React10.createElement("div", { className: "relative w-72 bg-white rounded-2xl flex flex-col items-center overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React10.createElement("div", { className: "p-6 pb-4 text-center w-full" }, /* @__PURE__ */ React10.createElement("h3", { className: "text-lg text-black tracking-tight mb-2" }, title), /* @__PURE__ */ React10.createElement("p", { className: "text-xs text-stone-500 leading-relaxed px-2" }, message)), /* @__PURE__ */ React10.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ React10.createElement(
|
|
790
809
|
"button",
|
|
791
810
|
{
|
|
792
811
|
onClick: onClose,
|
|
793
812
|
disabled: isProcessing,
|
|
794
|
-
className: "flex-1 py-4 text-
|
|
813
|
+
className: "flex-1 py-4 text-sm text-stone-500 hover:bg-stone-50 transition-colors disabled:opacity-50 outline-none "
|
|
795
814
|
},
|
|
796
815
|
cancelText
|
|
797
816
|
), /* @__PURE__ */ React10.createElement(
|
|
@@ -799,7 +818,7 @@ var ConfirmationDialog = ({
|
|
|
799
818
|
{
|
|
800
819
|
onClick: onConfirm,
|
|
801
820
|
disabled: isProcessing,
|
|
802
|
-
className: `flex-1 py-4 text-
|
|
821
|
+
className: `flex-1 py-4 text-sm transition-colors disabled:opacity-50 flex justify-center items-center outline-none ${isDestructive ? "text-rose-600 hover:bg-stone-50" : "text-black hover:bg-stone-50"}`
|
|
803
822
|
},
|
|
804
823
|
isProcessing ? /* @__PURE__ */ React10.createElement(HugeiconsIcon6, { icon: Loading03Icon3, className: "animate-spin", size: 18 }) : confirmText
|
|
805
824
|
))));
|
|
@@ -810,7 +829,7 @@ var MemberAvatar = ({ src, sizeClass = "w-10 h-10" }) => {
|
|
|
810
829
|
const [loaded, setLoaded] = useState7(false);
|
|
811
830
|
const [error, setError] = useState7(false);
|
|
812
831
|
const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
|
|
813
|
-
return /* @__PURE__ */ React11.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React11.createElement("div", { className: "w-full h-full rounded-lg bg-
|
|
832
|
+
return /* @__PURE__ */ React11.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React11.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ React11.createElement(HugeiconsIcon7, { icon: Loading03Icon4, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ React11.createElement("img", { src: error || !src ? defaultAvatar : src, alt: "Avatar", className: `w-full h-full object-cover transition-opacity duration-300 ${loaded || error ? "opacity-100" : "opacity-0"}`, onLoad: () => setLoaded(true), onError: () => setError(true) })));
|
|
814
833
|
};
|
|
815
834
|
var STANDARD_TIMEZONES = [
|
|
816
835
|
"UTC",
|
|
@@ -942,7 +961,7 @@ var UniversalHuddleDetails = ({
|
|
|
942
961
|
onClose: () => setConfirmDialog(null),
|
|
943
962
|
onConfirm: handleDelete
|
|
944
963
|
}
|
|
945
|
-
), /* @__PURE__ */ React11.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React11.createElement("a", { href: onBackHref, className: "flex items-center gap-2 text-[#
|
|
964
|
+
), /* @__PURE__ */ React11.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React11.createElement("a", { href: onBackHref, className: "flex items-center gap-2 text-[#d97757] hover:text-[#d97757] transition-colors text-sm outline-none" }, /* @__PURE__ */ React11.createElement(HugeiconsIcon7, { icon: ArrowLeft01Icon2, size: 16 }), " Back")), /* @__PURE__ */ React11.createElement("div", { className: "mb-8 px-1 flex flex-col sm:flex-row sm:items-center justify-between gap-4" }, /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("h1", { className: "text-black text-xl tracking-tight" }, "Huddle Details"), /* @__PURE__ */ React11.createElement("p", { className: "text-xs text-stone-500" }, "Review or modify your scheduled session.")), liveStatus === "ONGOING" && /* @__PURE__ */ React11.createElement("div", { className: "px-4 py-1.5 bg-emerald-50 text-emerald-600 rounded-full text-xs flex items-center gap-2 self-start sm:self-auto" }, /* @__PURE__ */ React11.createElement("span", { className: "w-2 h-2 rounded-full bg-emerald-500 animate-pulse" }), " Ongoing Now"), liveStatus === "SCHEDULED" && timeRemaining && /* @__PURE__ */ React11.createElement("div", { className: "px-4 py-1.5 bg-amber-50 text-amber-600 rounded-full text-xs self-start sm:self-auto" }, "Starting in ", timeRemaining), liveStatus === "COMPLETED" && /* @__PURE__ */ React11.createElement("div", { className: "px-4 py-1.5 bg-stone-200 text-stone-600 rounded-full text-xs self-start sm:self-auto" }, "Completed"), liveStatus === "CANCELLED" && /* @__PURE__ */ React11.createElement("div", { className: "px-4 py-1.5 bg-stone-200 text-stone-500 rounded-full text-xs self-start sm:self-auto" }, "Cancelled")), /* @__PURE__ */ React11.createElement("div", { className: "flex flex-col gap-8 animate-in rounded-2xl p-6 bg-white fade-in duration-300" }, /* @__PURE__ */ React11.createElement("div", { className: "flex flex-col gap-1 w-full" }, /* @__PURE__ */ React11.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Huddle Subject"), isEditingTitle ? /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React11.createElement(
|
|
946
965
|
"input",
|
|
947
966
|
{
|
|
948
967
|
value: title,
|
|
@@ -950,10 +969,10 @@ var UniversalHuddleDetails = ({
|
|
|
950
969
|
setTitle(e.target.value.substring(0, 80));
|
|
951
970
|
setIsDirty(true);
|
|
952
971
|
},
|
|
953
|
-
className: "w-full text-sm border-b border-
|
|
972
|
+
className: "w-full text-sm border-b border-stone-200 focus:border-black outline-none py-2 text-black bg-transparent",
|
|
954
973
|
autoFocus: true
|
|
955
974
|
}
|
|
956
|
-
), /* @__PURE__ */ React11.createElement("button", { onClick: () => setIsEditingTitle(false), className: "text-
|
|
975
|
+
), /* @__PURE__ */ React11.createElement("button", { onClick: () => setIsEditingTitle(false), className: "text-xs text-[#d97757] outline-none " }, "Done")) : /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React11.createElement("span", { className: "text-sm text-black py-2" }, title), enableEdits && /* @__PURE__ */ React11.createElement("button", { onClick: () => setIsEditingTitle(true), className: "text-xs text-[#d97757] hover:underline outline-none" }, "Edit"))), /* @__PURE__ */ React11.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-3 gap-6" }, /* @__PURE__ */ React11.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ React11.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Date"), /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center relative w-full border-b border-transparent pb-3 pt-3" }, /* @__PURE__ */ React11.createElement(HugeiconsIcon7, { icon: Calendar01Icon, size: 16, className: "text-stone-400 absolute left-0" }), /* @__PURE__ */ React11.createElement("span", { className: "w-full pl-8 text-sm text-black truncate block" }, huddleDate.toLocaleDateString("en-GB", { day: "2-digit", month: "short", year: "numeric" }))), enableEdits && /* @__PURE__ */ React11.createElement("button", { onClick: () => setCalendarMode("DATE"), className: "text-xs text-[#d97757] hover:underline outline-none" }, "Edit"))), /* @__PURE__ */ React11.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ React11.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Time"), /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center relative w-full border-b border-transparent pb-3 pt-3" }, /* @__PURE__ */ React11.createElement(HugeiconsIcon7, { icon: Clock01Icon, size: 16, className: "text-stone-400 absolute left-0" }), /* @__PURE__ */ React11.createElement("span", { className: "w-full pl-8 text-sm text-black truncate block" }, huddleDate.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }))), enableEdits && /* @__PURE__ */ React11.createElement("button", { onClick: () => setCalendarMode("TIME"), className: "text-xs text-[#d97757] hover:underline outline-none" }, "Edit"))), /* @__PURE__ */ React11.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ React11.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Timezone"), /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center relative w-full border-b border-transparent pb-3 pt-3" }, /* @__PURE__ */ React11.createElement(HugeiconsIcon7, { icon: Globe02Icon, size: 16, className: "text-stone-400 absolute left-0" }), /* @__PURE__ */ React11.createElement("span", { className: "w-full pl-8 text-sm text-black truncate block" }, timezone)), enableEdits && /* @__PURE__ */ React11.createElement("button", { onClick: () => setShowTimezoneModal(true), className: "text-xs text-[#d97757] hover:underline outline-none" }, "Edit")))), /* @__PURE__ */ React11.createElement("div", { className: "flex items-center justify-between py-2 mt-2" }, /* @__PURE__ */ React11.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React11.createElement("span", { className: "text-sm text-black tracking-tight" }, "Private Huddle"), /* @__PURE__ */ React11.createElement("span", { className: "text-xs text-stone-500" }, "Only invited members can join.")), /* @__PURE__ */ React11.createElement(
|
|
957
976
|
"button",
|
|
958
977
|
{
|
|
959
978
|
type: "button",
|
|
@@ -964,10 +983,10 @@ var UniversalHuddleDetails = ({
|
|
|
964
983
|
}
|
|
965
984
|
},
|
|
966
985
|
disabled: !enableEdits,
|
|
967
|
-
className: `relative w-11 h-6 rounded-full transition-colors outline-none shrink-0 ${isPrivate ? "bg-[#
|
|
986
|
+
className: `relative w-11 h-6 rounded-full transition-colors outline-none shrink-0 ${isPrivate ? "bg-[#d97757]" : "bg-stone-200"} ${!enableEdits && "opacity-50 cursor-not-allowed"}`
|
|
968
987
|
},
|
|
969
988
|
/* @__PURE__ */ React11.createElement("div", { className: `absolute top-1 left-1 bg-white w-4 h-4 rounded-full transition-transform ${isPrivate ? "translate-x-5" : "translate-x-0"}` })
|
|
970
|
-
)), isPrivate && /* @__PURE__ */ React11.createElement("div", { className: "flex items-center justify-between animate-in fade-in zoom-in-95 duration-200 bg-
|
|
989
|
+
)), isPrivate && /* @__PURE__ */ React11.createElement("div", { className: "flex items-center justify-between animate-in fade-in zoom-in-95 duration-200 bg-stone-50 p-4 rounded-xl" }, /* @__PURE__ */ React11.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React11.createElement("span", { className: "text-xs text-black tracking-tight" }, "Participants"), /* @__PURE__ */ React11.createElement("span", { className: "text-xs text-[#d97757] " }, selectedParticipants.size, " added")), enableEdits && /* @__PURE__ */ React11.createElement("button", { onClick: () => setShowMembersModal(true), className: "px-4 py-2 border border-stone-200 text-black text-xs tracking-wide rounded-full hover:bg-white transition-colors outline-none bg-transparent" }, "Manage Access")), isDirty && /* @__PURE__ */ React11.createElement("div", { className: "pt-4 animate-in fade-in duration-300" }, /* @__PURE__ */ React11.createElement(ThreeDActionButton, { onClick: handleUpdate, isLoading: isSubmitting, className: "w-full sm:w-auto min-w-40" }, "Save Changes")), /* @__PURE__ */ React11.createElement("div", { className: "flex flex-col sm:flex-row items-center gap-3 pt-6 mt-2 " }, (liveStatus === "SCHEDULED" || liveStatus === "ONGOING") && /* @__PURE__ */ React11.createElement("a", { href: `/app/join/${huddle.id}`, className: "flex-1 w-full py-2.5 bg-transparent border border-[#d97757] text-[#d97757] rounded-full text-center text-xs transition-colors hover:bg-[#d97757]/5" }, "Join Huddle"), /* @__PURE__ */ React11.createElement("a", { href: `/app/assets/${huddle.id}`, className: "flex-1 w-full py-2.5 bg-transparent border border-stone-200 text-black rounded-full text-center text-xs transition-colors hover:bg-stone-50" }, "Huddle Assets"), canDelete && liveStatus === "SCHEDULED" && /* @__PURE__ */ React11.createElement("button", { onClick: () => setConfirmDialog("CANCEL"), className: "flex-1 w-full py-2.5 bg-transparent border border-rose-200 text-rose-600 rounded-full text-center text-xs transition-colors hover:bg-rose-50" }, "Cancel Huddle"), canDelete && liveStatus !== "SCHEDULED" && /* @__PURE__ */ React11.createElement("button", { onClick: () => setConfirmDialog("DELETE"), className: "flex-1 w-full py-2.5 bg-transparent border border-rose-200 text-rose-600 rounded-full text-center text-xs transition-colors hover:bg-rose-50" }, "Delete Huddle"))), /* @__PURE__ */ React11.createElement(
|
|
971
990
|
CalendarPicker,
|
|
972
991
|
{
|
|
973
992
|
isOpen: calendarMode !== null,
|
|
@@ -993,10 +1012,10 @@ var UniversalHuddleDetails = ({
|
|
|
993
1012
|
},
|
|
994
1013
|
showSearch: true
|
|
995
1014
|
}
|
|
996
|
-
), showMembersModal && /* @__PURE__ */ React11.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React11.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowMembersModal(false) }), /* @__PURE__ */ React11.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 h-[80vh]" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React11.createElement("h3", { className: "text-
|
|
1015
|
+
), showMembersModal && /* @__PURE__ */ React11.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React11.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowMembersModal(false) }), /* @__PURE__ */ React11.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 h-[80vh]" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React11.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Manage Participants"), /* @__PURE__ */ React11.createElement("button", { onClick: () => setShowMembersModal(false), className: "text-[#d97757] hover:text-[#d97757] transition-colors outline-none text-sm " }, "Done")), /* @__PURE__ */ React11.createElement("div", { className: "p-4 shrink-0 " }, /* @__PURE__ */ React11.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React11.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React11.createElement(HugeiconsIcon7, { icon: Search01Icon2, size: 16, className: "text-stone-400" })), /* @__PURE__ */ React11.createElement("input", { type: "text", placeholder: "Search team...", value: localSearchQuery, onChange: handleSearchInput, className: "w-full pl-10 pr-4 py-2.5 bg-stone-100 rounded-full text-sm text-black placeholder-stone-400 outline-none focus:bg-stone-200 transition-colors" }))), /* @__PURE__ */ React11.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2 relative" }, isMembersLoading || isTyping ? /* @__PURE__ */ React11.createElement("div", { className: "absolute inset-0 flex items-center justify-center" }, /* @__PURE__ */ React11.createElement(HugeiconsIcon7, { icon: Loading03Icon4, size: 28, className: "animate-spin text-black" })) : members.length === 0 ? /* @__PURE__ */ React11.createElement("div", { className: "p-8 text-center text-xs text-stone-400" }, "No members found.") : members.map((member) => {
|
|
997
1016
|
const isChecked = selectedParticipants.has(member.userId);
|
|
998
|
-
return /* @__PURE__ */ React11.createElement("div", { key: member.id, onClick: () => toggleParticipant(member.userId), className: "flex items-center justify-between p-3 rounded-xl cursor-pointer hover:bg-
|
|
999
|
-
})), /* @__PURE__ */ React11.createElement("div", { className: "p-4 flex items-center justify-between shrink-0 bg-white" }, /* @__PURE__ */ React11.createElement("span", { className: "text-
|
|
1017
|
+
return /* @__PURE__ */ React11.createElement("div", { key: member.id, onClick: () => toggleParticipant(member.userId), className: "flex items-center justify-between p-3 rounded-xl cursor-pointer hover:bg-stone-50 transition-colors select-none" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3 min-w-0 flex-1" }, /* @__PURE__ */ React11.createElement(MemberAvatar, { src: member.avatarUrl, sizeClass: "w-9 h-9" }), /* @__PURE__ */ React11.createElement("div", { className: "flex flex-col min-w-0 flex-1" }, /* @__PURE__ */ React11.createElement("span", { className: "text-sm text-black truncate" }, member.fullName), /* @__PURE__ */ React11.createElement("span", { className: "text-xs text-stone-400 capitalize truncate" }, member.role.toLowerCase()))), /* @__PURE__ */ React11.createElement("div", { className: "shrink-0 pl-3" }, /* @__PURE__ */ React11.createElement("div", { className: `w-5 h-5 rounded-full flex items-center justify-center transition-colors ${isChecked ? "bg-[#d97757]" : "border border-stone-300 bg-white"}` }, isChecked && /* @__PURE__ */ React11.createElement(HugeiconsIcon7, { icon: Tick02Icon, size: 14, className: "text-white" }))));
|
|
1018
|
+
})), /* @__PURE__ */ React11.createElement("div", { className: "p-4 flex items-center justify-between shrink-0 bg-white" }, /* @__PURE__ */ React11.createElement("span", { className: "text-xs text-stone-400 tracking-widest" }, "Page ", membersCurrentPage, " of ", membersTotalPages === 0 ? 1 : membersTotalPages), /* @__PURE__ */ React11.createElement("div", { className: "flex gap-1" }, /* @__PURE__ */ React11.createElement("button", { disabled: membersCurrentPage <= 1 || isMembersLoading, onClick: () => onMembersPageChange(membersCurrentPage - 1), className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors" }, /* @__PURE__ */ React11.createElement(HugeiconsIcon7, { icon: ArrowLeft01Icon2, size: 12 })), /* @__PURE__ */ React11.createElement("button", { disabled: membersCurrentPage >= membersTotalPages || membersTotalPages === 0 || isMembersLoading, onClick: () => onMembersPageChange(membersCurrentPage + 1), className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors" }, /* @__PURE__ */ React11.createElement(HugeiconsIcon7, { icon: ArrowRight01Icon2, size: 12 })))))));
|
|
1000
1019
|
};
|
|
1001
1020
|
|
|
1002
1021
|
// src/components/MobileNav.tsx
|
|
@@ -1019,7 +1038,7 @@ var MobileNav = ({ items }) => {
|
|
|
1019
1038
|
href: item.href,
|
|
1020
1039
|
className: "flex flex-col items-center justify-center gap-1 min-w-14 transition-transform active:scale-95 outline-none"
|
|
1021
1040
|
},
|
|
1022
|
-
/* @__PURE__ */ React12.createElement("div", { className: `transition-colors duration-300 ${isActive ? "text-black" : "text-
|
|
1041
|
+
/* @__PURE__ */ React12.createElement("div", { className: `transition-colors duration-300 ${isActive ? "text-black" : "text-stone-400 hover:text-stone-600"}` }, /* @__PURE__ */ React12.createElement(
|
|
1023
1042
|
HugeiconsIcon8,
|
|
1024
1043
|
{
|
|
1025
1044
|
icon: item.icon,
|
|
@@ -1029,7 +1048,7 @@ var MobileNav = ({ items }) => {
|
|
|
1029
1048
|
/* @__PURE__ */ React12.createElement(
|
|
1030
1049
|
"span",
|
|
1031
1050
|
{
|
|
1032
|
-
className: `text-
|
|
1051
|
+
className: `text-xs tracking-wide transition-colors duration-300 ${isActive ? "text-black" : "text-stone-400"}`
|
|
1033
1052
|
},
|
|
1034
1053
|
item.label
|
|
1035
1054
|
)
|
|
@@ -1053,7 +1072,7 @@ var TextInput = ({
|
|
|
1053
1072
|
readOnly,
|
|
1054
1073
|
type = "text",
|
|
1055
1074
|
onClick
|
|
1056
|
-
}) => /* @__PURE__ */ React13.createElement("div", { className: "space-y-2 flex-1 w-full", onClick }, label && /* @__PURE__ */ React13.createElement("label", { className: "text-
|
|
1075
|
+
}) => /* @__PURE__ */ React13.createElement("div", { className: "space-y-2 flex-1 w-full", onClick }, label && /* @__PURE__ */ React13.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, label), /* @__PURE__ */ React13.createElement(
|
|
1057
1076
|
"input",
|
|
1058
1077
|
{
|
|
1059
1078
|
type,
|
|
@@ -1064,7 +1083,7 @@ var TextInput = ({
|
|
|
1064
1083
|
readOnly,
|
|
1065
1084
|
autoComplete: "off",
|
|
1066
1085
|
spellCheck: "false",
|
|
1067
|
-
className: `w-full px-2 py-3 text-sm bg-transparent border-b border-
|
|
1086
|
+
className: `w-full px-2 py-3 text-sm bg-transparent border-b border-stone-200 text-black transition-all outline-none focus:border-black disabled:opacity-50 ${readOnly ? "cursor-pointer" : ""}`
|
|
1068
1087
|
}
|
|
1069
1088
|
));
|
|
1070
1089
|
var NumberInput = ({
|
|
@@ -1074,7 +1093,7 @@ var NumberInput = ({
|
|
|
1074
1093
|
placeholder,
|
|
1075
1094
|
maxLength,
|
|
1076
1095
|
disabled
|
|
1077
|
-
}) => /* @__PURE__ */ React13.createElement("div", { className: "space-y-2 flex-1 w-full" }, label && /* @__PURE__ */ React13.createElement("label", { className: "text-
|
|
1096
|
+
}) => /* @__PURE__ */ React13.createElement("div", { className: "space-y-2 flex-1 w-full" }, label && /* @__PURE__ */ React13.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, label), /* @__PURE__ */ React13.createElement(
|
|
1078
1097
|
"input",
|
|
1079
1098
|
{
|
|
1080
1099
|
type: "text",
|
|
@@ -1087,7 +1106,7 @@ var NumberInput = ({
|
|
|
1087
1106
|
disabled,
|
|
1088
1107
|
autoComplete: "off",
|
|
1089
1108
|
spellCheck: "false",
|
|
1090
|
-
className: "w-full px-2 py-3 text-sm bg-transparent border-b border-
|
|
1109
|
+
className: "w-full px-2 py-3 text-sm bg-transparent border-b border-stone-200 text-black transition-all outline-none focus:border-black disabled:opacity-50"
|
|
1091
1110
|
}
|
|
1092
1111
|
));
|
|
1093
1112
|
|
|
@@ -1122,7 +1141,7 @@ var Banner = ({
|
|
|
1122
1141
|
titleColor: "text-[#143731]",
|
|
1123
1142
|
msgColor: "text-[#143731]",
|
|
1124
1143
|
defaultIcon: CheckmarkBadge01Icon,
|
|
1125
|
-
closeHover: "hover:bg-
|
|
1144
|
+
closeHover: "hover:bg-stone-50 text-stone-500"
|
|
1126
1145
|
},
|
|
1127
1146
|
warning: {
|
|
1128
1147
|
bg: "bg-[#ceff8a22]",
|
|
@@ -1130,7 +1149,7 @@ var Banner = ({
|
|
|
1130
1149
|
titleColor: "text-[#143731]",
|
|
1131
1150
|
msgColor: "text-[#143731]",
|
|
1132
1151
|
defaultIcon: InformationCircleIcon,
|
|
1133
|
-
closeHover: "hover:bg-
|
|
1152
|
+
closeHover: "hover:bg-stone-50 text-stone-500"
|
|
1134
1153
|
},
|
|
1135
1154
|
alert: {
|
|
1136
1155
|
bg: "bg-[#ff6b6b22]",
|
|
@@ -1138,11 +1157,11 @@ var Banner = ({
|
|
|
1138
1157
|
titleColor: "text-[#143731]",
|
|
1139
1158
|
msgColor: "text-[#143731]",
|
|
1140
1159
|
defaultIcon: Alert02Icon,
|
|
1141
|
-
closeHover: "hover:bg-
|
|
1160
|
+
closeHover: "hover:bg-stone-50 text-stone-500"
|
|
1142
1161
|
}
|
|
1143
1162
|
};
|
|
1144
1163
|
const currentConfig = config[type];
|
|
1145
|
-
return /* @__PURE__ */ React14.createElement("div", { className: `relative w-full rounded-2xl p-4 flex items-start gap-4 transition-all duration-300 animate-in fade-in slide-in-from-top-2 ${currentConfig.bg}` }, /* @__PURE__ */ React14.createElement("div", { className: "flex-1 flex flex-col min-w-0" }, /* @__PURE__ */ React14.createElement("h4", { className: `text-
|
|
1164
|
+
return /* @__PURE__ */ React14.createElement("div", { className: `relative w-full rounded-2xl p-4 flex items-start gap-4 transition-all duration-300 animate-in fade-in slide-in-from-top-2 ${currentConfig.bg}` }, /* @__PURE__ */ React14.createElement("div", { className: "flex-1 flex flex-col min-w-0" }, /* @__PURE__ */ React14.createElement("h4", { className: `text-xs tracking-tight mb-1 ${currentConfig.titleColor}` }, title), /* @__PURE__ */ React14.createElement("p", { className: `text-sm leading-relaxed ${currentConfig.msgColor}` }, message), action && /* @__PURE__ */ React14.createElement("div", { className: "mt-3" }, action)), isDismissible && /* @__PURE__ */ React14.createElement(
|
|
1146
1165
|
"button",
|
|
1147
1166
|
{
|
|
1148
1167
|
onClick: handleDismiss,
|
|
@@ -1158,7 +1177,7 @@ import {
|
|
|
1158
1177
|
ArrowLeft01Icon as ArrowLeft01Icon3,
|
|
1159
1178
|
CircleLock02Icon
|
|
1160
1179
|
} from "@hugeicons/core-free-icons";
|
|
1161
|
-
var InputSpinner2 = () => /* @__PURE__ */ React15.createElement("svg", { className: "animate-spin h-4 w-4 text-
|
|
1180
|
+
var InputSpinner2 = () => /* @__PURE__ */ React15.createElement("svg", { className: "animate-spin h-4 w-4 text-stone-400", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, /* @__PURE__ */ React15.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ React15.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" }));
|
|
1162
1181
|
var UniversalOrganizationPage = ({
|
|
1163
1182
|
initialOrgName,
|
|
1164
1183
|
initialSlug,
|
|
@@ -1254,11 +1273,11 @@ var UniversalOrganizationPage = ({
|
|
|
1254
1273
|
"button",
|
|
1255
1274
|
{
|
|
1256
1275
|
onClick: onBackHandler,
|
|
1257
|
-
className: "flex items-center gap-2 text-
|
|
1276
|
+
className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none"
|
|
1258
1277
|
},
|
|
1259
1278
|
/* @__PURE__ */ React15.createElement(HugeiconsIcon10, { icon: ArrowLeft01Icon3, size: 16 }),
|
|
1260
1279
|
" Back"
|
|
1261
|
-
)), /* @__PURE__ */ React15.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl w-full mx-auto rounded-2xl p-6 bg-white fade-in duration-300" }, /* @__PURE__ */ React15.createElement(ManagedToaster, null), /* @__PURE__ */ React15.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, "Public Profile"), /* @__PURE__ */ React15.createElement("p", { className: "text-xs text-
|
|
1280
|
+
)), /* @__PURE__ */ React15.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl w-full mx-auto rounded-2xl p-6 bg-white fade-in duration-300" }, /* @__PURE__ */ React15.createElement(ManagedToaster, null), /* @__PURE__ */ React15.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, "Public Profile"), /* @__PURE__ */ React15.createElement("p", { className: "text-xs text-stone-500" }, "Manage your financial payment handle identifiers and global public cryptographic signature identity details.")), isReadOnly && /* @__PURE__ */ React15.createElement("span", { className: "p-2 w-9 h-9 bg-stone-100 text-stone-400 rounded-full shrink-0" }, /* @__PURE__ */ React15.createElement(HugeiconsIcon10, { icon: CircleLock02Icon, size: 18, className: "text-current" }))), bannerProps && /* @__PURE__ */ React15.createElement(Banner, { ...bannerProps }), /* @__PURE__ */ React15.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ React15.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ React15.createElement(
|
|
1262
1281
|
TextInput,
|
|
1263
1282
|
{
|
|
1264
1283
|
label: "Display Name",
|
|
@@ -1278,7 +1297,7 @@ var UniversalOrganizationPage = ({
|
|
|
1278
1297
|
placeholder: "sovereignuser",
|
|
1279
1298
|
maxLength: 30
|
|
1280
1299
|
}
|
|
1281
|
-
), /* @__PURE__ */ React15.createElement("div", { className: "space-y-1.5 relative w-full" }, /* @__PURE__ */ React15.createElement("label", { className: "text-
|
|
1300
|
+
), /* @__PURE__ */ React15.createElement("div", { className: "space-y-1.5 relative w-full" }, /* @__PURE__ */ React15.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Wallet Username"), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center relative w-full border-b border-stone-200 focus-within:border-black transition-all duration-300" }, /* @__PURE__ */ React15.createElement(
|
|
1282
1301
|
"input",
|
|
1283
1302
|
{
|
|
1284
1303
|
type: "text",
|
|
@@ -1290,7 +1309,7 @@ var UniversalOrganizationPage = ({
|
|
|
1290
1309
|
className: "w-full px-2 py-3 text-sm bg-transparent text-black outline-none disabled:opacity-50 disabled:cursor-not-allowed",
|
|
1291
1310
|
placeholder: "sovereign-user-handle"
|
|
1292
1311
|
}
|
|
1293
|
-
), /* @__PURE__ */ React15.createElement("span", { className: "text-
|
|
1312
|
+
), /* @__PURE__ */ React15.createElement("span", { className: "text-stone-400 text-sm py-3 pr-8 shrink-0 whitespace-nowrap" }, slugPrefixUrl), /* @__PURE__ */ React15.createElement("div", { className: "absolute right-2 top-1/2 -translate-y-1/2" }, isCheckingSlug && /* @__PURE__ */ React15.createElement(InputSpinner2, null), !isCheckingSlug && !isReadOnly && slug !== initialSlug && slug.length >= 3 && slugAvailable === false && /* @__PURE__ */ React15.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-red-100" }, /* @__PURE__ */ React15.createElement("svg", { className: "w-2 h-2 text-red-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ React15.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" }))), !isCheckingSlug && !isReadOnly && slug !== initialSlug && slug.length >= 3 && slugAvailable === true && /* @__PURE__ */ React15.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-green-100" }, /* @__PURE__ */ React15.createElement("svg", { className: "w-2 h-2 text-green-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ React15.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M16.707 5.293a1 1 0 00-1.414 0L8 12.586 4.707 9.293a1 1 0 10-1.414 1.414l4 4a1 1 0 001.414 0l8-8a1 1 0 000-1.414z" })))))), /* @__PURE__ */ React15.createElement("div", { className: "pt-8 mt-2 flex items-center gap-4" }, /* @__PURE__ */ React15.createElement(
|
|
1294
1313
|
ThreeDActionButton,
|
|
1295
1314
|
{
|
|
1296
1315
|
type: "submit",
|
|
@@ -1308,7 +1327,7 @@ var UniversalOrganizationPage = ({
|
|
|
1308
1327
|
setSlug(initialSlug);
|
|
1309
1328
|
setUsername(resolvedInitialUsername);
|
|
1310
1329
|
},
|
|
1311
|
-
className: "text-
|
|
1330
|
+
className: "text-xs tracking-widest text-stone-400 hover:text-black transition-colors outline-none"
|
|
1312
1331
|
},
|
|
1313
1332
|
"Cancel"
|
|
1314
1333
|
))))));
|
|
@@ -1420,11 +1439,11 @@ var UniversalProfileSettings = ({
|
|
|
1420
1439
|
"button",
|
|
1421
1440
|
{
|
|
1422
1441
|
onClick: onBackHandler,
|
|
1423
|
-
className: "flex items-center gap-2 text-
|
|
1442
|
+
className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none"
|
|
1424
1443
|
},
|
|
1425
1444
|
/* @__PURE__ */ React16.createElement(HugeiconsIcon11, { icon: ArrowLeft01Icon4, size: 16 }),
|
|
1426
1445
|
" Back"
|
|
1427
|
-
)), /* @__PURE__ */ React16.createElement("div", { className: "flex flex-col max-w-3xl w-full mx-auto rounded-2xl p-6 bg-white gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ React16.createElement(ManagedToaster, null), /* @__PURE__ */ React16.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ React16.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React16.createElement("h1", { className: "text-black text-xl mb-1 truncate tracking-tight" }, "Personal Settings"), /* @__PURE__ */ React16.createElement("p", { className: "text-xs text-
|
|
1446
|
+
)), /* @__PURE__ */ React16.createElement("div", { className: "flex flex-col max-w-3xl w-full mx-auto rounded-2xl p-6 bg-white gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ React16.createElement(ManagedToaster, null), /* @__PURE__ */ React16.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ React16.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React16.createElement("h1", { className: "text-black text-xl mb-1 truncate tracking-tight" }, "Personal Settings"), /* @__PURE__ */ React16.createElement("p", { className: "text-xs text-stone-500 truncate" }, "Manage your personal account profile.")), isReadOnly && /* @__PURE__ */ React16.createElement("span", { className: "p-2 w-9 h-9 bg-stone-100 text-stone-400 rounded-full shrink-0" }, /* @__PURE__ */ React16.createElement(HugeiconsIcon11, { icon: CircleLock02Icon2, size: 18, className: "text-current" }))), bannerProps && /* @__PURE__ */ React16.createElement(Banner, { ...bannerProps }), /* @__PURE__ */ React16.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ React16.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ React16.createElement("div", { className: "flex flex-col sm:flex-row gap-6" }, /* @__PURE__ */ React16.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React16.createElement(
|
|
1428
1447
|
TextInput,
|
|
1429
1448
|
{
|
|
1430
1449
|
label: "First Name",
|
|
@@ -1451,12 +1470,12 @@ var UniversalProfileSettings = ({
|
|
|
1451
1470
|
},
|
|
1452
1471
|
disabled: true
|
|
1453
1472
|
}
|
|
1454
|
-
), /* @__PURE__ */ React16.createElement("p", { className: "text-
|
|
1473
|
+
), /* @__PURE__ */ React16.createElement("p", { className: "text-xs text-stone-500 mt-1 truncate" }, "To change your primary number, please contact support.")), /* @__PURE__ */ React16.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between pt-8 mt-2 gap-6 sm:gap-4" }, /* @__PURE__ */ React16.createElement("div", { className: "flex items-center gap-6 min-w-0" }, /* @__PURE__ */ React16.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React16.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em] block truncate" }, "Account Status"), /* @__PURE__ */ React16.createElement("span", { className: "text-xs text-black block truncate" }, accountStatus)), /* @__PURE__ */ React16.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React16.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em] block truncate" }, "Member Since"), /* @__PURE__ */ React16.createElement("span", { className: "text-xs text-black block truncate" }, memberSince ? new Date(memberSince).toLocaleDateString("en-US", { month: "long", day: "numeric", year: "numeric" }) : "N/A")), /* @__PURE__ */ React16.createElement("div", { className: "min-w-0 pl-4" }, /* @__PURE__ */ React16.createElement(
|
|
1455
1474
|
"button",
|
|
1456
1475
|
{
|
|
1457
1476
|
type: "button",
|
|
1458
1477
|
onClick: () => setIsPasscodeModalOpen(true),
|
|
1459
|
-
className: "w-9 h-9 flex items-center justify-center border border-
|
|
1478
|
+
className: "w-9 h-9 flex items-center justify-center border border-stone-200 rounded-full text-black hover:bg-stone-50 transition-colors outline-none"
|
|
1460
1479
|
},
|
|
1461
1480
|
/* @__PURE__ */ React16.createElement(HugeiconsIcon11, { icon: LockKeyIcon, size: 17, className: "text-black" })
|
|
1462
1481
|
))), /* @__PURE__ */ React16.createElement("div", { className: "flex flex-col-reverse sm:flex-row items-center gap-3 sm:gap-4 w-full sm:w-auto shrink-0" }, hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */ React16.createElement(
|
|
@@ -1467,7 +1486,7 @@ var UniversalProfileSettings = ({
|
|
|
1467
1486
|
setFirstName(initialFirstName);
|
|
1468
1487
|
setLastName(initialLastName);
|
|
1469
1488
|
},
|
|
1470
|
-
className: "text-
|
|
1489
|
+
className: "text-xs tracking-widest text-stone-400 hover:text-black transition-colors w-full sm:w-auto py-2 sm:py-0 outline-none"
|
|
1471
1490
|
},
|
|
1472
1491
|
"Cancel"
|
|
1473
1492
|
), /* @__PURE__ */ React16.createElement(
|
|
@@ -1479,7 +1498,7 @@ var UniversalProfileSettings = ({
|
|
|
1479
1498
|
className: "min-w-32 w-full sm:w-auto"
|
|
1480
1499
|
},
|
|
1481
1500
|
"Save Changes"
|
|
1482
|
-
))))), isPasscodeModalOpen && /* @__PURE__ */ React16.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React16.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: closePasscodeModal }), /* @__PURE__ */ React16.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React16.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React16.createElement("h3", { className: "text-
|
|
1501
|
+
))))), isPasscodeModalOpen && /* @__PURE__ */ React16.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React16.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: closePasscodeModal }), /* @__PURE__ */ React16.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React16.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React16.createElement("h3", { className: "text-sm text-black tracking-tight" }, hasPasscode ? "Change Passcode" : "Create Security Passcode"), /* @__PURE__ */ React16.createElement("button", { onClick: closePasscodeModal, disabled: isPasscodeSubmitting, className: "text-stone-400 hover:text-black transition-colors outline-none disabled:opacity-50" }, /* @__PURE__ */ React16.createElement(HugeiconsIcon11, { icon: CancelCircleIcon3, size: 18 }))), /* @__PURE__ */ React16.createElement("div", { className: "p-6" }, isPasscodeLoading ? /* @__PURE__ */ React16.createElement("div", { className: "flex flex-col items-center justify-center py-10" }, /* @__PURE__ */ React16.createElement(HugeiconsIcon11, { icon: Loading03Icon5, size: 28, className: "animate-spin text-stone-400 mb-4" })) : /* @__PURE__ */ React16.createElement("form", { onSubmit: handlePasscodeSubmit, className: "flex flex-col gap-6" }, hasPasscode && /* @__PURE__ */ React16.createElement(
|
|
1483
1502
|
TextInput,
|
|
1484
1503
|
{
|
|
1485
1504
|
type: "password",
|
|
@@ -1545,7 +1564,7 @@ var PageSpinner = ({
|
|
|
1545
1564
|
{
|
|
1546
1565
|
icon: Loading03Icon6,
|
|
1547
1566
|
size,
|
|
1548
|
-
className: `animate-spin text-[#
|
|
1567
|
+
className: `animate-spin text-[#d97757] mb-4 ${iconClassName}`
|
|
1549
1568
|
}
|
|
1550
1569
|
))
|
|
1551
1570
|
);
|
|
@@ -1582,11 +1601,11 @@ var UniversalErrorView = ({
|
|
|
1582
1601
|
title = "Access Restricted";
|
|
1583
1602
|
description = apiMessage || `You have insufficient permissions to view this ${envName}. Please contact your administrator.`;
|
|
1584
1603
|
}
|
|
1585
|
-
return /* @__PURE__ */ React18.createElement("div", { className: "flex flex-col items-center justify-center h-screen w-full px-4 animate-in fade-in duration-500" }, /* @__PURE__ */ React18.createElement("div", { className: "mb-4 flex justify-center" }, /* @__PURE__ */ React18.createElement(HugeiconsIcon13, { icon: IconComponent, size: 48, className: "text-
|
|
1604
|
+
return /* @__PURE__ */ React18.createElement("div", { className: "flex flex-col items-center justify-center h-screen w-full px-4 animate-in fade-in duration-500" }, /* @__PURE__ */ React18.createElement("div", { className: "mb-4 flex justify-center" }, /* @__PURE__ */ React18.createElement(HugeiconsIcon13, { icon: IconComponent, size: 48, className: "text-stone-300" })), /* @__PURE__ */ React18.createElement("h2", { className: "text-lg text-black tracking-tight " }, title), /* @__PURE__ */ React18.createElement("p", { className: "text-xs mt-2 mb-8 text-stone-500 max-w-sm text-center leading-relaxed" }, description), /* @__PURE__ */ React18.createElement("div", { className: "flex flex-col sm:flex-row items-center gap-3 w-full justify-center sm:w-auto" }, isNotFoundError || isPermissionError ? /* @__PURE__ */ React18.createElement(
|
|
1586
1605
|
"button",
|
|
1587
1606
|
{
|
|
1588
1607
|
onClick: () => window.location.href = returnUrl,
|
|
1589
|
-
className: "px-6 py-2 text-black border border-
|
|
1608
|
+
className: "px-6 py-2 text-black border border-stone-200 hover:bg-stone-50 rounded-full text-xs tracking-widest transition-colors w-full sm:w-auto outline-none "
|
|
1590
1609
|
},
|
|
1591
1610
|
returnLabel
|
|
1592
1611
|
) : (
|
|
@@ -1595,14 +1614,14 @@ var UniversalErrorView = ({
|
|
|
1595
1614
|
"button",
|
|
1596
1615
|
{
|
|
1597
1616
|
onClick: () => window.location.href = returnUrl,
|
|
1598
|
-
className: "px-6 py-2 bg-transparent border border-
|
|
1617
|
+
className: "px-6 py-2 bg-transparent border border-stone-200 text-stone-500 hover:text-black hover:bg-stone-50 rounded-full text-xs tracking-widest transition-colors w-full sm:w-auto outline-none "
|
|
1599
1618
|
},
|
|
1600
1619
|
"Back Home"
|
|
1601
1620
|
), /* @__PURE__ */ React18.createElement(
|
|
1602
1621
|
"button",
|
|
1603
1622
|
{
|
|
1604
1623
|
onClick: onRetry,
|
|
1605
|
-
className: "px-6 py-2 bg-black text-white hover:bg-
|
|
1624
|
+
className: "px-6 py-2 bg-black text-white hover:bg-stone-800 rounded-full text-xs tracking-widest transition-colors w-full sm:w-auto outline-none capitalize "
|
|
1606
1625
|
},
|
|
1607
1626
|
"Refresh ",
|
|
1608
1627
|
envName
|
|
@@ -1651,7 +1670,7 @@ var getStatusClasses = (status) => {
|
|
|
1651
1670
|
case "REVERSED":
|
|
1652
1671
|
return "text-sky-700 bg-sky-100";
|
|
1653
1672
|
default:
|
|
1654
|
-
return "text-
|
|
1673
|
+
return "text-stone-500 bg-stone-50";
|
|
1655
1674
|
}
|
|
1656
1675
|
};
|
|
1657
1676
|
var UniversalTransactionPage = ({
|
|
@@ -1728,44 +1747,44 @@ var UniversalTransactionPage = ({
|
|
|
1728
1747
|
}
|
|
1729
1748
|
};
|
|
1730
1749
|
const isListLoading = isLoading || isTyping;
|
|
1731
|
-
return /* @__PURE__ */ React19.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React19.createElement(ManagedToaster, null), !hideControls && /* @__PURE__ */ React19.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full" }, /* @__PURE__ */ React19.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ React19.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React19.createElement(HugeiconsIcon14, { icon: Search01Icon3, size: 16, className: "text-
|
|
1750
|
+
return /* @__PURE__ */ React19.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React19.createElement(ManagedToaster, null), !hideControls && /* @__PURE__ */ React19.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full" }, /* @__PURE__ */ React19.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ React19.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React19.createElement(HugeiconsIcon14, { icon: Search01Icon3, size: 16, className: "text-stone-400" })), /* @__PURE__ */ React19.createElement(
|
|
1732
1751
|
"input",
|
|
1733
1752
|
{
|
|
1734
1753
|
type: "text",
|
|
1735
1754
|
placeholder: "Search reference or amount...",
|
|
1736
1755
|
value: localSearchQuery,
|
|
1737
1756
|
onChange: (e) => setLocalSearchQuery(e.target.value),
|
|
1738
|
-
className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-
|
|
1757
|
+
className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-sm text-black placeholder-stone-400 outline-none transition-colors focus:border-black"
|
|
1739
1758
|
}
|
|
1740
1759
|
)), /* @__PURE__ */ React19.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ React19.createElement(
|
|
1741
1760
|
"button",
|
|
1742
1761
|
{
|
|
1743
1762
|
onClick: () => setIsDirectionModalOpen(true),
|
|
1744
|
-
className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-
|
|
1763
|
+
className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none"
|
|
1745
1764
|
},
|
|
1746
1765
|
/* @__PURE__ */ React19.createElement(HugeiconsIcon14, { icon: SearchList02Icon, size: 16 })
|
|
1747
1766
|
), /* @__PURE__ */ React19.createElement(
|
|
1748
1767
|
"button",
|
|
1749
1768
|
{
|
|
1750
1769
|
onClick: () => setIsTypeModalOpen(true),
|
|
1751
|
-
className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-
|
|
1770
|
+
className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none"
|
|
1752
1771
|
},
|
|
1753
1772
|
/* @__PURE__ */ React19.createElement(HugeiconsIcon14, { icon: ListSettingIcon, size: 16 })
|
|
1754
|
-
))), /* @__PURE__ */ React19.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ React19.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ React19.createElement("div", null, /* @__PURE__ */ React19.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ React19.createElement("p", { className: "text-xs text-
|
|
1773
|
+
))), /* @__PURE__ */ React19.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ React19.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ React19.createElement("div", null, /* @__PURE__ */ React19.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ React19.createElement("p", { className: "text-xs text-stone-500" }, headerDescription))), /* @__PURE__ */ React19.createElement("div", { className: "w-full overflow-hidden" }, isListLoading ? /* @__PURE__ */ React19.createElement(PageSpinner2, null) : /* @__PURE__ */ React19.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React19.createElement("div", null, transactions.length === 0 ? /* @__PURE__ */ React19.createElement("p", { className: "text-xs text-stone-400 py-6 text-center" }, "No transactions found") : transactions.map((tx) => /* @__PURE__ */ React19.createElement(
|
|
1755
1774
|
"div",
|
|
1756
1775
|
{
|
|
1757
1776
|
key: tx.id,
|
|
1758
1777
|
onClick: () => setSelectedTransaction(tx),
|
|
1759
|
-
className: "flex items-center justify-between py-4 hover:bg-
|
|
1778
|
+
className: "flex items-center justify-between py-4 hover:bg-stone-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
|
|
1760
1779
|
},
|
|
1761
|
-
/* @__PURE__ */ React19.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React19.createElement("div", { className: `w-10 h-10 shrink-0 rounded-full flex items-center justify-center border border-
|
|
1762
|
-
/* @__PURE__ */ React19.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React19.createElement("span", { className: "text-
|
|
1763
|
-
))), !hidePagination && /* @__PURE__ */ React19.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ React19.createElement("span", { className: "text-
|
|
1780
|
+
/* @__PURE__ */ React19.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React19.createElement("div", { className: `w-10 h-10 shrink-0 rounded-full flex items-center justify-center border border-stone-200 text-black` }, /* @__PURE__ */ React19.createElement(HugeiconsIcon14, { icon: tx.direction === "CREDIT" ? ArrowDownRight01Icon : ArrowUpRight01Icon, size: 18 })), /* @__PURE__ */ React19.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ React19.createElement("p", { className: "text-sm text-black truncate" }, tx.name), /* @__PURE__ */ React19.createElement("p", { className: `text-xs text-stone-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, tx.amount))),
|
|
1781
|
+
/* @__PURE__ */ React19.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React19.createElement("span", { className: "text-xs text-stone-400" }, formatDate2(tx.createdAt)), /* @__PURE__ */ React19.createElement("span", { className: "text-xs text-stone-400 capitalize" }, tx.direction.toLowerCase()))
|
|
1782
|
+
))), !hidePagination && /* @__PURE__ */ React19.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ React19.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ React19.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React19.createElement(
|
|
1764
1783
|
"button",
|
|
1765
1784
|
{
|
|
1766
1785
|
onClick: () => onPageChange(currentPage - 1),
|
|
1767
1786
|
disabled: currentPage <= 1 || isListLoading,
|
|
1768
|
-
className: "p-2 bg-white border border-
|
|
1787
|
+
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
1769
1788
|
},
|
|
1770
1789
|
/* @__PURE__ */ React19.createElement(HugeiconsIcon14, { icon: ArrowLeft01Icon5, size: 14 })
|
|
1771
1790
|
), /* @__PURE__ */ React19.createElement(
|
|
@@ -1773,21 +1792,21 @@ var UniversalTransactionPage = ({
|
|
|
1773
1792
|
{
|
|
1774
1793
|
onClick: () => onPageChange(currentPage + 1),
|
|
1775
1794
|
disabled: currentPage >= totalPages || isListLoading || totalPages === 0,
|
|
1776
|
-
className: "p-2 bg-white border border-
|
|
1795
|
+
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
1777
1796
|
},
|
|
1778
1797
|
/* @__PURE__ */ React19.createElement(HugeiconsIcon14, { icon: ArrowRight01Icon3, size: 14 })
|
|
1779
|
-
)))))), selectedTransaction && /* @__PURE__ */ React19.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React19.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedTransaction(null) }), /* @__PURE__ */ React19.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ React19.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React19.createElement("h3", { className: "text-
|
|
1798
|
+
)))))), selectedTransaction && /* @__PURE__ */ React19.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React19.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedTransaction(null) }), /* @__PURE__ */ React19.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ React19.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React19.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Details"), /* @__PURE__ */ React19.createElement("button", { onClick: () => setSelectedTransaction(null), className: "text-stone-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React19.createElement(HugeiconsIcon14, { icon: CancelCircleIcon4, size: 18 }))), /* @__PURE__ */ React19.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6" }, /* @__PURE__ */ React19.createElement("div", { className: "flex flex-col items-center justify-center mb-4" }, /* @__PURE__ */ React19.createElement("div", { className: `w-12 h-12 rounded-full flex items-center justify-center mb-4 border border-stone-200 text-black` }, /* @__PURE__ */ React19.createElement(HugeiconsIcon14, { icon: selectedTransaction.direction === "CREDIT" ? ArrowDownRight01Icon : ArrowUpRight01Icon, size: 20 })), /* @__PURE__ */ React19.createElement("p", { className: `text-2xl text-black mb-2 transition-all duration-300 ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedTransaction.amount), /* @__PURE__ */ React19.createElement("span", { className: `text-xs tracking-widest px-4 py-1.5 rounded-full ${getStatusClasses(selectedTransaction.status)}` }, selectedTransaction.status)), /* @__PURE__ */ React19.createElement("div", { className: "grid grid-cols-1 gap-y-8 gap-x-4 mb-10 mt-6" }, /* @__PURE__ */ React19.createElement("div", null, /* @__PURE__ */ React19.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-2" }, "Reference ID"), /* @__PURE__ */ React19.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ React19.createElement("span", { className: "text-sm text-black truncate min-w-0 block" }, truncateReference(selectedTransaction.reference)), /* @__PURE__ */ React19.createElement(
|
|
1780
1799
|
"button",
|
|
1781
1800
|
{
|
|
1782
1801
|
onClick: () => handleCopyReference(selectedTransaction.reference),
|
|
1783
|
-
className: "text-
|
|
1802
|
+
className: "text-stone-400 hover:text-black transition-colors outline-none"
|
|
1784
1803
|
},
|
|
1785
1804
|
/* @__PURE__ */ React19.createElement(HugeiconsIcon14, { icon: Copy01Icon, size: 14 })
|
|
1786
|
-
))), /* @__PURE__ */ React19.createElement("div", null, /* @__PURE__ */ React19.createElement("span", { className: "text-
|
|
1805
|
+
))), /* @__PURE__ */ React19.createElement("div", null, /* @__PURE__ */ React19.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-2" }, "Description"), /* @__PURE__ */ React19.createElement("span", { className: "text-sm text-black" }, selectedTransaction.description)), /* @__PURE__ */ React19.createElement("div", null, /* @__PURE__ */ React19.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-2" }, "Date & Time"), /* @__PURE__ */ React19.createElement("span", { className: "text-sm text-black" }, formatDate2(selectedTransaction.createdAt), " at ", formatTime(selectedTransaction.createdAt))), /* @__PURE__ */ React19.createElement("div", null, /* @__PURE__ */ React19.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-2" }, "Transaction Type"), /* @__PURE__ */ React19.createElement("span", { className: "text-sm text-black capitalize" }, selectedTransaction.type.replace("_", " ").toLowerCase())), /* @__PURE__ */ React19.createElement("div", null, /* @__PURE__ */ React19.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-2" }, "Flow Direction"), /* @__PURE__ */ React19.createElement("span", { className: "text-sm text-black capitalize" }, selectedTransaction.direction.toLowerCase())), selectedTransaction.metadata?.fromAddress && selectedTransaction.metadata?.toAddress && /* @__PURE__ */ React19.createElement("div", null, /* @__PURE__ */ React19.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-2" }, "Transfer Route"), /* @__PURE__ */ React19.createElement("div", { className: "flex items-center gap-2 text-sm text-black" }, /* @__PURE__ */ React19.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.fromAddress))), /* @__PURE__ */ React19.createElement("span", { className: "text-stone-400" }, "\u2192"), /* @__PURE__ */ React19.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.toAddress))))), selectedTransaction.metadata && Object.entries(selectedTransaction.metadata).map(([key, value]) => {
|
|
1787
1806
|
if (key === "fromAddress" || key === "toAddress") return null;
|
|
1788
1807
|
if (value === null || value === void 0 || typeof value === "object") return null;
|
|
1789
1808
|
const formattedKey = key.includes(" ") ? key : key.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase());
|
|
1790
|
-
return /* @__PURE__ */ React19.createElement("div", { key }, /* @__PURE__ */ React19.createElement("span", { className: "text-
|
|
1809
|
+
return /* @__PURE__ */ React19.createElement("div", { key }, /* @__PURE__ */ React19.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-2" }, formattedKey), /* @__PURE__ */ React19.createElement("span", { className: "text-sm text-black break-all" }, String(value)));
|
|
1791
1810
|
})), /* @__PURE__ */ React19.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React19.createElement(
|
|
1792
1811
|
ThreeDActionButton,
|
|
1793
1812
|
{
|
|
@@ -1800,10 +1819,10 @@ var UniversalTransactionPage = ({
|
|
|
1800
1819
|
"button",
|
|
1801
1820
|
{
|
|
1802
1821
|
onClick: () => onReportTransaction && onReportTransaction(selectedTransaction),
|
|
1803
|
-
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-
|
|
1822
|
+
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-stone-200 text-black hover:bg-stone-50 transition-colors outline-none text-xs tracking-wide mt-2"
|
|
1804
1823
|
},
|
|
1805
1824
|
"Report Transaction"
|
|
1806
|
-
))))), isDirectionModalOpen && /* @__PURE__ */ React19.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React19.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setIsDirectionModalOpen(false) }), /* @__PURE__ */ React19.createElement("div", { ref: directionDropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React19.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ React19.createElement("h3", { className: "text-
|
|
1825
|
+
))))), isDirectionModalOpen && /* @__PURE__ */ React19.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React19.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setIsDirectionModalOpen(false) }), /* @__PURE__ */ React19.createElement("div", { ref: directionDropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React19.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ React19.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Payment Type")), /* @__PURE__ */ React19.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 gap-1" }, ["ALL", "CREDIT", "DEBIT"].map((option) => /* @__PURE__ */ React19.createElement(
|
|
1807
1826
|
"button",
|
|
1808
1827
|
{
|
|
1809
1828
|
key: option,
|
|
@@ -1811,17 +1830,17 @@ var UniversalTransactionPage = ({
|
|
|
1811
1830
|
onDirectionFilterChange(option);
|
|
1812
1831
|
setIsDirectionModalOpen(false);
|
|
1813
1832
|
},
|
|
1814
|
-
className: `text-left px-4 py-3 text-
|
|
1833
|
+
className: `text-left px-4 py-3 text-xs tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeDirectionFilter === option ? "bg-stone-100 text-black " : "text-stone-500 hover:bg-stone-50 hover:text-black"}`
|
|
1815
1834
|
},
|
|
1816
1835
|
/* @__PURE__ */ React19.createElement("span", { className: "truncate pr-2" }, option.charAt(0).toUpperCase() + option.slice(1).toLowerCase())
|
|
1817
1836
|
))), /* @__PURE__ */ React19.createElement("div", { className: "w-full flex mt-2 " }, /* @__PURE__ */ React19.createElement(
|
|
1818
1837
|
"button",
|
|
1819
1838
|
{
|
|
1820
1839
|
onClick: () => setIsDirectionModalOpen(false),
|
|
1821
|
-
className: "w-full py-4 text-
|
|
1840
|
+
className: "w-full py-4 text-sm text-stone-500 hover:text-black transition-colors outline-none "
|
|
1822
1841
|
},
|
|
1823
1842
|
"Cancel"
|
|
1824
|
-
)))), isTypeModalOpen && /* @__PURE__ */ React19.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React19.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setIsTypeModalOpen(false) }), /* @__PURE__ */ React19.createElement("div", { ref: typeDropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React19.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ React19.createElement("h3", { className: "text-
|
|
1843
|
+
)))), isTypeModalOpen && /* @__PURE__ */ React19.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React19.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setIsTypeModalOpen(false) }), /* @__PURE__ */ React19.createElement("div", { ref: typeDropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React19.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ React19.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Transactions Type")), /* @__PURE__ */ React19.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 gap-1" }, [
|
|
1825
1844
|
{ label: "All Transactions", value: "ALL" },
|
|
1826
1845
|
{ label: "Wallet Transactions", value: "WALLET_TRANSACTION" },
|
|
1827
1846
|
{ label: "Card Transactions", value: "CARD_TRANSACTION" }
|
|
@@ -1833,14 +1852,14 @@ var UniversalTransactionPage = ({
|
|
|
1833
1852
|
onTypeFilterChange(option.value);
|
|
1834
1853
|
setIsTypeModalOpen(false);
|
|
1835
1854
|
},
|
|
1836
|
-
className: `text-left px-4 py-3 text-
|
|
1855
|
+
className: `text-left px-4 py-3 text-xs tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeTypeFilter === option.value ? "bg-stone-100 text-black " : "text-stone-500 hover:bg-stone-50 hover:text-black"}`
|
|
1837
1856
|
},
|
|
1838
1857
|
/* @__PURE__ */ React19.createElement("span", { className: "truncate pr-2" }, option.label.charAt(0).toUpperCase() + option.label.slice(1).toLowerCase())
|
|
1839
1858
|
))), /* @__PURE__ */ React19.createElement("div", { className: "w-full flex mt-2 " }, /* @__PURE__ */ React19.createElement(
|
|
1840
1859
|
"button",
|
|
1841
1860
|
{
|
|
1842
1861
|
onClick: () => setIsTypeModalOpen(false),
|
|
1843
|
-
className: "w-full py-4 text-
|
|
1862
|
+
className: "w-full py-4 text-sm text-stone-500 hover:text-black transition-colors outline-none "
|
|
1844
1863
|
},
|
|
1845
1864
|
"Cancel"
|
|
1846
1865
|
)))));
|
|
@@ -1880,7 +1899,7 @@ var UniversalHomeView = ({
|
|
|
1880
1899
|
const fallbackAvatarUrl = `/api/avatar/?name=${encodeURIComponent(fullName || " ")}&background=ffffff&color=000000&size=100&font-size=0.33`;
|
|
1881
1900
|
const finalAvatarSrc = avatarSrc || fallbackAvatarUrl;
|
|
1882
1901
|
const hasUnreadNotifs = notifications.some((n) => !n.isRead);
|
|
1883
|
-
return /* @__PURE__ */ React20.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ React20.createElement("div", { className: "flex items-center justify-between w-full pb-4 " }, /* @__PURE__ */ React20.createElement("div", { className: "w-10 h-10 rounded-full bg-white p-0.75 flex items-center justify-center cursor-pointer", onClick: () => router.push("/app/account/me") }, /* @__PURE__ */ React20.createElement("div", { className: "relative w-full h-full rounded-full overflow-hidden bg-
|
|
1902
|
+
return /* @__PURE__ */ React20.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ React20.createElement("div", { className: "flex items-center justify-between w-full pb-4 " }, /* @__PURE__ */ React20.createElement("div", { className: "w-10 h-10 rounded-full bg-white p-0.75 flex items-center justify-center cursor-pointer", onClick: () => router.push("/app/account/me") }, /* @__PURE__ */ React20.createElement("div", { className: "relative w-full h-full rounded-full overflow-hidden bg-stone-100 flex items-center justify-center" }, !isAvatarLoaded && /* @__PURE__ */ React20.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-stone-100" }, /* @__PURE__ */ React20.createElement(HugeiconsIcon15, { icon: Loading03Icon8, size: 16, className: "animate-spin text-black" })), /* @__PURE__ */ React20.createElement(
|
|
1884
1903
|
"img",
|
|
1885
1904
|
{
|
|
1886
1905
|
src: finalAvatarSrc,
|
|
@@ -1895,7 +1914,7 @@ var UniversalHomeView = ({
|
|
|
1895
1914
|
setShowNotifDialog(true);
|
|
1896
1915
|
setSelectedNotif(null);
|
|
1897
1916
|
},
|
|
1898
|
-
className: "relative w-10 h-10 flex items-center justify-center rounded-full bg-white outline-none hover:bg-
|
|
1917
|
+
className: "relative w-10 h-10 flex items-center justify-center rounded-full bg-white outline-none hover:bg-stone-50 transition-colors"
|
|
1899
1918
|
},
|
|
1900
1919
|
/* @__PURE__ */ React20.createElement(HugeiconsIcon15, { icon: Notification01Icon, size: 20, className: "text-black" }),
|
|
1901
1920
|
hasUnreadNotifs && /* @__PURE__ */ React20.createElement("span", { className: "absolute top-2.5 right-2.5 w-2 h-2 bg-red-500 rounded-full border border-white" })
|
|
@@ -1905,7 +1924,7 @@ var UniversalHomeView = ({
|
|
|
1905
1924
|
onClick: buyCryptoAction?.onClick,
|
|
1906
1925
|
className: "bg-[#143731] rounded-2xl p-5 relative overflow-hidden flex flex-col h-32 sm:h-36 cursor-pointer hover:opacity-90 transition-opacity"
|
|
1907
1926
|
},
|
|
1908
|
-
/* @__PURE__ */ React20.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ React20.createElement("p", { className: "text-
|
|
1927
|
+
/* @__PURE__ */ React20.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ React20.createElement("p", { className: "text-sm sm:text-sm text-white leading-tight " }, "Buy", /* @__PURE__ */ React20.createElement("br", null), /* @__PURE__ */ React20.createElement("span", { className: "text-white/70" }, "Crypto")), /* @__PURE__ */ React20.createElement("div", { className: "w-8 h-8 rounded-full bg-white/10 flex items-center justify-center" }, /* @__PURE__ */ React20.createElement(HugeiconsIcon15, { icon: ArrowUpRight01Icon2, size: 16, className: "text-white" }))),
|
|
1909
1928
|
/* @__PURE__ */ React20.createElement(
|
|
1910
1929
|
"img",
|
|
1911
1930
|
{
|
|
@@ -1920,7 +1939,7 @@ var UniversalHomeView = ({
|
|
|
1920
1939
|
onClick: referralAction?.onClick,
|
|
1921
1940
|
className: "bg-[#ceff8a] rounded-2xl p-5 relative overflow-hidden flex flex-col h-32 sm:h-36 cursor-pointer hover:opacity-90 transition-opacity"
|
|
1922
1941
|
},
|
|
1923
|
-
/* @__PURE__ */ React20.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ React20.createElement("p", { className: "text-
|
|
1942
|
+
/* @__PURE__ */ React20.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ React20.createElement("p", { className: "text-sm sm:text-sm text-black leading-tight " }, "My", /* @__PURE__ */ React20.createElement("br", null), /* @__PURE__ */ React20.createElement("span", { className: "text-black/60" }, "Rewards")), /* @__PURE__ */ React20.createElement("div", { className: "w-8 h-8 rounded-full bg-black/5 flex items-center justify-center" }, /* @__PURE__ */ React20.createElement(HugeiconsIcon15, { icon: ArrowRight01Icon4, size: 16, className: "text-black" }))),
|
|
1924
1943
|
/* @__PURE__ */ React20.createElement(
|
|
1925
1944
|
"img",
|
|
1926
1945
|
{
|
|
@@ -1937,7 +1956,7 @@ var UniversalHomeView = ({
|
|
|
1937
1956
|
hideBalanceAmounts: false,
|
|
1938
1957
|
hidePagination: true
|
|
1939
1958
|
}
|
|
1940
|
-
)), showNotifDialog && /* @__PURE__ */ React20.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React20.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowNotifDialog(false) }), /* @__PURE__ */ React20.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 h-[80vh]" }, /* @__PURE__ */ React20.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, selectedNotif ? /* @__PURE__ */ React20.createElement("button", { onClick: () => setSelectedNotif(null), className: "text-
|
|
1959
|
+
)), showNotifDialog && /* @__PURE__ */ React20.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React20.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowNotifDialog(false) }), /* @__PURE__ */ React20.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 h-[80vh]" }, /* @__PURE__ */ React20.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, selectedNotif ? /* @__PURE__ */ React20.createElement("button", { onClick: () => setSelectedNotif(null), className: "text-stone-400 hover:text-black transition-colors outline-none flex items-center gap-2 text-xs tracking-widest " }, /* @__PURE__ */ React20.createElement(HugeiconsIcon15, { icon: ArrowLeft01Icon6, size: 14 }), " Back") : /* @__PURE__ */ React20.createElement("h3", { className: "text-sm text-black tracking-tight flex items-center gap-2" }, "Notifications", isNotifsLoading && /* @__PURE__ */ React20.createElement(HugeiconsIcon15, { icon: Loading03Icon8, size: 14, className: "animate-spin text-stone-400" })), /* @__PURE__ */ React20.createElement("button", { onClick: () => setShowNotifDialog(false), className: "text-stone-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React20.createElement(HugeiconsIcon15, { icon: CancelCircleIcon5, size: 18 }))), /* @__PURE__ */ React20.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2" }, selectedNotif ? /* @__PURE__ */ React20.createElement("div", { className: "p-4 text-left" }, /* @__PURE__ */ React20.createElement("h4", { className: "text-sm text-black mb-1 " }, selectedNotif.title), /* @__PURE__ */ React20.createElement("span", { className: "text-xs text-stone-400 tracking-widest mb-4 block " }, formatNotifDate(selectedNotif.createdAt)), /* @__PURE__ */ React20.createElement("p", { className: "text-xs text-stone-600 leading-relaxed whitespace-pre-wrap" }, selectedNotif.message)) : /* @__PURE__ */ React20.createElement("div", { className: "flex flex-col divide-y divide-stone-50/50" }, notifications?.length === 0 && !isNotifsLoading ? /* @__PURE__ */ React20.createElement("div", { className: "p-8 text-center text-xs text-stone-400" }, "You have no notifications.") : notifications?.map((notif) => /* @__PURE__ */ React20.createElement(
|
|
1941
1960
|
"div",
|
|
1942
1961
|
{
|
|
1943
1962
|
key: notif.id,
|
|
@@ -1945,16 +1964,16 @@ var UniversalHomeView = ({
|
|
|
1945
1964
|
setSelectedNotif(notif);
|
|
1946
1965
|
onNotificationClick?.(notif);
|
|
1947
1966
|
},
|
|
1948
|
-
className: `p-3 flex items-start gap-3 rounded-xl cursor-pointer transition-colors ${isNotifsLoading ? "opacity-50 pointer-events-none" : "hover:bg-
|
|
1967
|
+
className: `p-3 flex items-start gap-3 rounded-xl cursor-pointer transition-colors ${isNotifsLoading ? "opacity-50 pointer-events-none" : "hover:bg-stone-50"}`
|
|
1949
1968
|
},
|
|
1950
1969
|
/* @__PURE__ */ React20.createElement("div", { className: "mt-1.5 shrink-0" }, !notif.isRead ? /* @__PURE__ */ React20.createElement("div", { className: "w-1.5 h-1.5 bg-red-500 rounded-full" }) : /* @__PURE__ */ React20.createElement("div", { className: "w-1.5 h-1.5 bg-transparent" })),
|
|
1951
|
-
/* @__PURE__ */ React20.createElement("div", { className: "flex-1 min-w-0 text-left" }, /* @__PURE__ */ React20.createElement("h5", { className: `text-
|
|
1952
|
-
)))), !selectedNotif && /* @__PURE__ */ React20.createElement("div", { className: "p-4 flex items-center justify-between shrink-0 " }, /* @__PURE__ */ React20.createElement("span", { className: "text-
|
|
1970
|
+
/* @__PURE__ */ React20.createElement("div", { className: "flex-1 min-w-0 text-left" }, /* @__PURE__ */ React20.createElement("h5", { className: `text-xs truncate ${notif.isRead ? "text-stone-500" : "text-black "}` }, notif.title), /* @__PURE__ */ React20.createElement("p", { className: "text-xs text-stone-400 truncate mt-0.5" }, notif.message), /* @__PURE__ */ React20.createElement("span", { className: "text-xs text-stone-400 tracking-widest mt-2 block " }, formatNotifDate(notif.createdAt)))
|
|
1971
|
+
)))), !selectedNotif && /* @__PURE__ */ React20.createElement("div", { className: "p-4 flex items-center justify-between shrink-0 " }, /* @__PURE__ */ React20.createElement("span", { className: "text-xs text-stone-400 tracking-widest " }, "Page ", notificationPage, " of ", notificationTotalPages === 0 ? 1 : notificationTotalPages), /* @__PURE__ */ React20.createElement("div", { className: "flex gap-1" }, /* @__PURE__ */ React20.createElement(
|
|
1953
1972
|
"button",
|
|
1954
1973
|
{
|
|
1955
1974
|
disabled: notificationPage <= 1 || isNotifsLoading,
|
|
1956
1975
|
onClick: () => onNotificationPageChange?.(notificationPage - 1),
|
|
1957
|
-
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-
|
|
1976
|
+
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors"
|
|
1958
1977
|
},
|
|
1959
1978
|
/* @__PURE__ */ React20.createElement(HugeiconsIcon15, { icon: ArrowLeft01Icon6, size: 12 })
|
|
1960
1979
|
), /* @__PURE__ */ React20.createElement(
|
|
@@ -1962,7 +1981,7 @@ var UniversalHomeView = ({
|
|
|
1962
1981
|
{
|
|
1963
1982
|
disabled: notificationPage >= notificationTotalPages || notificationTotalPages === 0 || isNotifsLoading,
|
|
1964
1983
|
onClick: () => onNotificationPageChange?.(notificationPage + 1),
|
|
1965
|
-
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-
|
|
1984
|
+
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors"
|
|
1966
1985
|
},
|
|
1967
1986
|
/* @__PURE__ */ React20.createElement(HugeiconsIcon15, { icon: ArrowRight01Icon4, size: 12 })
|
|
1968
1987
|
))))));
|
|
@@ -1990,7 +2009,7 @@ var truncateAddress2 = (ref) => {
|
|
|
1990
2009
|
};
|
|
1991
2010
|
var WalletLogo = ({ src, alt, sizeClass = "w-10 h-10" }) => {
|
|
1992
2011
|
const [isLoaded, setIsLoaded] = useState14(false);
|
|
1993
|
-
return /* @__PURE__ */ React21.createElement("div", { className: `relative shrink-0 rounded-full bg-
|
|
2012
|
+
return /* @__PURE__ */ React21.createElement("div", { className: `relative shrink-0 rounded-full bg-stone-100 flex items-center justify-center overflow-hidden ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: Loading03Icon9, size: 16, className: "animate-spin text-stone-400 absolute" }), /* @__PURE__ */ React21.createElement("img", { src, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
|
|
1994
2013
|
};
|
|
1995
2014
|
var UniversalWalletPage = ({
|
|
1996
2015
|
headerTitle,
|
|
@@ -2128,16 +2147,16 @@ var UniversalWalletPage = ({
|
|
|
2128
2147
|
setIsProcessing(false);
|
|
2129
2148
|
}
|
|
2130
2149
|
};
|
|
2131
|
-
return /* @__PURE__ */ React21.createElement("div", null, /* @__PURE__ */ React21.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ React21.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-
|
|
2150
|
+
return /* @__PURE__ */ React21.createElement("div", null, /* @__PURE__ */ React21.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ React21.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: ArrowLeft01Icon7, size: 16 }), " Back")), /* @__PURE__ */ React21.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React21.createElement(ManagedToaster, null), !hideControls && /* @__PURE__ */ React21.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full" }, /* @__PURE__ */ React21.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ React21.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: Search01Icon4, size: 16, className: "text-stone-400" })), /* @__PURE__ */ React21.createElement(
|
|
2132
2151
|
"input",
|
|
2133
2152
|
{
|
|
2134
2153
|
type: "text",
|
|
2135
2154
|
placeholder: "Search wallets by name or network...",
|
|
2136
2155
|
value: localSearchQuery,
|
|
2137
2156
|
onChange: (e) => setLocalSearchQuery(e.target.value),
|
|
2138
|
-
className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-
|
|
2157
|
+
className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-sm text-black placeholder-stone-400 outline-none transition-colors focus:border-black"
|
|
2139
2158
|
}
|
|
2140
|
-
)), !external && /* @__PURE__ */ React21.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ React21.createElement("button", { onClick: startWalletGeneration, className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-
|
|
2159
|
+
)), !external && /* @__PURE__ */ React21.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ React21.createElement("button", { onClick: startWalletGeneration, className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: PlusSignIcon, size: 16 })), /* @__PURE__ */ React21.createElement("button", { onClick: startWalletImport, className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: Upload01Icon, size: 16 })))), /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ React21.createElement("div", null, /* @__PURE__ */ React21.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ React21.createElement("p", { className: "text-xs text-stone-500" }, headerDescription))), /* @__PURE__ */ React21.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React21.createElement(PageSpinner3, null) : /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React21.createElement("div", null, filteredWallets.length === 0 ? /* @__PURE__ */ React21.createElement("p", { className: "text-xs text-stone-400 py-6 text-center" }, "No wallets found") : filteredWallets.map((wallet) => /* @__PURE__ */ React21.createElement("div", { key: wallet.id, onClick: () => setSelectedWallet(wallet), className: "flex items-center justify-between py-4 hover:bg-stone-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl" }, /* @__PURE__ */ React21.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React21.createElement("div", { className: "relative shrink-0" }, /* @__PURE__ */ React21.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), wallet.networkLogoSrc && /* @__PURE__ */ React21.createElement("div", { className: "absolute -bottom-1 -right-1 w-4 h-4 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ React21.createElement("img", { src: wallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ React21.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ React21.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React21.createElement("p", { className: "text-sm text-black truncate" }, wallet.name), !external && wallet.isActive !== void 0 && /* @__PURE__ */ React21.createElement("span", { className: `text-xs px-1.5 py-0.5 rounded-sm tracking-widest ${wallet.isActive ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-600"}` }, wallet.isActive ? "Active" : "Inactive")), /* @__PURE__ */ React21.createElement("p", { className: `text-sm text-stone-500 truncate transition-all duration-300 ${hideBalanceAmounts && !external ? "blur-sm opacity-40 select-none" : ""}` }, external ? wallet.currency : `${wallet.balance} ${wallet.currency}`))), /* @__PURE__ */ React21.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React21.createElement("span", { className: "text-xs tracking-wide text-stone-600 bg-stone-100 px-2.5 py-1 rounded-full " }, wallet.network)))))))), addModalOpen && /* @__PURE__ */ React21.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React21.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setAddModalOpen(false) }), /* @__PURE__ */ React21.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React21.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React21.createElement("h3", { className: "text-sm text-black tracking-tight" }, flowStep === 1 ? "Important Notice" : flowStep === 2 ? "Secret Recovery Phrase" : flowStep === 3 ? "Verify Phrase" : "Secure Wallet"), /* @__PURE__ */ React21.createElement("button", { onClick: () => !isProcessing && setAddModalOpen(false), className: "text-stone-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: CancelCircleIcon6, size: 18 }))), /* @__PURE__ */ React21.createElement("div", { className: "p-6" }, flowStep === 1 && /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ React21.createElement(Banner, { type: "alert", title: "Critical Warning", message: "You are about to generate a Self-Custodial Recovery Phrase. This phrase is the absolute master key to your wallet and all assets within it. Aeona DOES NOT store this phrase. If you lose it, your funds are permanently lost. Do not share this phrase with anyone.", isDismissible: false }), /* @__PURE__ */ React21.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "I Understand, Generate Phrase")), flowStep === 2 && /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React21.createElement("p", { className: "text-sm text-stone-600" }, "Please write down these words in the exact order shown. Store them in a secure, offline location."), /* @__PURE__ */ React21.createElement("div", { className: "grid grid-cols-3 gap-2 max-h-48 overflow-y-auto custom-scrollbar pr-1" }, generatedPhrase.split(" ").map((word, idx) => /* @__PURE__ */ React21.createElement("div", { key: idx, className: "flex items-center gap-1.5 bg-stone-50 rounded-lg p-2 selection:bg-stone-100" }, /* @__PURE__ */ React21.createElement("span", { className: "text-xs text-stone-400 select-none w-4 text-right shrink-0" }, idx + 1, "."), /* @__PURE__ */ React21.createElement("span", { className: "text-sm text-black " }, word)))), /* @__PURE__ */ React21.createElement("div", { className: "flex items-center justify-between gap-2 0 pt-4" }, /* @__PURE__ */ React21.createElement("button", { type: "button", onClick: () => handleCopy(generatedPhrase, false), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: Copy01Icon2, size: 14 }), " Copy Phrase"), /* @__PURE__ */ React21.createElement("button", { type: "button", onClick: handleDownloadTxt, className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: Download01Icon, size: 14 }), " Download .txt")), /* @__PURE__ */ React21.createElement("div", { className: "flex items-start gap-3 p-3 rounded-xl border border-stone-200 mt-2" }, /* @__PURE__ */ React21.createElement("input", { type: "checkbox", id: "backup-confirm", checked: hasBackedUp, onChange: (e) => setHasBackedUp(e.target.checked), className: "mt-0.5 w-4 h-4 bg-white border-stone-300 rounded text-black focus:ring-black cursor-pointer shrink-0" }), /* @__PURE__ */ React21.createElement("label", { htmlFor: "backup-confirm", className: "text-xs text-stone-600 cursor-pointer leading-relaxed" }, "I have securely copied and stored my recovery phrase. I understand that if I lose it, my funds are gone forever.")), /* @__PURE__ */ React21.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "Continue")), flowStep === 3 && /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React21.createElement("p", { className: "text-sm text-stone-600" }, "Please enter or paste your recovery phrase below to verify your backup."), /* @__PURE__ */ React21.createElement("div", { className: "grid grid-cols-3 gap-2 max-h-56 overflow-y-auto custom-scrollbar pr-1 pb-1" }, verifyWords.map((word, idx) => /* @__PURE__ */ React21.createElement("div", { key: idx, className: "flex items-center gap-1 bg-white border border-stone-200 focus-within:border-black rounded-lg p-1.5 transition-colors" }, /* @__PURE__ */ React21.createElement("span", { className: "text-xs text-stone-400 w-4 shrink-0 text-right select-none" }, idx + 1, "."), /* @__PURE__ */ React21.createElement(
|
|
2141
2160
|
"input",
|
|
2142
2161
|
{
|
|
2143
2162
|
type: "text",
|
|
@@ -2160,9 +2179,9 @@ var UniversalWalletPage = ({
|
|
|
2160
2179
|
toast5.success("Phrase auto-filled.");
|
|
2161
2180
|
}
|
|
2162
2181
|
},
|
|
2163
|
-
className: "w-full bg-transparent text-
|
|
2182
|
+
className: "w-full bg-transparent text-sm text-black outline-none min-w-0"
|
|
2164
2183
|
}
|
|
2165
|
-
)))), /* @__PURE__ */ React21.createElement("div", { className: "flex items-center justify-between pt-4" }, /* @__PURE__ */ React21.createElement("button", { type: "button", onClick: () => handleGridPaste(setVerifyWords, verifyWords), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: ClipboardIcon, size: 14 }), " Paste Phrase")), /* @__PURE__ */ React21.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "Verify Backup")), flowStep === 4 && /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React21.createElement(Banner, { type: "success", title: "Phrase Verified", message: "Your phrase is correct. Now set a local password to encrypt your wallet on this browser.", isDismissible: false }), /* @__PURE__ */ React21.createElement(TextInput, { label: "Local Password", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ React21.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet("generated"), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Save Wallet"))))), importModalOpen && /* @__PURE__ */ React21.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React21.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setImportModalOpen(false) }), /* @__PURE__ */ React21.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React21.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React21.createElement("h3", { className: "text-
|
|
2184
|
+
)))), /* @__PURE__ */ React21.createElement("div", { className: "flex items-center justify-between pt-4" }, /* @__PURE__ */ React21.createElement("button", { type: "button", onClick: () => handleGridPaste(setVerifyWords, verifyWords), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: ClipboardIcon, size: 14 }), " Paste Phrase")), /* @__PURE__ */ React21.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "Verify Backup")), flowStep === 4 && /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React21.createElement(Banner, { type: "success", title: "Phrase Verified", message: "Your phrase is correct. Now set a local password to encrypt your wallet on this browser.", isDismissible: false }), /* @__PURE__ */ React21.createElement(TextInput, { label: "Local Password", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ React21.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet("generated"), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Save Wallet"))))), importModalOpen && /* @__PURE__ */ React21.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React21.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setImportModalOpen(false) }), /* @__PURE__ */ React21.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React21.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React21.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Import Wallet"), /* @__PURE__ */ React21.createElement("button", { onClick: () => !isProcessing && setImportModalOpen(false), className: "text-stone-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: CancelCircleIcon6, size: 18 }))), /* @__PURE__ */ React21.createElement("div", { className: "p-6" }, flowStep === 1 && /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ React21.createElement("p", { className: "text-sm text-stone-600" }, "Enter your 12 or 24-word recovery phrase to restore your wallet on this device."), /* @__PURE__ */ React21.createElement("div", { className: "grid grid-cols-3 gap-2 max-h-56 overflow-y-auto custom-scrollbar pr-1 pb-1" }, importWords.map((word, idx) => /* @__PURE__ */ React21.createElement("div", { key: idx, className: "flex items-center gap-1 bg-white border border-stone-200 focus-within:border-black rounded-lg p-1.5 transition-colors" }, /* @__PURE__ */ React21.createElement("span", { className: "text-xs text-stone-400 w-4 shrink-0 text-right select-none" }, idx + 1, "."), /* @__PURE__ */ React21.createElement(
|
|
2166
2185
|
"input",
|
|
2167
2186
|
{
|
|
2168
2187
|
type: "text",
|
|
@@ -2186,9 +2205,9 @@ var UniversalWalletPage = ({
|
|
|
2186
2205
|
toast5.success("Phrase auto-filled.");
|
|
2187
2206
|
}
|
|
2188
2207
|
},
|
|
2189
|
-
className: "w-full bg-transparent text-
|
|
2208
|
+
className: "w-full bg-transparent text-sm text-black outline-none min-w-0"
|
|
2190
2209
|
}
|
|
2191
|
-
)))), /* @__PURE__ */ React21.createElement("div", { className: "flex items-center justify-between pt-4" }, /* @__PURE__ */ React21.createElement("button", { type: "button", onClick: () => handleGridPaste(setImportWords, importWords), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: ClipboardIcon, size: 14 }), " Paste Phrase")), /* @__PURE__ */ React21.createElement(ThreeDActionButton, { onClick: handleImportNext, className: "w-full mt-2" }, "Continue")), flowStep === 2 && /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React21.createElement("p", { className: "text-sm text-
|
|
2210
|
+
)))), /* @__PURE__ */ React21.createElement("div", { className: "flex items-center justify-between pt-4" }, /* @__PURE__ */ React21.createElement("button", { type: "button", onClick: () => handleGridPaste(setImportWords, importWords), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: ClipboardIcon, size: 14 }), " Paste Phrase")), /* @__PURE__ */ React21.createElement(ThreeDActionButton, { onClick: handleImportNext, className: "w-full mt-2" }, "Continue")), flowStep === 2 && /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React21.createElement("p", { className: "text-sm text-stone-600" }, "Set a local password to encrypt this wallet on this specific browser."), /* @__PURE__ */ React21.createElement(TextInput, { label: "Local Password", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ React21.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet("imported"), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Import Wallet"))))), selectedWallet && /* @__PURE__ */ React21.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React21.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedWallet(null) }), /* @__PURE__ */ React21.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ React21.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React21.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Wallet Details"), /* @__PURE__ */ React21.createElement("button", { onClick: () => setSelectedWallet(null), className: "text-stone-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: CancelCircleIcon6, size: 18 }))), /* @__PURE__ */ React21.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-6" }, /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ React21.createElement("div", { className: "relative mb-4" }, /* @__PURE__ */ React21.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14" }), selectedWallet.networkLogoSrc && /* @__PURE__ */ React21.createElement("div", { className: "absolute -bottom-1 -right-1 w-5 h-5 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ React21.createElement("img", { src: selectedWallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ React21.createElement("h2", { className: `text-2xl text-black mb-2 transition-all duration-300 ${hideBalanceAmounts && !external ? "blur-[6px] opacity-40 select-none" : ""}` }, external ? selectedWallet.currency : `${selectedWallet.balance} ${selectedWallet.currency}`), /* @__PURE__ */ React21.createElement("span", { className: "text-xs tracking-widest text-stone-500 px-4 py-1.5 rounded-full border border-stone-200 mt-1 " }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ React21.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, renderQrCode(selectedWallet)), external && /* @__PURE__ */ React21.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React21.createElement(
|
|
2192
2211
|
Banner,
|
|
2193
2212
|
{
|
|
2194
2213
|
type: "warning",
|
|
@@ -2196,7 +2215,7 @@ var UniversalWalletPage = ({
|
|
|
2196
2215
|
message: `Ensure you only send assets using the exact network specified. Minimum deposit is 15 ${selectedWallet.currency}. Sending funds through an unsupported network or under the minimum will result in permanent loss of funds.`,
|
|
2197
2216
|
isDismissible: false
|
|
2198
2217
|
}
|
|
2199
|
-
)), /* @__PURE__ */ React21.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ React21.createElement("div", null, /* @__PURE__ */ React21.createElement("span", { className: "text-
|
|
2218
|
+
)), /* @__PURE__ */ React21.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ React21.createElement("div", null, /* @__PURE__ */ React21.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-2" }, "Wallet Address"), /* @__PURE__ */ React21.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ React21.createElement("span", { className: "text-sm text-black truncate min-w-0 block" }, truncateAddress2(selectedWallet.address)), /* @__PURE__ */ React21.createElement("button", { type: "button", onClick: () => setShowCopyWarning(true), className: "text-stone-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon16, { icon: Copy01Icon2, size: 14 })))), !external && /* @__PURE__ */ React21.createElement("div", null, /* @__PURE__ */ React21.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-2" }, "Wallet Status"), selectedWallet.isActive ? /* @__PURE__ */ React21.createElement("span", { className: "text-sm px-1.5 py-0.5 bg-emerald-50 text-emerald-600 " }, "Active on this device") : /* @__PURE__ */ React21.createElement("span", { className: "text-sm px-1.5 py-0.5 bg-red-50 text-red-600 " }, "Inactive - Requires Import"))), /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React21.createElement("button", { type: "button", onClick: () => setShowCopyWarning(true), className: "w-full flex items-center justify-center py-2.5 rounded-full border border-stone-200 text-black hover:bg-stone-50 outline-none text-xs tracking-wide transition-colors" }, "Copy Wallet Address"))))), selectedWallet && /* @__PURE__ */ React21.createElement(
|
|
2200
2219
|
ConfirmationDialog,
|
|
2201
2220
|
{
|
|
2202
2221
|
isOpen: showCopyWarning,
|
|
@@ -2256,7 +2275,7 @@ var UniversalCardPage = ({
|
|
|
2256
2275
|
img.onload = () => setIsBgLoaded(true);
|
|
2257
2276
|
}, [activeCard?.cardBgSrc]);
|
|
2258
2277
|
if (!activeCard || sortedCards.length === 0) {
|
|
2259
|
-
return /* @__PURE__ */ React22.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative min-h-100 justify-center" }, /* @__PURE__ */ React22.createElement("div", { className: "p-6 w-full max-w-md mx-auto text-center" }, /* @__PURE__ */ React22.createElement("div", { className: "mb-8 flex justify-center" }, /* @__PURE__ */ React22.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", className: "w-12 h-12 fill-
|
|
2278
|
+
return /* @__PURE__ */ React22.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative min-h-100 justify-center" }, /* @__PURE__ */ React22.createElement("div", { className: "p-6 w-full max-w-md mx-auto text-center" }, /* @__PURE__ */ React22.createElement("div", { className: "mb-8 flex justify-center" }, /* @__PURE__ */ React22.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", className: "w-12 h-12 fill-stone-100" }, /* @__PURE__ */ React22.createElement("path", { fillRule: "evenodd", d: "M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zM12 8.25a.75.75 0 01.75.75v3.75a.75.75 0 01-1.5 0V9a.75.75 0 01.75-.75zm0 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z", clipRule: "evenodd" }))), /* @__PURE__ */ React22.createElement("h1", { className: "text-xl text-black tracking-tight mb-4" }, "No cards available"), /* @__PURE__ */ React22.createElement("p", { className: "text-sm leading-[1.8] text-stone-600 mb-12" }, "You do not have any active cards on your account.")));
|
|
2260
2279
|
}
|
|
2261
2280
|
const isActivated = activeCard.status === "ACTIVATED";
|
|
2262
2281
|
const isFrozen = activeCard.status === "FROZEN";
|
|
@@ -2265,7 +2284,7 @@ var UniversalCardPage = ({
|
|
|
2265
2284
|
const actionsDisabled = !isActivated && !isFrozen || isDead;
|
|
2266
2285
|
const showActionOverlay = !isActivated && isBgLoaded || isFrozen;
|
|
2267
2286
|
const overlayClasses = activeCard.contentDark ? "bg-white/30 backdrop-blur-[3px]" : "bg-black/30 backdrop-blur-[3px]";
|
|
2268
|
-
const buttonClasses = activeCard.contentDark ? "bg-black text-white hover:bg-black/80 " : "bg-white text-black hover:bg-
|
|
2287
|
+
const buttonClasses = activeCard.contentDark ? "bg-black text-white hover:bg-black/80 " : "bg-white text-black hover:bg-stone-100 ";
|
|
2269
2288
|
const handleToggleFreeze = async () => {
|
|
2270
2289
|
if (actionsDisabled || isFreezing || !onFreeze) return;
|
|
2271
2290
|
setIsFreezing(true);
|
|
@@ -2289,7 +2308,7 @@ var UniversalCardPage = ({
|
|
|
2289
2308
|
{
|
|
2290
2309
|
key: tab.id,
|
|
2291
2310
|
onClick: () => setActiveTabIndex(idx),
|
|
2292
|
-
className: `px-4 py-1.5 rounded-full text-
|
|
2311
|
+
className: `px-4 py-1.5 rounded-full text-xs transition-all duration-200 outline-none whitespace-nowrap shrink-0 ${activeTabIndex === idx ? "bg-stone-100 text-black" : "text-stone-500 hover:text-black hover:bg-stone-50/50"}`
|
|
2293
2312
|
},
|
|
2294
2313
|
formatTabLabel(tab.type)
|
|
2295
2314
|
)))), /* @__PURE__ */ React22.createElement("div", { className: "w-full pt-2 pb-6 flex justify-center" }, /* @__PURE__ */ React22.createElement("div", { className: "relative w-full max-w-85", style: { height: 179 } }, !isBgLoaded && /* @__PURE__ */ React22.createElement("div", { className: "absolute inset-0 w-full h-full bg-white rounded-2xl flex items-center justify-center z-50" }, /* @__PURE__ */ React22.createElement(HugeiconsIcon17, { icon: Loading03Icon10, size: 28, className: "animate-spin text-black" })), showActionOverlay && /* @__PURE__ */ React22.createElement("div", { className: `absolute inset-0 z-40 w-full h-full rounded-2xl flex flex-col items-center justify-center transition-all ${overlayClasses}` }, isUnactivated && /* @__PURE__ */ React22.createElement(
|
|
@@ -2299,16 +2318,16 @@ var UniversalCardPage = ({
|
|
|
2299
2318
|
e.stopPropagation();
|
|
2300
2319
|
router.push(`${actionPath}${activeCard.id}`);
|
|
2301
2320
|
},
|
|
2302
|
-
className: `px-6 py-2 text-
|
|
2321
|
+
className: `px-6 py-2 text-xs rounded-full transition-all outline-none ${buttonClasses}`
|
|
2303
2322
|
},
|
|
2304
2323
|
"Activate Card"
|
|
2305
|
-
), isFrozen && /* @__PURE__ */ React22.createElement("div", { className: `px-6 py-2.5 text-
|
|
2324
|
+
), isFrozen && /* @__PURE__ */ React22.createElement("div", { className: `px-6 py-2.5 text-xs rounded-full flex items-center gap-2 ${buttonClasses}` }, "Card Frozen")), /* @__PURE__ */ React22.createElement("div", { className: `absolute inset-0 w-full h-full rounded-2xl overflow-hidden transition-all duration-700 ${isBgLoaded ? "opacity-100 scale-100" : "opacity-0 scale-105"}` }, /* @__PURE__ */ React22.createElement(
|
|
2306
2325
|
"div",
|
|
2307
2326
|
{
|
|
2308
2327
|
className: "absolute inset-0 bg-cover bg-center",
|
|
2309
2328
|
style: { backgroundImage: `url(${activeCard.cardBgSrc})` }
|
|
2310
2329
|
}
|
|
2311
|
-
), /* @__PURE__ */ React22.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ React22.createElement("div", { className: "flex items-start justify-end w-full gap-4" }), /* @__PURE__ */ React22.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ React22.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React22.createElement("span", { className: `text-
|
|
2330
|
+
), /* @__PURE__ */ React22.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ React22.createElement("div", { className: "flex items-start justify-end w-full gap-4" }), /* @__PURE__ */ React22.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ React22.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React22.createElement("span", { className: `text-xs tracking-widest ${activeCard.contentDark ? "text-black/60" : "text-white/70"} drop-shadow-sm` }, "Balance"), /* @__PURE__ */ React22.createElement("span", { className: `text-sm tracking-widest ${activeCard.contentDark ? "text-black" : "text-white"} drop-shadow-sm` }, activeCard.balance)), activeCard.networkLogoSrc && /* @__PURE__ */ React22.createElement(
|
|
2312
2331
|
"img",
|
|
2313
2332
|
{
|
|
2314
2333
|
src: activeCard.networkLogoSrc,
|
|
@@ -2376,7 +2395,7 @@ var UniversalCardPage = ({
|
|
|
2376
2395
|
}
|
|
2377
2396
|
));
|
|
2378
2397
|
};
|
|
2379
|
-
var MenuRow = ({ icon, title, subtitle, onClick, isLast = false, isToggle = false, toggleState = false, toggleLoading = false, disabled = false }) => /* @__PURE__ */ React22.createElement("div", { onClick: disabled ? void 0 : onClick, className: `flex items-center p-3 transition-colors ${disabled ? "opacity-40 cursor-not-allowed" : "cursor-pointer hover:bg-
|
|
2398
|
+
var MenuRow = ({ icon, title, subtitle, onClick, isLast = false, isToggle = false, toggleState = false, toggleLoading = false, disabled = false }) => /* @__PURE__ */ React22.createElement("div", { onClick: disabled ? void 0 : onClick, className: `flex items-center p-3 transition-colors ${disabled ? "opacity-40 cursor-not-allowed" : "cursor-pointer hover:bg-stone-50"}` }, /* @__PURE__ */ React22.createElement("div", { className: "w-9 h-9 rounded-full border border-stone-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React22.createElement(HugeiconsIcon17, { icon, size: 16, className: "text-black" })), /* @__PURE__ */ React22.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React22.createElement("p", { className: "text-sm truncate text-black" }, title), /* @__PURE__ */ React22.createElement("p", { className: "text-xs text-stone-500 truncate" }, subtitle)), isToggle ? /* @__PURE__ */ React22.createElement("div", { className: `relative w-11 h-6 rounded-full transition-colors duration-300 ml-2 shrink-0 ${toggleState ? "bg-black" : "bg-stone-100"} ${disabled ? "opacity-50" : ""}` }, /* @__PURE__ */ React22.createElement("div", { className: `absolute top-1 left-1 w-4 h-4 rounded-full bg-white shadow-sm transition-transform duration-300 flex items-center justify-center ${toggleState ? "translate-x-5" : "translate-x-0"}` }, toggleLoading && /* @__PURE__ */ React22.createElement(HugeiconsIcon17, { icon: Loading03Icon10, size: 10, className: "animate-spin text-black" }))) : /* @__PURE__ */ React22.createElement(HugeiconsIcon17, { icon: ArrowRight01Icon5, size: 18, className: "text-stone-400 shrink-0 ml-2" }));
|
|
2380
2399
|
var CardInfoDialog = ({ isOpen, onClose, cardDetails }) => {
|
|
2381
2400
|
if (!isOpen || !cardDetails) return null;
|
|
2382
2401
|
const handleCopy = (text, label) => {
|
|
@@ -2384,7 +2403,7 @@ var CardInfoDialog = ({ isOpen, onClose, cardDetails }) => {
|
|
|
2384
2403
|
toast6.success(`${label} copied to clipboard`);
|
|
2385
2404
|
};
|
|
2386
2405
|
const formattedCardNumber = cardDetails.card_number.replace(/(.{4})/g, "$1 ").trim();
|
|
2387
|
-
return /* @__PURE__ */ React22.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React22.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: onClose }), /* @__PURE__ */ React22.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React22.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React22.createElement("h3", { className: "text-
|
|
2406
|
+
return /* @__PURE__ */ React22.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React22.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: onClose }), /* @__PURE__ */ React22.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React22.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React22.createElement("h3", { className: "text-sm text-black tracking-tight " }, "Secure Card Details"), /* @__PURE__ */ React22.createElement("button", { onClick: onClose, className: "text-stone-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React22.createElement(HugeiconsIcon17, { icon: CancelCircleIcon7, size: 18 }))), /* @__PURE__ */ React22.createElement("div", { className: "p-6" }, /* @__PURE__ */ React22.createElement("div", { className: "grid grid-cols-1 gap-y-6 mb-6" }, /* @__PURE__ */ React22.createElement("div", null, /* @__PURE__ */ React22.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-1.5 " }, "Card Number"), /* @__PURE__ */ React22.createElement("div", { className: "flex items-center justify-between p-3 rounded-full border border-stone-200" }, /* @__PURE__ */ React22.createElement("span", { className: "text-sm tracking-widest text-black block" }, formattedCardNumber), /* @__PURE__ */ React22.createElement("button", { onClick: () => handleCopy(cardDetails.card_number, "Card Number"), className: "text-stone-400 hover:text-black outline-none shrink-0 ml-3" }, /* @__PURE__ */ React22.createElement(HugeiconsIcon17, { icon: Copy01Icon3, size: 16 })))), /* @__PURE__ */ React22.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React22.createElement("div", null, /* @__PURE__ */ React22.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-1.5 " }, "Expiry Date"), /* @__PURE__ */ React22.createElement("div", { className: "flex items-center justify-between p-3 rounded-full border border-stone-200" }, /* @__PURE__ */ React22.createElement("span", { className: "text-sm text-black block" }, cardDetails.expiry), /* @__PURE__ */ React22.createElement("button", { onClick: () => handleCopy(cardDetails.expiry, "Expiry Date"), className: "text-stone-400 hover:text-black outline-none shrink-0 ml-2" }, /* @__PURE__ */ React22.createElement(HugeiconsIcon17, { icon: Copy01Icon3, size: 16 })))), /* @__PURE__ */ React22.createElement("div", null, /* @__PURE__ */ React22.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-1.5 " }, "CVV"), /* @__PURE__ */ React22.createElement("div", { className: "flex items-center justify-between p-3 rounded-full border border-stone-200" }, /* @__PURE__ */ React22.createElement("span", { className: "text-sm text-black block" }, cardDetails.cvv), /* @__PURE__ */ React22.createElement("button", { onClick: () => handleCopy(cardDetails.cvv, "CVV"), className: "text-stone-400 hover:text-black outline-none shrink-0 ml-2" }, /* @__PURE__ */ React22.createElement(HugeiconsIcon17, { icon: Copy01Icon3, size: 16 })))))))));
|
|
2388
2407
|
};
|
|
2389
2408
|
var FundCardDialog = ({ isOpen, onClose, onSubmit }) => {
|
|
2390
2409
|
const [amount, setAmount] = useState15("");
|
|
@@ -2408,7 +2427,7 @@ var FundCardDialog = ({ isOpen, onClose, onSubmit }) => {
|
|
|
2408
2427
|
setIsProcessing(false);
|
|
2409
2428
|
}
|
|
2410
2429
|
};
|
|
2411
|
-
return /* @__PURE__ */ React22.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React22.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => !isProcessing && onClose() }), /* @__PURE__ */ React22.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React22.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React22.createElement("h3", { className: "text-
|
|
2430
|
+
return /* @__PURE__ */ React22.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React22.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => !isProcessing && onClose() }), /* @__PURE__ */ React22.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React22.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React22.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Fund Card"), /* @__PURE__ */ React22.createElement("button", { disabled: isProcessing, onClick: onClose, className: "text-stone-400 hover:text-black outline-none disabled:opacity-50" }, /* @__PURE__ */ React22.createElement(HugeiconsIcon17, { icon: CancelCircleIcon7, size: 18 }))), /* @__PURE__ */ React22.createElement("div", { className: "flex-1 p-6" }, /* @__PURE__ */ React22.createElement("form", { onSubmit: handleFundCard, className: "flex flex-col gap-6" }, /* @__PURE__ */ React22.createElement(
|
|
2412
2431
|
NumberInput,
|
|
2413
2432
|
{
|
|
2414
2433
|
label: "Amount to Add",
|
|
@@ -2478,12 +2497,12 @@ var UniversalProfilePage = ({
|
|
|
2478
2497
|
}
|
|
2479
2498
|
};
|
|
2480
2499
|
const getBadgeColorClass = (role) => {
|
|
2481
|
-
if (!role) return "text-
|
|
2500
|
+
if (!role) return "text-stone-400";
|
|
2482
2501
|
const r = role.toLowerCase();
|
|
2483
|
-
if (r.includes("basic")) return "text-
|
|
2502
|
+
if (r.includes("basic")) return "text-stone-400";
|
|
2484
2503
|
if (r.includes("standard")) return "text-blue-500";
|
|
2485
2504
|
if (r.includes("platinum")) return "text-yellow-400";
|
|
2486
|
-
return "text-
|
|
2505
|
+
return "text-stone-400";
|
|
2487
2506
|
};
|
|
2488
2507
|
return /* @__PURE__ */ React23.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React23.createElement("div", { className: "pt-8 pb-4 flex flex-col items-center" }, /* @__PURE__ */ React23.createElement(
|
|
2489
2508
|
"div",
|
|
@@ -2491,7 +2510,7 @@ var UniversalProfilePage = ({
|
|
|
2491
2510
|
onClick: onAvatarTap,
|
|
2492
2511
|
className: `w-22 h-22 rounded-full bg-white p-1 mb-4 flex items-center justify-center ${onAvatarTap ? "cursor-pointer group" : ""}`
|
|
2493
2512
|
},
|
|
2494
|
-
/* @__PURE__ */ React23.createElement("div", { className: "relative w-full h-full rounded-full overflow-hidden bg-
|
|
2513
|
+
/* @__PURE__ */ React23.createElement("div", { className: "relative w-full h-full rounded-full overflow-hidden bg-stone-100 flex items-center justify-center" }, avatarSrc ? /* @__PURE__ */ React23.createElement(React23.Fragment, null, !isAvatarLoaded && /* @__PURE__ */ React23.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-stone-100" }, /* @__PURE__ */ React23.createElement(HugeiconsIcon18, { icon: Loading03Icon11, size: 24, className: "animate-spin text-black" })), /* @__PURE__ */ React23.createElement(
|
|
2495
2514
|
"img",
|
|
2496
2515
|
{
|
|
2497
2516
|
src: avatarSrc,
|
|
@@ -2499,8 +2518,8 @@ var UniversalProfilePage = ({
|
|
|
2499
2518
|
onLoad: () => setIsAvatarLoaded(true),
|
|
2500
2519
|
className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
|
|
2501
2520
|
}
|
|
2502
|
-
)) : /* @__PURE__ */ React23.createElement(HugeiconsIcon18, { icon: UserIcon, size: 40, className: "text-
|
|
2503
|
-
), /* @__PURE__ */ React23.createElement("div", { className: "bg-white rounded-full px-4 py-2 flex items-center justify-center gap-2 mb-3" }, /* @__PURE__ */ React23.createElement("span", { className: "text-
|
|
2521
|
+
)) : /* @__PURE__ */ React23.createElement(HugeiconsIcon18, { icon: UserIcon, size: 40, className: "text-stone-300" }), onAvatarTap && /* @__PURE__ */ React23.createElement("div", { className: "absolute inset-0 bg-black/30 backdrop-blur-[1px] flex items-center justify-center opacity-80 sm:opacity-0 sm:group-hover:opacity-100 transition-opacity duration-200 z-20" }, /* @__PURE__ */ React23.createElement(HugeiconsIcon18, { icon: Camera01Icon, size: 24, className: "text-white" })))
|
|
2522
|
+
), /* @__PURE__ */ React23.createElement("div", { className: "bg-white rounded-full px-4 py-2 flex items-center justify-center gap-2 mb-3" }, /* @__PURE__ */ React23.createElement("span", { className: "text-xs text-black" }, roleName), /* @__PURE__ */ React23.createElement("span", { className: getBadgeColorClass(roleName), "aria-hidden": true }, /* @__PURE__ */ React23.createElement("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React23.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: "0" }), /* @__PURE__ */ React23.createElement("g", { id: "SVGRepo_tracerCarrier", strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ React23.createElement("g", { id: "SVGRepo_iconCarrier" }, " ", /* @__PURE__ */ React23.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.5924 3.20027C9.34888 3.4078 9.22711 3.51158 9.09706 3.59874C8.79896 3.79854 8.46417 3.93721 8.1121 4.00672C7.95851 4.03705 7.79903 4.04977 7.48008 4.07522C6.6787 4.13918 6.278 4.17115 5.94371 4.28923C5.17051 4.56233 4.56233 5.17051 4.28923 5.94371C4.17115 6.278 4.13918 6.6787 4.07522 7.48008C4.04977 7.79903 4.03705 7.95851 4.00672 8.1121C3.93721 8.46417 3.79854 8.79896 3.59874 9.09706C3.51158 9.22711 3.40781 9.34887 3.20027 9.5924C2.67883 10.2043 2.4181 10.5102 2.26522 10.8301C1.91159 11.57 1.91159 12.43 2.26522 13.1699C2.41811 13.4898 2.67883 13.7957 3.20027 14.4076C3.40778 14.6511 3.51158 14.7729 3.59874 14.9029C3.79854 15.201 3.93721 15.5358 4.00672 15.8879C4.03705 16.0415 4.04977 16.201 4.07522 16.5199C4.13918 17.3213 4.17115 17.722 4.28923 18.0563C4.56233 18.8295 5.17051 19.4377 5.94371 19.7108C6.278 19.8288 6.6787 19.8608 7.48008 19.9248C7.79903 19.9502 7.95851 19.963 8.1121 19.9933C8.46417 20.0628 8.79896 20.2015 9.09706 20.4013C9.22711 20.4884 9.34887 20.5922 9.5924 20.7997C10.2043 21.3212 10.5102 21.5819 10.8301 21.7348C11.57 22.0884 12.43 22.0884 13.1699 21.7348C13.4898 21.5819 13.7957 21.3212 14.4076 20.7997C14.6511 20.5922 14.7729 20.4884 14.9029 20.4013C15.201 20.2015 15.5358 20.0628 15.8879 19.9933C16.0415 19.963 16.201 19.9502 16.5199 19.9248C17.3213 19.8608 17.722 19.8288 18.0563 19.7108C18.8295 19.4377 19.4377 18.8295 19.7108 18.0563C19.8288 17.722 19.8608 17.3213 19.9248 16.5199C19.9502 16.201 19.963 16.0415 19.9933 15.8879C20.0628 15.5358 20.2015 15.201 20.4013 14.9029C20.4884 14.7729 20.5922 14.6511 20.7997 14.4076C21.3212 13.7957 21.5819 13.4898 21.7348 13.1699C22.0884 12.43 22.0884 11.57 21.7348 10.8301C21.5819 10.5102 21.3212 10.2043 20.7997 9.5924C20.5922 9.34887 20.4884 9.22711 20.4013 9.09706C20.2015 8.79896 20.0628 8.46417 19.9933 8.1121C19.963 7.95851 19.9502 7.79903 19.9248 7.48008C19.8608 6.6787 19.8288 6.278 19.7108 5.94371C19.4377 5.17051 18.8295 4.56233 18.0563 4.28923C17.722 4.17115 17.3213 4.13918 16.5199 4.07522C16.201 4.04977 16.0415 4.03705 15.8879 4.00672C15.5358 3.93721 15.201 3.79854 14.9029 3.59874C14.7729 3.51158 14.6511 3.40781 14.4076 3.20027C13.7957 2.67883 13.4898 2.41811 13.1699 2.26522C12.43 1.91159 11.57 1.91159 10.8301 2.26522C10.5102 2.4181 10.2043 2.67883 9.5924 3.20027ZM16.3735 9.86314C16.6913 9.5453 16.6913 9.03 16.3735 8.71216C16.0557 8.39433 15.5403 8.39433 15.2225 8.71216L10.3723 13.5624L8.77746 11.9676C8.45963 11.6498 7.94432 11.6498 7.62649 11.9676C7.30866 12.2854 7.30866 12.8007 7.62649 13.1186L9.79678 15.2889C10.1146 15.6067 10.6299 15.6067 10.9478 15.2889L16.3735 9.86314Z", fill: "currentColor" }), " ")))), /* @__PURE__ */ React23.createElement("span", { className: "text-xs text-stone-500" }, memberSince)), /* @__PURE__ */ React23.createElement("div", { className: "w-full flex flex-col gap-4 mt-2" }, /* @__PURE__ */ React23.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ React23.createElement(
|
|
2504
2523
|
MenuRow2,
|
|
2505
2524
|
{
|
|
2506
2525
|
icon: UserIcon,
|
|
@@ -2589,11 +2608,11 @@ var MenuRow2 = ({ icon, title, subtitle, onClick, iconColor = "text-black", titl
|
|
|
2589
2608
|
"div",
|
|
2590
2609
|
{
|
|
2591
2610
|
onClick,
|
|
2592
|
-
className: `flex items-center p-4 cursor-pointer hover:bg-
|
|
2611
|
+
className: `flex items-center p-4 cursor-pointer hover:bg-stone-50 transition-colors ${!isLast ? "" : ""}`
|
|
2593
2612
|
},
|
|
2594
|
-
/* @__PURE__ */ React23.createElement("div", { className: "w-9 h-9 rounded-full border border-
|
|
2595
|
-
/* @__PURE__ */ React23.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React23.createElement("p", { className: `text-
|
|
2596
|
-
/* @__PURE__ */ React23.createElement(HugeiconsIcon18, { icon: ArrowRight01Icon6, size: 18, className: "text-
|
|
2613
|
+
/* @__PURE__ */ React23.createElement("div", { className: "w-9 h-9 rounded-full border border-stone-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React23.createElement(HugeiconsIcon18, { icon, size: 16, className: iconColor })),
|
|
2614
|
+
/* @__PURE__ */ React23.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React23.createElement("p", { className: `text-sm truncate ${titleColor}` }, title), /* @__PURE__ */ React23.createElement("p", { className: "text-xs text-stone-500 truncate" }, subtitle)),
|
|
2615
|
+
/* @__PURE__ */ React23.createElement(HugeiconsIcon18, { icon: ArrowRight01Icon6, size: 18, className: "text-stone-400 shrink-0 ml-2" })
|
|
2597
2616
|
);
|
|
2598
2617
|
|
|
2599
2618
|
// src/components/UniversalSidebar.tsx
|
|
@@ -2634,7 +2653,7 @@ var UniversalSidebar = ({
|
|
|
2634
2653
|
key: item.name,
|
|
2635
2654
|
href: item.path,
|
|
2636
2655
|
onClick: (e) => onNavClick ? onNavClick(e, item.path) : void 0,
|
|
2637
|
-
className: `flex items-center justify-center w-12 h-12 mx-auto rounded-full transition-all outline-none group shrink-0 ${isCurrentRoute ? "bg-white text-black" : "text-
|
|
2656
|
+
className: `flex items-center justify-center w-12 h-12 mx-auto rounded-full transition-all outline-none group shrink-0 ${isCurrentRoute ? "bg-white text-black" : "text-stone-500 hover:text-black hover:bg-white/50"}`,
|
|
2638
2657
|
title: item.name
|
|
2639
2658
|
},
|
|
2640
2659
|
/* @__PURE__ */ React24.createElement(
|
|
@@ -2642,7 +2661,7 @@ var UniversalSidebar = ({
|
|
|
2642
2661
|
{
|
|
2643
2662
|
icon: item.icon,
|
|
2644
2663
|
size: 20,
|
|
2645
|
-
className: `shrink-0 transition-colors ${isCurrentRoute ? "text-black" : "text-
|
|
2664
|
+
className: `shrink-0 transition-colors ${isCurrentRoute ? "text-black" : "text-stone-400 group-hover:text-black"}`
|
|
2646
2665
|
}
|
|
2647
2666
|
)
|
|
2648
2667
|
);
|
|
@@ -2650,7 +2669,7 @@ var UniversalSidebar = ({
|
|
|
2650
2669
|
"button",
|
|
2651
2670
|
{
|
|
2652
2671
|
onClick: () => setShowLogoutDialog(true),
|
|
2653
|
-
className: "w-12 h-12 rounded-full flex items-center justify-center text-
|
|
2672
|
+
className: "w-12 h-12 rounded-full flex items-center justify-center text-stone-500 hover:bg-white/50 transition-all outline-none"
|
|
2654
2673
|
},
|
|
2655
2674
|
/* @__PURE__ */ React24.createElement(HugeiconsIcon19, { icon: LogoutCircle02Icon2, size: 20 })
|
|
2656
2675
|
))), showLogoutAction && /* @__PURE__ */ React24.createElement(
|
|
@@ -2719,7 +2738,7 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
2719
2738
|
{
|
|
2720
2739
|
onClick: onClose,
|
|
2721
2740
|
disabled: isLoading,
|
|
2722
|
-
className: "absolute top-4 right-4 p-2 text-
|
|
2741
|
+
className: "absolute top-4 right-4 p-2 text-stone-700 hover:text-stone-400 transition-colors disabled:opacity-50 outline-none"
|
|
2723
2742
|
},
|
|
2724
2743
|
/* @__PURE__ */ React25.createElement(
|
|
2725
2744
|
"svg",
|
|
@@ -2738,7 +2757,7 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
2738
2757
|
/* @__PURE__ */ React25.createElement("path", { d: "m6 6 12 12" })
|
|
2739
2758
|
)
|
|
2740
2759
|
),
|
|
2741
|
-
/* @__PURE__ */ React25.createElement("div", { className: "p-6 sm:p-8" }, /* @__PURE__ */ React25.createElement("div", { className: "mb-8 mt-2" }, /* @__PURE__ */ React25.createElement("h2", { className: "text-2xl text-black tracking-tight mb-2" }, "Join the Waitlist"), /* @__PURE__ */ React25.createElement("p", { className: "text-
|
|
2760
|
+
/* @__PURE__ */ React25.createElement("div", { className: "p-6 sm:p-8" }, /* @__PURE__ */ React25.createElement("div", { className: "mb-8 mt-2" }, /* @__PURE__ */ React25.createElement("h2", { className: "text-2xl text-black tracking-tight mb-2" }, "Join the Waitlist"), /* @__PURE__ */ React25.createElement("p", { className: "text-sm text-stone-500 leading-relaxed" }, "Be the first to be notified when we launch. Secure your early access spot today.")), /* @__PURE__ */ React25.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col gap-8" }, /* @__PURE__ */ React25.createElement(
|
|
2742
2761
|
TextInput,
|
|
2743
2762
|
{
|
|
2744
2763
|
label: "Email ID",
|
|
@@ -2837,7 +2856,7 @@ var HeroSection = ({
|
|
|
2837
2856
|
className: "leading-[0.85] tracking-[-0.07em] text-[18.2vw] sm:text-[16.8vw] md:text-[15.4vw] lg:text-[14vw] xl:text-[13.3vw] 2xl:text-[14vw] text-[#ffffff]"
|
|
2838
2857
|
},
|
|
2839
2858
|
/* @__PURE__ */ React26.createElement("div", { className: "inline-flex flex-wrap" }, /* @__PURE__ */ React26.createElement("span", { className: `inline-block relative transition-all duration-1000 ${isAnimating ? "opacity-100 translate-y-0" : "opacity-0 translate-y-10"}` }, titlePrefix, titlePrefix && /* @__PURE__ */ React26.createElement("br", null), highlightText, /* @__PURE__ */ React26.createElement("span", { className: "absolute top-[0.65em] right-[-0.3em] text-[0.31em] text-[#ffffff]/70" }, "*")))
|
|
2840
|
-
)), /* @__PURE__ */ React26.createElement("div", { className: "col-span-12 flex flex-col gap-5 pb-6 lg:col-span-4 lg:pb-10" }, subtitle && /* @__PURE__ */ React26.createElement("p", { className: "text-xs text-[#ffffff]/70 sm:text-sm md:text-
|
|
2859
|
+
)), /* @__PURE__ */ React26.createElement("div", { className: "col-span-12 flex flex-col gap-5 pb-6 lg:col-span-4 lg:pb-10" }, subtitle && /* @__PURE__ */ React26.createElement("p", { className: "text-xs text-[#ffffff]/70 sm:text-sm md:text-xs leading-[1.2] max-w-md transition-opacity duration-1000 delay-300" }, subtitle), /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col sm:flex-row items-start sm:items-center gap-4" }, ctaText && // Changed from <button> to <Link> so it actually navigates!
|
|
2841
2860
|
/* @__PURE__ */ React26.createElement(
|
|
2842
2861
|
Link6,
|
|
2843
2862
|
{
|
|
@@ -2854,7 +2873,7 @@ var HeroSection = ({
|
|
|
2854
2873
|
className: "inline-flex h-10 items-center self-start justify-center text-xs tracking-wide rounded-full px-6 border border-[#ffffff]/30 text-[#ffffff] hover:bg-[#ffffff]/10 transition-colors"
|
|
2855
2874
|
},
|
|
2856
2875
|
secondaryCtaText
|
|
2857
|
-
)), showApps && appLogos && appLogos.length > 0 && /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col gap-3 mt-4" }, appsText && /* @__PURE__ */ React26.createElement("span", { className: "text-
|
|
2876
|
+
)), showApps && appLogos && appLogos.length > 0 && /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col gap-3 mt-4" }, appsText && /* @__PURE__ */ React26.createElement("span", { className: "text-xs tracking-widest text-[#ffffff]/50 " }, appsText), /* @__PURE__ */ React26.createElement("div", { className: "flex items-center gap-4" }, appLogos.map((logo, idx) => /* @__PURE__ */ React26.createElement("div", { key: idx, className: "relative h-6 w-6 sm:h-7 sm:w-7 opacity-70 hover:opacity-100 transition-opacity invert" }, /* @__PURE__ */ React26.createElement(
|
|
2858
2877
|
Image3,
|
|
2859
2878
|
{
|
|
2860
2879
|
src: logo.src,
|
|
@@ -2896,7 +2915,7 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
2896
2915
|
}
|
|
2897
2916
|
return () => observer.disconnect();
|
|
2898
2917
|
}, []);
|
|
2899
|
-
return /* @__PURE__ */ React27.createElement("div", { className: "w-full py-16" }, /* @__PURE__ */ React27.createElement("div", { className: "w-full flex justify-center px-4" }, /* @__PURE__ */ React27.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ React27.createElement("div", { className: "relative overflow-hidden mb-12 text-left" }, /* @__PURE__ */ React27.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React27.createElement("span", { className: "text-
|
|
2918
|
+
return /* @__PURE__ */ React27.createElement("div", { className: "w-full py-16" }, /* @__PURE__ */ React27.createElement("div", { className: "w-full flex justify-center px-4" }, /* @__PURE__ */ React27.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ React27.createElement("div", { className: "relative overflow-hidden mb-12 text-left" }, /* @__PURE__ */ React27.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React27.createElement("span", { className: "text-xs tracking-[0.4em] text-stone-500 block mb-4 " }, tagline), /* @__PURE__ */ React27.createElement(
|
|
2900
2919
|
"h2",
|
|
2901
2920
|
{
|
|
2902
2921
|
ref: titleRef,
|
|
@@ -2910,18 +2929,28 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
2910
2929
|
const isNeutral = i === 2;
|
|
2911
2930
|
const getBgStyle = () => {
|
|
2912
2931
|
if (isWhite) return "bg-white";
|
|
2913
|
-
if (isBlack) return "bg-
|
|
2914
|
-
if (isNeutral) return "bg-
|
|
2915
|
-
return "bg-
|
|
2932
|
+
if (isBlack) return "bg-black";
|
|
2933
|
+
if (isNeutral) return "bg-stone-200";
|
|
2934
|
+
return "bg-stone-200";
|
|
2935
|
+
};
|
|
2936
|
+
const getShadowStyle = () => {
|
|
2937
|
+
if (isBlack) return `
|
|
2938
|
+
inset 0 1.5px 0 0 rgba(255, 255, 255, 0.2),
|
|
2939
|
+
inset 0 -3px 0 0 rgba(0, 0, 0, 0.3),
|
|
2940
|
+
0 4px 0 0 #0c0c0c,
|
|
2941
|
+
0 12px 24px rgba(0, 0, 0, 0.1)
|
|
2942
|
+
`;
|
|
2943
|
+
return "none";
|
|
2916
2944
|
};
|
|
2917
2945
|
const textColor = isBlack ? "text-white" : "text-black";
|
|
2918
|
-
const subTextColor = isBlack ? "text-
|
|
2919
|
-
const labelColor = isBlack ? "text-
|
|
2946
|
+
const subTextColor = isBlack ? "text-stone-300" : "text-stone-600";
|
|
2947
|
+
const labelColor = isBlack ? "text-stone-400" : "text-stone-500";
|
|
2920
2948
|
return /* @__PURE__ */ React27.createElement(
|
|
2921
2949
|
"div",
|
|
2922
2950
|
{
|
|
2923
2951
|
key: i,
|
|
2924
|
-
className: `relative rounded-
|
|
2952
|
+
className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-75 transition-all duration-500 group text-left ${getBgStyle()} ${f.size}`,
|
|
2953
|
+
style: { boxShadow: getShadowStyle() }
|
|
2925
2954
|
},
|
|
2926
2955
|
/* @__PURE__ */ React27.createElement(
|
|
2927
2956
|
"div",
|
|
@@ -2930,9 +2959,9 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
2930
2959
|
style: { backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")` }
|
|
2931
2960
|
}
|
|
2932
2961
|
),
|
|
2933
|
-
isBlack && /* @__PURE__ */ React27.createElement("span", { className: "absolute inset-0 rounded-
|
|
2962
|
+
isBlack && /* @__PURE__ */ React27.createElement("span", { className: "absolute inset-0 rounded-2xl bg-linear-to-b from-white/10 via-white/5 to-transparent pointer-events-none z-10" }),
|
|
2934
2963
|
/* @__PURE__ */ React27.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ React27.createElement("div", { className: `absolute -bottom-8 -right-8 transform group-hover:scale-110 transition-transform duration-700 ease-out ${isBlack ? "text-white/5" : "text-black/5"}` }, /* @__PURE__ */ React27.createElement(HugeiconsIcon20, { icon: f.icon, size: 180 }))),
|
|
2935
|
-
/* @__PURE__ */ React27.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ React27.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ React27.createElement("span", { className: `text-
|
|
2964
|
+
/* @__PURE__ */ React27.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ React27.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ React27.createElement("span", { className: `text-xs tracking-widest ${labelColor}` }, f.label), /* @__PURE__ */ React27.createElement("div", { className: `p-2 rounded-full transition-colors ${isBlack ? "bg-white/10" : "bg-white/50 backdrop-blur-sm"}` }, /* @__PURE__ */ React27.createElement(HugeiconsIcon20, { icon: f.icon, size: 20, className: textColor }))), /* @__PURE__ */ React27.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React27.createElement("h3", { className: `text-xl mb-2 tracking-tight ${textColor}` }, f.title), /* @__PURE__ */ React27.createElement("p", { className: `text-sm leading-relaxed max-w-sm ${subTextColor}` }, f.desc)))
|
|
2936
2965
|
);
|
|
2937
2966
|
})))));
|
|
2938
2967
|
};
|
|
@@ -3043,7 +3072,7 @@ var UniversalSecurityPage = ({
|
|
|
3043
3072
|
"button",
|
|
3044
3073
|
{
|
|
3045
3074
|
onClick: onBack,
|
|
3046
|
-
className: "flex items-center gap-2 text-
|
|
3075
|
+
className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none"
|
|
3047
3076
|
},
|
|
3048
3077
|
/* @__PURE__ */ React28.createElement(HugeiconsIcon21, { icon: ArrowLeft01Icon8, size: 16 }),
|
|
3049
3078
|
" Back"
|
|
@@ -3068,7 +3097,7 @@ var UniversalSecurityPage = ({
|
|
|
3068
3097
|
toggleLoading: isPasskeyLoading,
|
|
3069
3098
|
isLast: true
|
|
3070
3099
|
}
|
|
3071
|
-
))), isPasscodeModalOpen && /* @__PURE__ */ React28.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React28.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: closePasscodeModal }), /* @__PURE__ */ React28.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React28.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React28.createElement("h3", { className: "text-
|
|
3100
|
+
))), isPasscodeModalOpen && /* @__PURE__ */ React28.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React28.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: closePasscodeModal }), /* @__PURE__ */ React28.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React28.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React28.createElement("h3", { className: "text-sm text-black tracking-tight" }, hasPasscode ? "Change Passcode" : "Create Security Passcode"), /* @__PURE__ */ React28.createElement("button", { onClick: closePasscodeModal, disabled: isPasscodeSubmitting, className: "text-stone-400 hover:text-black transition-colors outline-none disabled:opacity-50" }, /* @__PURE__ */ React28.createElement(HugeiconsIcon21, { icon: CancelCircleIcon8, size: 18 }))), /* @__PURE__ */ React28.createElement("div", { className: "p-6" }, isPasscodeLoading ? /* @__PURE__ */ React28.createElement("div", { className: "flex flex-col items-center justify-center py-10" }, /* @__PURE__ */ React28.createElement(HugeiconsIcon21, { icon: Loading03Icon12, size: 28, className: "animate-spin text-stone-400 mb-4" })) : /* @__PURE__ */ React28.createElement("form", { onSubmit: handlePasscodeSubmit, className: "flex flex-col gap-6" }, hasPasscode && /* @__PURE__ */ React28.createElement(
|
|
3072
3101
|
TextInput,
|
|
3073
3102
|
{
|
|
3074
3103
|
type: "password",
|
|
@@ -3110,7 +3139,7 @@ var UniversalSecurityPage = ({
|
|
|
3110
3139
|
className: "w-full"
|
|
3111
3140
|
},
|
|
3112
3141
|
hasPasscode ? "Update Passcode" : "Set Passcode"
|
|
3113
|
-
)))))), showPasskeyModal && /* @__PURE__ */ React28.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React28.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShowPasskeyModal(false) }), /* @__PURE__ */ React28.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React28.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React28.createElement("h3", { className: "text-
|
|
3142
|
+
)))))), showPasskeyModal && /* @__PURE__ */ React28.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React28.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShowPasskeyModal(false) }), /* @__PURE__ */ React28.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React28.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React28.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Enable Passkey"), /* @__PURE__ */ React28.createElement("button", { onClick: () => !isSubmitting && setShowPasskeyModal(false), className: "text-stone-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React28.createElement(HugeiconsIcon21, { icon: CancelCircleIcon8, size: 18 }))), /* @__PURE__ */ React28.createElement("div", { className: "p-6 text-center" }, /* @__PURE__ */ React28.createElement("p", { className: "text-sm text-stone-500 mb-8 leading-relaxed" }, "Use your device's biometrics (Face ID, Touch ID, or PIN) to securely sign into your account without needing a password."), /* @__PURE__ */ React28.createElement(
|
|
3114
3143
|
ThreeDActionButton,
|
|
3115
3144
|
{
|
|
3116
3145
|
onClick: submitEnablePasskey,
|
|
@@ -3136,11 +3165,11 @@ var MenuRow3 = ({
|
|
|
3136
3165
|
"div",
|
|
3137
3166
|
{
|
|
3138
3167
|
onClick: disabled ? void 0 : onClick,
|
|
3139
|
-
className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${disabled ? "opacity-40 cursor-not-allowed" : "cursor-pointer hover:bg-
|
|
3168
|
+
className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${disabled ? "opacity-40 cursor-not-allowed" : "cursor-pointer hover:bg-stone-50"}`
|
|
3140
3169
|
},
|
|
3141
|
-
/* @__PURE__ */ React28.createElement("div", { className: "w-9 h-9 rounded-full border border-
|
|
3142
|
-
/* @__PURE__ */ React28.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React28.createElement("p", { className: `text-
|
|
3143
|
-
isToggle ? /* @__PURE__ */ React28.createElement("div", { className: `relative w-11 h-6 rounded-full transition-colors duration-300 ml-2 shrink-0 ${toggleState ? "bg-black" : "bg-
|
|
3170
|
+
/* @__PURE__ */ React28.createElement("div", { className: "w-9 h-9 rounded-full border border-stone-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React28.createElement(HugeiconsIcon21, { icon, size: 16, className: iconColor })),
|
|
3171
|
+
/* @__PURE__ */ React28.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React28.createElement("p", { className: `text-sm truncate ${titleColor}` }, title), /* @__PURE__ */ React28.createElement("p", { className: "text-xs text-stone-500 truncate" }, subtitle)),
|
|
3172
|
+
isToggle ? /* @__PURE__ */ React28.createElement("div", { className: `relative w-11 h-6 rounded-full transition-colors duration-300 ml-2 shrink-0 ${toggleState ? "bg-black" : "bg-stone-100"} ${disabled ? "opacity-50" : ""}` }, /* @__PURE__ */ React28.createElement("div", { className: `absolute top-1 left-1 w-4 h-4 rounded-full bg-white shadow-sm transition-transform duration-300 flex items-center justify-center ${toggleState ? "translate-x-5" : "translate-x-0"}` }, toggleLoading && /* @__PURE__ */ React28.createElement(HugeiconsIcon21, { icon: Loading03Icon12, size: 10, className: "animate-spin text-black" }))) : /* @__PURE__ */ React28.createElement(HugeiconsIcon21, { icon: ArrowRight01Icon7, size: 18, className: "text-stone-400 shrink-0 ml-2" })
|
|
3144
3173
|
);
|
|
3145
3174
|
|
|
3146
3175
|
// src/components/FeatureScroll.tsx
|
|
@@ -3151,7 +3180,7 @@ import { ArrowLeft01Icon as ArrowLeft01Icon9, ArrowRight01Icon as ArrowRight01Ic
|
|
|
3151
3180
|
var FeatureCard = ({ feature, bgImage }) => {
|
|
3152
3181
|
const [isBgLoading, setIsBgLoading] = useState22(true);
|
|
3153
3182
|
const [isFgLoading, setIsFgLoading] = useState22(!!feature.image);
|
|
3154
|
-
return /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col shrink-0 w-[90vw] sm:w-150 snap-center md:snap-start group cursor-grab active:cursor-grabbing" }, /* @__PURE__ */ React29.createElement("div", { className: "relative w-full aspect-16/10 bg-
|
|
3183
|
+
return /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col shrink-0 w-[90vw] sm:w-150 snap-center md:snap-start group cursor-grab active:cursor-grabbing" }, /* @__PURE__ */ React29.createElement("div", { className: "relative w-full aspect-16/10 bg-stone-100 rounded-2xl overflow-hidden mb-6 flex items-center justify-center" }, /* @__PURE__ */ React29.createElement(
|
|
3155
3184
|
Image4,
|
|
3156
3185
|
{
|
|
3157
3186
|
src: bgImage,
|
|
@@ -3172,7 +3201,7 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
3172
3201
|
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`
|
|
3173
3202
|
}
|
|
3174
3203
|
}
|
|
3175
|
-
), isFgLoading && feature.image && /* @__PURE__ */ React29.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-
|
|
3204
|
+
), isFgLoading && feature.image && /* @__PURE__ */ React29.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-stone-50/50 backdrop-blur-sm transition-opacity duration-300" }, /* @__PURE__ */ React29.createElement(HugeiconsIcon22, { icon: Loading03Icon13, size: 32, className: "animate-spin text-stone-400" })), feature.image && /* @__PURE__ */ React29.createElement("div", { className: "absolute -bottom-6 -right-6 w-[85%] h-[85%] z-10 transition-transform duration-700 ease-out group-hover:-translate-x-2 group-hover:-translate-y-2" }, /* @__PURE__ */ React29.createElement(
|
|
3176
3205
|
Image4,
|
|
3177
3206
|
{
|
|
3178
3207
|
src: feature.image,
|
|
@@ -3185,7 +3214,7 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
3185
3214
|
${isFgLoading ? "opacity-0 blur-xl" : "opacity-100 blur-0"}
|
|
3186
3215
|
`
|
|
3187
3216
|
}
|
|
3188
|
-
))), /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col text-left pr-4" }, /* @__PURE__ */ React29.createElement("h3", { className: " text-xl tracking-tight text-black mb-2" }, feature.title), /* @__PURE__ */ React29.createElement("p", { className: "text-
|
|
3217
|
+
))), /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col text-left pr-4" }, /* @__PURE__ */ React29.createElement("h3", { className: " text-xl tracking-tight text-black mb-2" }, feature.title), /* @__PURE__ */ React29.createElement("p", { className: "text-sm leading-relaxed text-stone-600 max-w-[90%]" }, feature.desc)));
|
|
3189
3218
|
};
|
|
3190
3219
|
var FeatureScroll = ({ tagline, headline, features }) => {
|
|
3191
3220
|
const scrollRef = useRef7(null);
|
|
@@ -3214,12 +3243,12 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3214
3243
|
"https://storage.googleapis.com/retina-cloud-v2/assets/images/bg_6.avif",
|
|
3215
3244
|
"https://storage.googleapis.com/retina-cloud-v2/assets/images/bg_1.avif"
|
|
3216
3245
|
];
|
|
3217
|
-
return /* @__PURE__ */ React29.createElement("section", { className: "py-24 w-full flex justify-center relative z-10 overflow-hidden" }, /* @__PURE__ */ React29.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col md:flex-row md:items-end justify-between gap-6 mb-12" }, /* @__PURE__ */ React29.createElement("div", { className: "relative z-10 text-left" }, /* @__PURE__ */ React29.createElement("span", { className: "text-
|
|
3246
|
+
return /* @__PURE__ */ React29.createElement("section", { className: "py-24 w-full flex justify-center relative z-10 overflow-hidden" }, /* @__PURE__ */ React29.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col md:flex-row md:items-end justify-between gap-6 mb-12" }, /* @__PURE__ */ React29.createElement("div", { className: "relative z-10 text-left" }, /* @__PURE__ */ React29.createElement("span", { className: "text-xs tracking-[0.4em] text-stone-500 block mb-4" }, tagline), /* @__PURE__ */ React29.createElement("h2", { className: " text-3xl tracking-tight text-black leading-[1.05]" }, headline)), /* @__PURE__ */ React29.createElement("div", { className: "hidden md:flex items-center gap-3" }, /* @__PURE__ */ React29.createElement(
|
|
3218
3247
|
"button",
|
|
3219
3248
|
{
|
|
3220
3249
|
onClick: () => scroll("left"),
|
|
3221
3250
|
disabled: !canScrollLeft,
|
|
3222
|
-
className: "p-4 border border-
|
|
3251
|
+
className: "p-4 border border-stone-200 rounded-full text-stone-500 hover:text-black hover:border-black disabled:opacity-30 disabled:hover:border-stone-200 disabled:hover:text-stone-500 disabled:cursor-not-allowed transition-all outline-none"
|
|
3223
3252
|
},
|
|
3224
3253
|
/* @__PURE__ */ React29.createElement(HugeiconsIcon22, { icon: ArrowLeft01Icon9, size: 20 })
|
|
3225
3254
|
), /* @__PURE__ */ React29.createElement(
|
|
@@ -3227,7 +3256,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3227
3256
|
{
|
|
3228
3257
|
onClick: () => scroll("right"),
|
|
3229
3258
|
disabled: !canScrollRight,
|
|
3230
|
-
className: "p-4 border border-
|
|
3259
|
+
className: "p-4 border border-stone-200 rounded-full text-stone-500 hover:text-black hover:border-black disabled:opacity-30 disabled:hover:border-stone-200 disabled:hover:text-stone-500 disabled:cursor-not-allowed transition-all outline-none"
|
|
3231
3260
|
},
|
|
3232
3261
|
/* @__PURE__ */ React29.createElement(HugeiconsIcon22, { icon: ArrowRight01Icon8, size: 20 })
|
|
3233
3262
|
))), /* @__PURE__ */ React29.createElement(
|
|
@@ -3243,7 +3272,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3243
3272
|
{
|
|
3244
3273
|
onClick: () => scroll("left"),
|
|
3245
3274
|
disabled: !canScrollLeft,
|
|
3246
|
-
className: "p-4 border border-
|
|
3275
|
+
className: "p-4 border border-stone-200 rounded-full text-stone-500 hover:text-black hover:border-black disabled:opacity-30 transition-all outline-none"
|
|
3247
3276
|
},
|
|
3248
3277
|
/* @__PURE__ */ React29.createElement(HugeiconsIcon22, { icon: ArrowLeft01Icon9, size: 20 })
|
|
3249
3278
|
), /* @__PURE__ */ React29.createElement(
|
|
@@ -3251,7 +3280,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3251
3280
|
{
|
|
3252
3281
|
onClick: () => scroll("right"),
|
|
3253
3282
|
disabled: !canScrollRight,
|
|
3254
|
-
className: "p-4 border border-
|
|
3283
|
+
className: "p-4 border border-stone-200 rounded-full text-stone-500 hover:text-black hover:border-black disabled:opacity-30 transition-all outline-none"
|
|
3255
3284
|
},
|
|
3256
3285
|
/* @__PURE__ */ React29.createElement(HugeiconsIcon22, { icon: ArrowRight01Icon8, size: 20 })
|
|
3257
3286
|
))));
|
|
@@ -3266,15 +3295,15 @@ var PlatformFeatures = ({
|
|
|
3266
3295
|
description,
|
|
3267
3296
|
features
|
|
3268
3297
|
}) => {
|
|
3269
|
-
return /* @__PURE__ */ React30.createElement("section", { className: "w-full flex justify-center mb-15 relative z-10" }, /* @__PURE__ */ React30.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col items-start mb-16 relative z-10" }, /* @__PURE__ */ React30.createElement("span", { className: "text-
|
|
3298
|
+
return /* @__PURE__ */ React30.createElement("section", { className: "w-full flex justify-center mb-15 relative z-10" }, /* @__PURE__ */ React30.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col items-start mb-16 relative z-10" }, /* @__PURE__ */ React30.createElement("span", { className: "text-xs tracking-[0.4em] text-stone-500 block mb-4" }, tagline), /* @__PURE__ */ React30.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.05] mb-6" }, headline), /* @__PURE__ */ React30.createElement("p", { className: "text-sm leading-[1.8] text-stone-600 max-w-2xl" }, description)), /* @__PURE__ */ React30.createElement("div", { className: "w-full h-px bg-stone-100 mb-16", "aria-hidden": "true" }), /* @__PURE__ */ React30.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-12" }, features.map((feature, idx) => /* @__PURE__ */ React30.createElement(
|
|
3270
3299
|
"div",
|
|
3271
3300
|
{
|
|
3272
3301
|
key: idx,
|
|
3273
3302
|
className: "flex flex-col group animate-in fade-in slide-in-from-bottom-4 duration-700 fill-mode-both",
|
|
3274
3303
|
style: { animationDelay: feature.delay || "0ms" }
|
|
3275
3304
|
},
|
|
3276
|
-
/* @__PURE__ */ React30.createElement("div", { className: "flex flex-row items-center gap-4 mb-4" }, /* @__PURE__ */ React30.createElement("div", { className: "w-14 h-14 shrink-0 rounded-xl border border-
|
|
3277
|
-
/* @__PURE__ */ React30.createElement("div", null, /* @__PURE__ */ React30.createElement("p", { className: "text-
|
|
3305
|
+
/* @__PURE__ */ React30.createElement("div", { className: "flex flex-row items-center gap-4 mb-4" }, /* @__PURE__ */ React30.createElement("div", { className: "w-14 h-14 shrink-0 rounded-xl border border-stone-200 flex items-center justify-center text-stone-600 transition-colors duration-300" }, /* @__PURE__ */ React30.createElement(HugeiconsIcon23, { icon: feature.icon, size: 24 })), /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ React30.createElement("span", { className: "text-xs tracking-widest text-stone-400 mb-0.5" }, feature.label || "CAPABILITY"), /* @__PURE__ */ React30.createElement("h3", { className: "text-xl tracking-tight text-black" }, feature.title))),
|
|
3306
|
+
/* @__PURE__ */ React30.createElement("div", null, /* @__PURE__ */ React30.createElement("p", { className: "text-sm leading-relaxed text-stone-600 pr-4" }, feature.desc))
|
|
3278
3307
|
)))));
|
|
3279
3308
|
};
|
|
3280
3309
|
|
|
@@ -3309,7 +3338,7 @@ var ManagedDocument = ({
|
|
|
3309
3338
|
}, []);
|
|
3310
3339
|
return (
|
|
3311
3340
|
// Outer layout wrapper (takes up available space, adds padding)
|
|
3312
|
-
/* @__PURE__ */ React31.createElement("div", { className: "grow pt-4 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React31.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ React31.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React31.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ React31.createElement("span", { className: "text-
|
|
3341
|
+
/* @__PURE__ */ React31.createElement("div", { className: "grow pt-4 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React31.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ React31.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React31.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ React31.createElement("span", { className: "text-xs tracking-[0.4em] text-stone-500 text-left block " }, tagline), /* @__PURE__ */ React31.createElement(
|
|
3313
3342
|
"h1",
|
|
3314
3343
|
{
|
|
3315
3344
|
ref: titleRef,
|
|
@@ -3317,7 +3346,7 @@ var ManagedDocument = ({
|
|
|
3317
3346
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
3318
3347
|
},
|
|
3319
3348
|
title
|
|
3320
|
-
)), sections.map((section, index) => /* @__PURE__ */ React31.createElement("div", { key: index, className: "relative px-5 md:px-12 py-8 md:py-10" }, section.heading && /* @__PURE__ */ React31.createElement("p", { className: " text-
|
|
3349
|
+
)), sections.map((section, index) => /* @__PURE__ */ React31.createElement("div", { key: index, className: "relative px-5 md:px-12 py-8 md:py-10" }, section.heading && /* @__PURE__ */ React31.createElement("p", { className: " text-xs tracking-[0.2em] text-black mb-4 text-left " }, section.heading), section.paragraphs && section.paragraphs.length > 0 && /* @__PURE__ */ React31.createElement("div", { className: "text-sm leading-[1.8] text-stone-700 space-y-4 text-left " }, section.paragraphs.map((text, pIndex) => /* @__PURE__ */ React31.createElement("p", { key: pIndex }, text))), section.quote && /* @__PURE__ */ React31.createElement("div", { className: `border-stone-200 border rounded-xl p-6 ${section.paragraphs && section.paragraphs.length > 0 ? "mt-6" : ""}` }, /* @__PURE__ */ React31.createElement("p", { className: "text-stone-900 text-sm md:text-sm leading-relaxed" }, '"', section.quote, '"')))), (contactText || contactEmail) && /* @__PURE__ */ React31.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ React31.createElement("p", { className: "text-xs text-stone-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ React31.createElement(
|
|
3321
3350
|
"a",
|
|
3322
3351
|
{
|
|
3323
3352
|
href: `mailto:${contactEmail}`,
|
|
@@ -3358,7 +3387,7 @@ var ManagedContactBlock = ({
|
|
|
3358
3387
|
backgroundRepeat: "repeat"
|
|
3359
3388
|
}
|
|
3360
3389
|
}
|
|
3361
|
-
), /* @__PURE__ */ React32.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React32.createElement("div", { className: "relative px-8 md:px-12 py-10" }, tagline && /* @__PURE__ */ React32.createElement("span", { className: "text-
|
|
3390
|
+
), /* @__PURE__ */ React32.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React32.createElement("div", { className: "relative px-8 md:px-12 py-10" }, tagline && /* @__PURE__ */ React32.createElement("span", { className: "text-xs tracking-[0.4em] text-stone-500 text-left block " }, tagline), /* @__PURE__ */ React32.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ React32.createElement("div", { className: "relative px-8 md:px-12 py-8 pb-14" }, /* @__PURE__ */ React32.createElement("div", { className: "flex flex-wrap gap-12 lg:gap-16 w-full" }, company && /* @__PURE__ */ React32.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ React32.createElement("p", { className: "text-sm tracking-[0.2em] text-black mb-4 " }, "Contact Details"), /* @__PURE__ */ React32.createElement("div", { className: "space-y-3 text-xs text-stone-600 leading-[1.8]" }, company.name && /* @__PURE__ */ React32.createElement("p", { className: "text-black" }, company.name), company.lines && company.lines.map((line, idx) => /* @__PURE__ */ React32.createElement("p", { key: idx }, line)), company.phone && /* @__PURE__ */ React32.createElement("p", { className: "pt-2" }, /* @__PURE__ */ React32.createElement(
|
|
3362
3391
|
"a",
|
|
3363
3392
|
{
|
|
3364
3393
|
href: `tel:${company.phone.replace(/\s+/g, "")}`,
|
|
@@ -3372,24 +3401,24 @@ var ManagedContactBlock = ({
|
|
|
3372
3401
|
className: "transition-colors hover:text-black"
|
|
3373
3402
|
},
|
|
3374
3403
|
company.phone2
|
|
3375
|
-
)))), emails && emails.length > 0 && /* @__PURE__ */ React32.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ React32.createElement("p", { className: "text-
|
|
3404
|
+
)))), emails && emails.length > 0 && /* @__PURE__ */ React32.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ React32.createElement("p", { className: "text-sm tracking-[0.2em] text-black mb-4 " }, "Email Directory"), /* @__PURE__ */ React32.createElement("div", { className: "space-y-6 text-sm" }, emails.map((email, idx) => /* @__PURE__ */ React32.createElement("div", { key: idx }, /* @__PURE__ */ React32.createElement("p", { className: "text-xs tracking-[0.2em] mb-1.5 text-stone-500 " }, email.label), /* @__PURE__ */ React32.createElement(
|
|
3376
3405
|
SecureEmail,
|
|
3377
3406
|
{
|
|
3378
3407
|
user: email.user,
|
|
3379
3408
|
domain: email.domain,
|
|
3380
|
-
className: "text-
|
|
3409
|
+
className: "text-stone-600 transition-colors hover:text-black"
|
|
3381
3410
|
}
|
|
3382
|
-
))))), socials && socials.length > 0 && /* @__PURE__ */ React32.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ React32.createElement("p", { className: "text-
|
|
3411
|
+
))))), socials && socials.length > 0 && /* @__PURE__ */ React32.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ React32.createElement("p", { className: "text-sm tracking-[0.2em] text-black mb-4 " }, "Find Us Online"), /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col space-y-5 pt-1" }, socials.map((social, idx) => /* @__PURE__ */ React32.createElement(
|
|
3383
3412
|
"a",
|
|
3384
3413
|
{
|
|
3385
3414
|
key: idx,
|
|
3386
3415
|
href: social.href,
|
|
3387
3416
|
target: "_blank",
|
|
3388
3417
|
rel: "noopener noreferrer",
|
|
3389
|
-
className: "flex items-center gap-3 transition-colors group text-
|
|
3418
|
+
className: "flex items-center gap-3 transition-colors group text-stone-600 hover:text-black"
|
|
3390
3419
|
},
|
|
3391
3420
|
/* @__PURE__ */ React32.createElement(HugeiconsIcon24, { icon: social.icon, size: 18 }),
|
|
3392
|
-
/* @__PURE__ */ React32.createElement("span", { className: "text-
|
|
3421
|
+
/* @__PURE__ */ React32.createElement("span", { className: "text-xs" }, social.label)
|
|
3393
3422
|
)))))))));
|
|
3394
3423
|
};
|
|
3395
3424
|
|
|
@@ -3428,7 +3457,7 @@ var ManagedPricingBlock = ({
|
|
|
3428
3457
|
}, []);
|
|
3429
3458
|
const hasTabs = tabs && tabs.length > 0;
|
|
3430
3459
|
const currentPlans = hasTabs ? tabs[activeTabIndex].plans : plans;
|
|
3431
|
-
return /* @__PURE__ */ React33.createElement("div", { className: "grow pt-10 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React33.createElement("div", { className: "w-full max-w-5xl mx-auto flex flex-col items-center" }, /* @__PURE__ */ React33.createElement("div", { className: "w-full flex flex-col items-center text-center mb-10 sm:mb-12" }, tagline && /* @__PURE__ */ React33.createElement("span", { className: "text-
|
|
3460
|
+
return /* @__PURE__ */ React33.createElement("div", { className: "grow pt-10 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React33.createElement("div", { className: "w-full max-w-5xl mx-auto flex flex-col items-center" }, /* @__PURE__ */ React33.createElement("div", { className: "w-full flex flex-col items-center text-center mb-10 sm:mb-12" }, tagline && /* @__PURE__ */ React33.createElement("span", { className: "text-xs tracking-[0.4em] text-black block " }, tagline), /* @__PURE__ */ React33.createElement(
|
|
3432
3461
|
"h1",
|
|
3433
3462
|
{
|
|
3434
3463
|
ref: titleRef,
|
|
@@ -3443,7 +3472,7 @@ var ManagedPricingBlock = ({
|
|
|
3443
3472
|
{
|
|
3444
3473
|
key: idx,
|
|
3445
3474
|
onClick: () => setActiveTabIndex(idx),
|
|
3446
|
-
className: `px-4 py-1.5 rounded-full text-
|
|
3475
|
+
className: `px-4 py-1.5 rounded-full text-xs transition-all duration-200 outline-none whitespace-nowrap shrink-0 ${isActive ? "bg-stone-50 text-black " : "text-stone-500 hover:text-black hover:bg-stone-50/50 "}`
|
|
3447
3476
|
},
|
|
3448
3477
|
tab.label
|
|
3449
3478
|
);
|
|
@@ -3453,7 +3482,7 @@ var ManagedPricingBlock = ({
|
|
|
3453
3482
|
key: `${activeTabIndex}-${planIdx}`,
|
|
3454
3483
|
className: `bg-white rounded-3xl p-6 flex flex-col relative overflow-hidden transition-all duration-300 ${plan.isPremium ? "" : ""}`
|
|
3455
3484
|
},
|
|
3456
|
-
/* @__PURE__ */ React33.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React33.createElement("span", { className: "text-black text-base block mb-1" }, plan.name), /* @__PURE__ */ React33.createElement("div", { className: "flex items-baseline gap-1" }, /* @__PURE__ */ React33.createElement("h3", { className: "text-3xl font-light text-black" }, plan.price), plan.period && /* @__PURE__ */ React33.createElement("span", { className: "text-xs text-
|
|
3485
|
+
/* @__PURE__ */ React33.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React33.createElement("span", { className: "text-black text-base block mb-1" }, plan.name), /* @__PURE__ */ React33.createElement("div", { className: "flex items-baseline gap-1" }, /* @__PURE__ */ React33.createElement("h3", { className: "text-3xl font-light text-black" }, plan.price), plan.period && /* @__PURE__ */ React33.createElement("span", { className: "text-xs text-stone-500" }, plan.period)), /* @__PURE__ */ React33.createElement("p", { className: "text-xs text-stone-500 mt-2 min-h-8" }, plan.description), plan.showApps && plan.appLogos && plan.appLogos.length > 0 && /* @__PURE__ */ React33.createElement("div", { className: "flex items-center gap-2 mt-4" }, plan.appLogos.map((logo, logoIdx) => /* @__PURE__ */ React33.createElement(
|
|
3457
3486
|
"div",
|
|
3458
3487
|
{
|
|
3459
3488
|
key: logoIdx,
|
|
@@ -3474,14 +3503,14 @@ var ManagedPricingBlock = ({
|
|
|
3474
3503
|
Link7,
|
|
3475
3504
|
{
|
|
3476
3505
|
href: plan.ctaHref,
|
|
3477
|
-
className: "w-full py-2 px-5 rounded-full border border-
|
|
3506
|
+
className: "w-full py-2.5 px-5 rounded-full border border-stone-200 text-center text-black text-xs hover:bg-stone-50 transition-colors mb-6 outline-none block"
|
|
3478
3507
|
},
|
|
3479
3508
|
plan.ctaText
|
|
3480
3509
|
),
|
|
3481
3510
|
/* @__PURE__ */ React33.createElement("div", { className: "flex flex-col gap-3" }, plan.features.map((feature, featureIdx) => {
|
|
3482
3511
|
const isAvailable = feature.value !== false;
|
|
3483
3512
|
const valueText = typeof feature.value === "string" ? feature.value : "";
|
|
3484
|
-
return /* @__PURE__ */ React33.createElement("div", { key: featureIdx, className: "flex items-center gap-2.5" }, isAvailable ? /* @__PURE__ */ React33.createElement(CheckIcon, null) : /* @__PURE__ */ React33.createElement(CrossIcon, null), /* @__PURE__ */ React33.createElement("span", { className: `text-xs truncate ${isAvailable ? "text-
|
|
3513
|
+
return /* @__PURE__ */ React33.createElement("div", { key: featureIdx, className: "flex items-center gap-2.5" }, isAvailable ? /* @__PURE__ */ React33.createElement(CheckIcon, null) : /* @__PURE__ */ React33.createElement(CrossIcon, null), /* @__PURE__ */ React33.createElement("span", { className: `text-xs truncate ${isAvailable ? "text-stone-800" : "text-stone-400"}` }, feature.name, valueText && /* @__PURE__ */ React33.createElement("span", { className: "text-stone-500 ml-1" }, "(", valueText, ")")));
|
|
3485
3514
|
}))
|
|
3486
3515
|
)))));
|
|
3487
3516
|
};
|
|
@@ -3497,7 +3526,7 @@ var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ React34.
|
|
|
3497
3526
|
href,
|
|
3498
3527
|
target: "_blank",
|
|
3499
3528
|
rel: "noopener noreferrer",
|
|
3500
|
-
className: "text-
|
|
3529
|
+
className: "text-stone-400 hover:text-black transition-colors"
|
|
3501
3530
|
},
|
|
3502
3531
|
/* @__PURE__ */ React34.createElement(HugeiconsIcon25, { icon, size: 16 })
|
|
3503
3532
|
);
|
|
@@ -3517,7 +3546,7 @@ var ManagedBoardBlock = ({
|
|
|
3517
3546
|
backgroundRepeat: "repeat"
|
|
3518
3547
|
}
|
|
3519
3548
|
}
|
|
3520
|
-
), /* @__PURE__ */ React34.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React34.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ React34.createElement("span", { className: "text-
|
|
3549
|
+
), /* @__PURE__ */ React34.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React34.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ React34.createElement("span", { className: "text-xs tracking-[0.4em] text-stone-500 text-left block " }, tagline), /* @__PURE__ */ React34.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ React34.createElement("div", { className: "relative px-5 md:px-12 py-4 md:py-8" }, /* @__PURE__ */ React34.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5 md:gap-8" }, members.map((member, idx) => /* @__PURE__ */ React34.createElement("div", { key: idx, className: "relative p-6 md:p-8 rounded-2xl bg-white flex flex-col transition-all group" }, /* @__PURE__ */ React34.createElement("div", { className: "flex items-start space-x-4 md:space-x-5 mb-5 md:mb-6" }, /* @__PURE__ */ React34.createElement("div", { className: "relative w-14 h-14 md:w-16 md:h-16 shrink-0 bg-white overflow-hidden rounded-xl" }, /* @__PURE__ */ React34.createElement(
|
|
3521
3550
|
Image6,
|
|
3522
3551
|
{
|
|
3523
3552
|
src: member.imageSrc,
|
|
@@ -3526,7 +3555,7 @@ var ManagedBoardBlock = ({
|
|
|
3526
3555
|
sizes: "(max-width: 768px) 56px, 64px",
|
|
3527
3556
|
className: "object-cover grayscale opacity-100 transition-opacity"
|
|
3528
3557
|
}
|
|
3529
|
-
)), /* @__PURE__ */ React34.createElement("div", { className: "pt-1" }, /* @__PURE__ */ React34.createElement("h3", { className: " text-
|
|
3558
|
+
)), /* @__PURE__ */ React34.createElement("div", { className: "pt-1" }, /* @__PURE__ */ React34.createElement("h3", { className: " text-sm text-black tracking-tight" }, member.name), /* @__PURE__ */ React34.createElement("p", { className: "text-xs tracking-[0.2em] text-stone-500 mt-1.5 " }, member.title))), /* @__PURE__ */ React34.createElement("p", { className: "text-xs leading-[1.8] text-stone-600 text-left grow mb-8" }, member.bio), /* @__PURE__ */ React34.createElement("div", { className: "space-y-6 mt-auto" }, /* @__PURE__ */ React34.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ React34.createElement(ThreeDButton, { href: member.website }, "Visit Website")), /* @__PURE__ */ React34.createElement("div", { className: "flex space-x-4 pt-5" }, member.twitterHandle && member.twitterHandle.length > 0 && /* @__PURE__ */ React34.createElement(
|
|
3530
3559
|
MemberSocialLink,
|
|
3531
3560
|
{
|
|
3532
3561
|
href: `https://x.com/${member.twitterHandle}`,
|
|
@@ -3542,7 +3571,7 @@ var ManagedBoardBlock = ({
|
|
|
3542
3571
|
label: "LinkedIn",
|
|
3543
3572
|
name: member.name
|
|
3544
3573
|
}
|
|
3545
|
-
))))))), (contactText || contactEmail) && /* @__PURE__ */ React34.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ React34.createElement("p", { className: "text-
|
|
3574
|
+
))))))), (contactText || contactEmail) && /* @__PURE__ */ React34.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ React34.createElement("p", { className: "text-xs text-stone-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ React34.createElement("a", { href: `mailto:${contactEmail}`, className: "text-black decoration-black decoration-2 underline-offset-4 ml-1 transition-colors" }, contactEmail))))));
|
|
3546
3575
|
};
|
|
3547
3576
|
|
|
3548
3577
|
// src/components/ManagedNotFoundBlock.tsx
|
|
@@ -3556,10 +3585,10 @@ var ManagedNotFoundBlock = ({
|
|
|
3556
3585
|
{
|
|
3557
3586
|
xmlns: "http://www.w3.org/2000/svg",
|
|
3558
3587
|
viewBox: "0 0 24 24",
|
|
3559
|
-
className: "w-12 h-12 fill-
|
|
3588
|
+
className: "w-12 h-12 fill-stone-100"
|
|
3560
3589
|
},
|
|
3561
3590
|
/* @__PURE__ */ React35.createElement("path", { fillRule: "evenodd", d: "M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zM12 8.25a.75.75 0 01.75.75v3.75a.75.75 0 01-1.5 0V9a.75.75 0 01.75-.75zm0 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z", clipRule: "evenodd" })
|
|
3562
|
-
)), /* @__PURE__ */ React35.createElement("h1", { className: " text-xl md:text-3xl text-black tracking-tight mb-4" }, title), /* @__PURE__ */ React35.createElement("p", { className: "text-
|
|
3591
|
+
)), /* @__PURE__ */ React35.createElement("h1", { className: " text-xl md:text-3xl text-black tracking-tight mb-4" }, title), /* @__PURE__ */ React35.createElement("p", { className: "text-sm leading-[1.8] text-stone-600 mb-12" }, description)));
|
|
3563
3592
|
};
|
|
3564
3593
|
|
|
3565
3594
|
// src/components/ManagedNewsletterSplitBlock.tsx
|
|
@@ -3612,11 +3641,11 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
3612
3641
|
backgroundRepeat: "repeat"
|
|
3613
3642
|
}
|
|
3614
3643
|
}
|
|
3615
|
-
), /* @__PURE__ */ React36.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React36.createElement("div", { className: "mb-10 border-b border-
|
|
3644
|
+
), /* @__PURE__ */ React36.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React36.createElement("div", { className: "mb-10 border-b border-stone-200 pb-8 text-center md:text-left" }, tagline && /* @__PURE__ */ React36.createElement("span", { className: "text-xs tracking-[0.4em] text-stone-500 " }, tagline), /* @__PURE__ */ React36.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight mb-4" }, title), subtitle && /* @__PURE__ */ React36.createElement("p", { className: "text-xs tracking-[0.2em] text-stone-500 " }, subtitle)), /* @__PURE__ */ React36.createElement("p", { className: "text-sm leading-[1.8] text-stone-600 mb-10 text-center md:text-left" }, description), children && /* @__PURE__ */ React36.createElement("div", { className: "mb-8 text-left" }, children), /* @__PURE__ */ React36.createElement("div", { className: "text-center md:text-left mt-10 space-y-6" }, dividerText && /* @__PURE__ */ React36.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React36.createElement("div", { className: "grow h-px bg-stone-100" }), /* @__PURE__ */ React36.createElement("span", { className: "shrink mx-4 text-xs tracking-[0.2em] text-stone-400 " }, dividerText), /* @__PURE__ */ React36.createElement("div", { className: "grow h-px bg-stone-100" })), ctaText && ctaHref && /* @__PURE__ */ React36.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ React36.createElement(
|
|
3616
3645
|
ThreeDButton,
|
|
3617
3646
|
{
|
|
3618
3647
|
href: ctaHref,
|
|
3619
|
-
className: "py-3 tracking-widest text-
|
|
3648
|
+
className: "py-3 tracking-widest text-xs"
|
|
3620
3649
|
},
|
|
3621
3650
|
ctaText
|
|
3622
3651
|
)))))));
|
|
@@ -3672,7 +3701,7 @@ var PortfolioHero = ({
|
|
|
3672
3701
|
ref: heroContentRef,
|
|
3673
3702
|
className: "w-full opacity-0 translate-y-5 transition-all duration-1000 ease-out relative z-10"
|
|
3674
3703
|
},
|
|
3675
|
-
/* @__PURE__ */ React37.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-10" }, /* @__PURE__ */ React37.createElement("div", { className: "relative w-20 h-20 sm:w-32 sm:h-32 rounded-full overflow-hidden border border-
|
|
3704
|
+
/* @__PURE__ */ React37.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-10" }, /* @__PURE__ */ React37.createElement("div", { className: "relative w-20 h-20 sm:w-32 sm:h-32 rounded-full overflow-hidden border border-stone-200 shrink-0 shadow-sm" }, /* @__PURE__ */ React37.createElement(
|
|
3676
3705
|
Image8,
|
|
3677
3706
|
{
|
|
3678
3707
|
src: imageSrc,
|
|
@@ -3683,29 +3712,29 @@ var PortfolioHero = ({
|
|
|
3683
3712
|
sizes: "(max-width: 640px) 80px, 128px",
|
|
3684
3713
|
quality: 100
|
|
3685
3714
|
}
|
|
3686
|
-
)), /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col text-left" }, /* @__PURE__ */ React37.createElement("h1", { className: " text-3xl sm:text-5xl lg:text-6xl tracking-tight text-black leading-none mb-3" }, name), socialLabel && /* @__PURE__ */ React37.createElement("span", { className: "text-
|
|
3715
|
+
)), /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col text-left" }, /* @__PURE__ */ React37.createElement("h1", { className: " text-3xl sm:text-5xl lg:text-6xl tracking-tight text-black leading-none mb-3" }, name), socialLabel && /* @__PURE__ */ React37.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-500 " }, socialLabel), socialLinkText && socialLinkHref && /* @__PURE__ */ React37.createElement(
|
|
3687
3716
|
"a",
|
|
3688
3717
|
{
|
|
3689
3718
|
href: socialLinkHref,
|
|
3690
3719
|
target: "_blank",
|
|
3691
3720
|
rel: "noopener noreferrer",
|
|
3692
|
-
className: "text-
|
|
3721
|
+
className: "text-xs md:text-sm text-black hover:text-stone-500 transition-colors mt-1 underline underline-offset-4 decoration-stone-300"
|
|
3693
3722
|
},
|
|
3694
3723
|
socialLinkText
|
|
3695
3724
|
))),
|
|
3696
|
-
/* @__PURE__ */ React37.createElement("p", { className: "text-
|
|
3725
|
+
/* @__PURE__ */ React37.createElement("p", { className: "text-sm leading-[1.8] max-w-4xl mb-12 text-stone-600" }, bio),
|
|
3697
3726
|
/* @__PURE__ */ React37.createElement("div", { className: "flex flex-col sm:flex-row gap-4 w-full sm:w-auto" }, primaryCtaText && primaryCtaHref && /* @__PURE__ */ React37.createElement("div", { className: "w-full sm:w-auto *:w-full" }, /* @__PURE__ */ React37.createElement(
|
|
3698
3727
|
ThreeDButton,
|
|
3699
3728
|
{
|
|
3700
3729
|
href: primaryCtaHref,
|
|
3701
|
-
className: "py-3 tracking-widest text-
|
|
3730
|
+
className: "py-3 tracking-widest text-xs"
|
|
3702
3731
|
},
|
|
3703
3732
|
primaryCtaText
|
|
3704
3733
|
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ React37.createElement(
|
|
3705
3734
|
Link8,
|
|
3706
3735
|
{
|
|
3707
3736
|
href: secondaryCtaHref,
|
|
3708
|
-
className: "w-full sm:w-auto inline-flex items-center justify-center gap-3 text-
|
|
3737
|
+
className: "w-full sm:w-auto inline-flex items-center justify-center gap-3 text-xs tracking-[0.2em] rounded-full px-8 py-3.5 bg-stone-200 transition-colors text-black hover:bg-stone-50 outline-none"
|
|
3709
3738
|
},
|
|
3710
3739
|
secondaryCtaText,
|
|
3711
3740
|
/* @__PURE__ */ React37.createElement(HugeiconsIcon26, { icon: ArrowRight01Icon9, size: 16 })
|
|
@@ -3726,7 +3755,7 @@ var GifFeatureCard = ({
|
|
|
3726
3755
|
className = "aspect-video"
|
|
3727
3756
|
}) => {
|
|
3728
3757
|
const [isLoading, setIsLoading] = useState26(true);
|
|
3729
|
-
return /* @__PURE__ */ React38.createElement("div", { className: `relative w-full bg-black overflow-hidden
|
|
3758
|
+
return /* @__PURE__ */ React38.createElement("div", { className: `relative w-full bg-black overflow-hidden ${className}` }, isLoading && /* @__PURE__ */ React38.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-black" }, /* @__PURE__ */ React38.createElement(
|
|
3730
3759
|
HugeiconsIcon27,
|
|
3731
3760
|
{
|
|
3732
3761
|
icon: Loading03Icon14,
|
|
@@ -3754,7 +3783,7 @@ var GifFeatureCard = ({
|
|
|
3754
3783
|
{
|
|
3755
3784
|
className: "absolute inset-x-0 bottom-0 h-1/2 sm:h-2/3 bg-linear-to-t from-black/95 via-black/40 to-transparent z-10 pointer-events-none transition-opacity duration-700"
|
|
3756
3785
|
}
|
|
3757
|
-
), /* @__PURE__ */ React38.createElement("div", { className: "absolute inset-x-0 bottom-0 p-6 sm:p-8 z-30 flex flex-col justify-end text-left pointer-events-none" }, title && /* @__PURE__ */ React38.createElement("h3", { className: "
|
|
3786
|
+
), /* @__PURE__ */ React38.createElement("div", { className: "absolute inset-x-0 bottom-0 p-6 sm:p-8 z-30 flex flex-col justify-end text-left pointer-events-none" }, title && /* @__PURE__ */ React38.createElement("h3", { className: "text-2xl md:text-3xl text-white tracking-tight mb-2 sm:mb-3 drop-shadow-md" }, title), subtitle && /* @__PURE__ */ React38.createElement("p", { className: "text-xs leading-relaxed text-stone-300 max-w-2xl drop-shadow-sm" }, subtitle)));
|
|
3758
3787
|
};
|
|
3759
3788
|
|
|
3760
3789
|
// src/components/MedicalFeatureStatsBlock.tsx
|
|
@@ -3795,7 +3824,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3795
3824
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
3796
3825
|
},
|
|
3797
3826
|
bottomHeadline
|
|
3798
|
-
), /* @__PURE__ */ React39.createElement("p", { className: "text-
|
|
3827
|
+
), /* @__PURE__ */ React39.createElement("p", { className: "text-sm leading-relaxed text-stone-500" }, bottomDescription)), /* @__PURE__ */ React39.createElement("div", { className: "flex items-center gap-4 shrink-0" }, /* @__PURE__ */ React39.createElement("div", { className: "flex -space-x-3" }, avatars.map((src, i) => /* @__PURE__ */ React39.createElement("div", { key: i, className: "relative w-12 h-12 rounded-full border-[3px] border-white overflow-hidden bg-stone-100 z-1 hover:z-10 transition-all" }, /* @__PURE__ */ React39.createElement(
|
|
3799
3828
|
Image10,
|
|
3800
3829
|
{
|
|
3801
3830
|
src,
|
|
@@ -3804,7 +3833,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3804
3833
|
sizes: "48px",
|
|
3805
3834
|
className: "object-cover"
|
|
3806
3835
|
}
|
|
3807
|
-
)))), /* @__PURE__ */ React39.createElement("p", { className: "text-
|
|
3836
|
+
)))), /* @__PURE__ */ React39.createElement("p", { className: "text-xs text-stone-800 leading-[1.4] max-w-55" }, trustText))), /* @__PURE__ */ React39.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6" }, stats.map((stat, idx) => /* @__PURE__ */ React39.createElement("div", { key: idx, className: "bg-white rounded-4xl p-8 md:p-10 flex flex-col h-70" }, /* @__PURE__ */ React39.createElement("div", { className: "flex items-center p-0.5 mb-6" }, /* @__PURE__ */ React39.createElement("span", { className: "text-sm text-stone-500 tracking-wide" }, stat.label)), /* @__PURE__ */ React39.createElement("h1", { className: "text-6xl gradient-text md:text-[80px] tracking-tighter text-black mt-auto leading-none" }, stat.value))))));
|
|
3808
3837
|
};
|
|
3809
3838
|
|
|
3810
3839
|
// src/components/ConsultantShowcase.tsx
|
|
@@ -3814,7 +3843,7 @@ import { HugeiconsIcon as HugeiconsIcon28 } from "@hugeicons/react";
|
|
|
3814
3843
|
import { Loading03Icon as Loading03Icon15 } from "@hugeicons/core-free-icons";
|
|
3815
3844
|
var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
3816
3845
|
const [isLoading, setIsLoading] = useState28(true);
|
|
3817
|
-
return /* @__PURE__ */ React40.createElement("div", { className: `absolute inset-0 bg-
|
|
3846
|
+
return /* @__PURE__ */ React40.createElement("div", { className: `absolute inset-0 bg-stone-800 ${className}` }, isLoading && /* @__PURE__ */ React40.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-stone-800/50 backdrop-blur-md transition-opacity duration-300" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon28, { icon: Loading03Icon15, size: 24, className: "animate-spin text-white/50" })), /* @__PURE__ */ React40.createElement(
|
|
3818
3847
|
Image11,
|
|
3819
3848
|
{
|
|
3820
3849
|
src,
|
|
@@ -3863,7 +3892,7 @@ var ConsultantShowcase = ({
|
|
|
3863
3892
|
return /* @__PURE__ */ React40.createElement("section", { className: "py-24 w-full flex justify-center px-4 md:px-8 z-10 relative" }, /* @__PURE__ */ React40.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ React40.createElement(
|
|
3864
3893
|
"div",
|
|
3865
3894
|
{
|
|
3866
|
-
className: "relative w-full h-100 md:h-112.5 rounded-4xl overflow-hidden bg-
|
|
3895
|
+
className: "relative w-full h-100 md:h-112.5 rounded-4xl overflow-hidden bg-stone-900 group select-none",
|
|
3867
3896
|
onTouchStart,
|
|
3868
3897
|
onTouchMove,
|
|
3869
3898
|
onTouchEnd
|
|
@@ -3886,7 +3915,7 @@ var ConsultantShowcase = ({
|
|
|
3886
3915
|
),
|
|
3887
3916
|
/* @__PURE__ */ React40.createElement("div", { className: "absolute inset-0 bg-black/20 z-10 pointer-events-none" }),
|
|
3888
3917
|
/* @__PURE__ */ React40.createElement("div", { className: "absolute top-0 left-0 w-full h-[60%] bg-linear-to-b from-black/80 via-black/30 to-transparent z-20 pointer-events-none" }),
|
|
3889
|
-
/* @__PURE__ */ React40.createElement("div", { className: `absolute top-8 left-8 md:top-12 md:left-12 z-30 text-white max-w-lg transition-transform duration-700 ease-out ${isActive ? "translate-y-0" : "-translate-y-4"}` }, /* @__PURE__ */ React40.createElement("h2", { className: "text-
|
|
3918
|
+
/* @__PURE__ */ React40.createElement("div", { className: `absolute top-8 left-8 md:top-12 md:left-12 z-30 text-white max-w-lg transition-transform duration-700 ease-out ${isActive ? "translate-y-0" : "-translate-y-4"}` }, /* @__PURE__ */ React40.createElement("h2", { className: "text-lg tracking-tight mb-2 leading-none" }, profile.name), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-0.5" }, /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-white/80 tracking-wide" }, profile.role), profile.description && /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-white/80 tracking-wide mt-1" }, profile.description)))
|
|
3890
3919
|
);
|
|
3891
3920
|
}),
|
|
3892
3921
|
/* @__PURE__ */ React40.createElement("div", { className: "absolute top-0 left-0 w-[20%] h-full z-40 cursor-w-resize hidden md:block", onClick: prevSlide }),
|
|
@@ -3920,9 +3949,9 @@ var ContentGridBlock = ({
|
|
|
3920
3949
|
bgDecoRotation_1,
|
|
3921
3950
|
bgDecoRotation_2
|
|
3922
3951
|
}) => {
|
|
3923
|
-
return /* @__PURE__ */ React41.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React41.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ React41.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ React41.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ React41.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ React41.createElement("div", { className: "bg-black rounded-3xl p-8 flex flex-col mx-h-95" }, /* @__PURE__ */ React41.createElement("p", { className: "text-
|
|
3952
|
+
return /* @__PURE__ */ React41.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React41.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ React41.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ React41.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ React41.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ React41.createElement("div", { className: "bg-black rounded-3xl p-8 flex flex-col mx-h-95" }, /* @__PURE__ */ React41.createElement("p", { className: "text-sm text-white leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ React41.createElement("span", { className: "mb-auto text-xs text-stone-100 tracking-widest" }, leftCard.tag), /* @__PURE__ */ React41.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ React41.createElement("div", null, /* @__PURE__ */ React41.createElement("h4", { className: "text-sm text-white" }, leftCard.title), /* @__PURE__ */ React41.createElement("p", { className: "text-xs text-stone-300" }, leftCard.subtitle)), /* @__PURE__ */ React41.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React41.createElement(Image12, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React41.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative mx-h-95" }, /* @__PURE__ */ React41.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ React41.createElement("span", { className: "text-xs text-stone-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ React41.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React41.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ React41.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ React41.createElement(Image12, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ React41.createElement("span", { className: "text-sm text-stone-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ React41.createElement("div", { className: "grow flex flex-col mt-10 justify-center items-center py-6" }, /* @__PURE__ */ React41.createElement("div", { className: "px-5 py-2 rounded-full bg-stone-50/50 border border-stone-200 text-sm text-stone-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ React41.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ React41.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React41.createElement("p", { className: "text-xs text-stone-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ React41.createElement("p", { className: "text-sm text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ React41.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col mx-h-95" }, /* @__PURE__ */ React41.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ React41.createElement("div", null, /* @__PURE__ */ React41.createElement("h4", { className: "text-sm text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ React41.createElement("p", { className: "text-xs text-stone-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ React41.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React41.createElement(Image12, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ React41.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React41.createElement("p", { className: "text-sm text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ React41.createElement("span", { className: "text-xs text-stone-400 tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => {
|
|
3924
3953
|
const isSecondCard = idx === 1;
|
|
3925
|
-
const cardBgColor = isSecondCard ? bgColor_2 || "bg-[#ffffff]" : bgColor_1 || "bg-[#
|
|
3954
|
+
const cardBgColor = isSecondCard ? bgColor_2 || "bg-[#ffffff]" : bgColor_1 || "bg-[#d97757]";
|
|
3926
3955
|
const defaultDeco_a = "https://storage.googleapis.com/retina-cloud-v2/assets/images/deco_a.avif";
|
|
3927
3956
|
const defaultDeco_b = "https://storage.googleapis.com/retina-cloud-v2/assets/images/deco_b.avif";
|
|
3928
3957
|
const bgDecoImage = isSecondCard ? bgDeco_2 || defaultDeco_b : bgDeco_1 || defaultDeco_a;
|
|
@@ -3942,7 +3971,7 @@ var ContentGridBlock = ({
|
|
|
3942
3971
|
}
|
|
3943
3972
|
),
|
|
3944
3973
|
/* @__PURE__ */ React41.createElement("div", { className: `absolute inset-0 z-20 pointer-events-none ${isSecondCard ? "" : "bg-black/20"}` }),
|
|
3945
|
-
/* @__PURE__ */ React41.createElement("div", { className: `absolute inset-0 z-30 p-6 flex flex-col justify-end ${isSecondCard ? "text-black" : "text-white"}` }, /* @__PURE__ */ React41.createElement("p", { className: `text-
|
|
3974
|
+
/* @__PURE__ */ React41.createElement("div", { className: `absolute inset-0 z-30 p-6 flex flex-col justify-end ${isSecondCard ? "text-black" : "text-white"}` }, /* @__PURE__ */ React41.createElement("p", { className: `text-sm leading-snug mb-3 pr-2 ${isSecondCard ? "text-black/90" : "text-white/90"}` }, card.mainText), card.tag && /* @__PURE__ */ React41.createElement("span", { className: `mb-4 text-xs tracking-widest ${isSecondCard ? "text-black/70" : "text-white/50"}` }, card.tag), /* @__PURE__ */ React41.createElement("div", { className: "pt-3" }, /* @__PURE__ */ React41.createElement("h4", { className: `text-sm tracking-wide ${isSecondCard ? "text-black" : "text-white"}` }, card.title), /* @__PURE__ */ React41.createElement("p", { className: `text-xs ${isSecondCard ? "text-black/60" : "text-white/60"}` }, card.subtitle)))
|
|
3946
3975
|
);
|
|
3947
3976
|
})))));
|
|
3948
3977
|
};
|
|
@@ -3969,9 +3998,9 @@ var ManagedProjectsBlock = ({
|
|
|
3969
3998
|
backgroundRepeat: "repeat"
|
|
3970
3999
|
}
|
|
3971
4000
|
}
|
|
3972
|
-
), /* @__PURE__ */ React42.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React42.createElement(GridSection, null, tagline && /* @__PURE__ */ React42.createElement("span", { className: "text-
|
|
4001
|
+
), /* @__PURE__ */ React42.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React42.createElement(GridSection, null, tagline && /* @__PURE__ */ React42.createElement("span", { className: "text-xs tracking-[0.4em] text-stone-500 text-left block " }, tagline), /* @__PURE__ */ React42.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), projects.map((project, index) => {
|
|
3973
4002
|
const isLast = index === projects.length - 1;
|
|
3974
|
-
const projectContent = /* @__PURE__ */ React42.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ React42.createElement("div", { className: "flex flex-col md:flex-row md:items-center justify-between gap-3 md:gap-4 mb-4 md:mb-5" }, /* @__PURE__ */ React42.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ React42.createElement("h2", { className: " text-
|
|
4003
|
+
const projectContent = /* @__PURE__ */ React42.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ React42.createElement("div", { className: "flex flex-col md:flex-row md:items-center justify-between gap-3 md:gap-4 mb-4 md:mb-5" }, /* @__PURE__ */ React42.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ React42.createElement("h2", { className: " text-sm text-black transition-all flex items-center gap-2" }, project.title, /* @__PURE__ */ React42.createElement("span", { className: "text-xs opacity-0 -translate-x-2 group-hover:opacity-100 group-hover:translate-x-0 transition-all duration-300" }, project.isExternal ? "\u2197" : "\u2192")), /* @__PURE__ */ React42.createElement("span", { className: `text-xs px-2.5 py-1 rounded-full tracking-[0.15em] transition-colors ${project.status.toLowerCase() === "production" ? "bg-black text-white" : "bg-stone-100 text-stone-500 group-hover:bg-stone-50 group-hover:text-black"}` }, project.status)), /* @__PURE__ */ React42.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-500 shrink-0 " }, project.date)), /* @__PURE__ */ React42.createElement("p", { className: "text-sm leading-[1.8] text-stone-600 max-w-4xl text-left transition-colors group-hover:text-black" }, project.description));
|
|
3975
4004
|
return /* @__PURE__ */ React42.createElement(GridSection, { key: project.id || index, isLast, className: isLast ? "py-8 md:py-10 pb-12 md:pb-14" : "py-8 md:py-10" }, project.isExternal ? /* @__PURE__ */ React42.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ React42.createElement(Link9, { href: project.link, className: "block outline-none" }, projectContent));
|
|
3976
4005
|
}))));
|
|
3977
4006
|
};
|
|
@@ -4005,32 +4034,32 @@ var VerificationRow = ({
|
|
|
4005
4034
|
switch (status) {
|
|
4006
4035
|
case "APPROVED":
|
|
4007
4036
|
statusText = "Completed";
|
|
4008
|
-
statusColor = "text-
|
|
4037
|
+
statusColor = "text-stone-600";
|
|
4009
4038
|
StatusIcon = CheckmarkCircle01Icon;
|
|
4010
|
-
bg = "bg-
|
|
4039
|
+
bg = "bg-stone-50";
|
|
4011
4040
|
iconColor = "text-green-500";
|
|
4012
4041
|
break;
|
|
4013
4042
|
case "PENDING":
|
|
4014
4043
|
statusText = "Awaiting Approval";
|
|
4015
|
-
statusColor = "text-
|
|
4044
|
+
statusColor = "text-stone-500";
|
|
4016
4045
|
StatusIcon = Time02Icon;
|
|
4017
|
-
bg = "bg-
|
|
4046
|
+
bg = "bg-stone-50";
|
|
4018
4047
|
iconColor = "text-orange-500";
|
|
4019
4048
|
break;
|
|
4020
4049
|
case "REJECTED":
|
|
4021
4050
|
statusText = "Action required to fix issue";
|
|
4022
|
-
statusColor = "text-
|
|
4023
|
-
bg = "bg-
|
|
4051
|
+
statusColor = "text-stone-500";
|
|
4052
|
+
bg = "bg-stone-50";
|
|
4024
4053
|
StatusIcon = InformationCircleIcon2;
|
|
4025
4054
|
iconColor = "text-red-500";
|
|
4026
4055
|
break;
|
|
4027
4056
|
case "ACTION_REQUIRED":
|
|
4028
4057
|
default:
|
|
4029
4058
|
statusText = "Start verification";
|
|
4030
|
-
statusColor = "text-
|
|
4031
|
-
bg = "bg-
|
|
4059
|
+
statusColor = "text-stone-500";
|
|
4060
|
+
bg = "bg-stone-50";
|
|
4032
4061
|
StatusIcon = InformationCircleIcon2;
|
|
4033
|
-
iconColor = "text-
|
|
4062
|
+
iconColor = "text-stone-400";
|
|
4034
4063
|
break;
|
|
4035
4064
|
}
|
|
4036
4065
|
const isDisabled = status === "APPROVED" || isLoading;
|
|
@@ -4038,10 +4067,10 @@ var VerificationRow = ({
|
|
|
4038
4067
|
"div",
|
|
4039
4068
|
{
|
|
4040
4069
|
onClick: isDisabled ? void 0 : onClick,
|
|
4041
|
-
className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${isDisabled ? "opacity-70 cursor-default" : "cursor-pointer hover:bg-
|
|
4070
|
+
className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${isDisabled ? "opacity-70 cursor-default" : "cursor-pointer hover:bg-stone-50"}`
|
|
4042
4071
|
},
|
|
4043
|
-
/* @__PURE__ */ React43.createElement("div", { className: "w-9 h-9 rounded-full border border-
|
|
4044
|
-
/* @__PURE__ */ React43.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React43.createElement("p", { className: "text-
|
|
4072
|
+
/* @__PURE__ */ React43.createElement("div", { className: "w-9 h-9 rounded-full border border-stone-200 bg-white flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React43.createElement(HugeiconsIcon30, { icon, size: 16, className: "text-black" })),
|
|
4073
|
+
/* @__PURE__ */ React43.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React43.createElement("p", { className: "text-sm truncate text-black" }, title), /* @__PURE__ */ React43.createElement("p", { className: `text-xs inline-flex items-center ${bg} rounded-full px-2 py-1 ${statusColor} mt-0.5` }, statusText)),
|
|
4045
4074
|
/* @__PURE__ */ React43.createElement("div", { className: "shrink-0 ml-2" }, isLoading ? /* @__PURE__ */ React43.createElement(HugeiconsIcon30, { icon: Loading03Icon17, size: 20, className: "animate-spin text-black" }) : /* @__PURE__ */ React43.createElement(HugeiconsIcon30, { icon: StatusIcon, size: 20, className: iconColor }))
|
|
4046
4075
|
);
|
|
4047
4076
|
};
|
|
@@ -4059,7 +4088,7 @@ var UniversalVerificationPage = ({
|
|
|
4059
4088
|
"button",
|
|
4060
4089
|
{
|
|
4061
4090
|
onClick: onBack,
|
|
4062
|
-
className: "flex items-center gap-2 text-
|
|
4091
|
+
className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none"
|
|
4063
4092
|
},
|
|
4064
4093
|
/* @__PURE__ */ React43.createElement(HugeiconsIcon30, { icon: ArrowLeft01Icon10, size: 16 }),
|
|
4065
4094
|
" Back"
|
|
@@ -4115,7 +4144,7 @@ var AvatarLogo = ({ src, alt, name, sizeClass = "w-12 h-12" }) => {
|
|
|
4115
4144
|
const [isLoaded, setIsLoaded] = useState30(false);
|
|
4116
4145
|
const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=ffffff&color=000000&size=100&font-size=0.33`;
|
|
4117
4146
|
const finalSrc = src || fallbackUrl;
|
|
4118
|
-
return /* @__PURE__ */ React44.createElement("div", { className: `relative shrink-0 rounded-full bg-
|
|
4147
|
+
return /* @__PURE__ */ React44.createElement("div", { className: `relative shrink-0 rounded-full bg-stone-100 flex items-center justify-center overflow-hidden border-[3px] border-white ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React44.createElement(HugeiconsIcon31, { icon: Loading03Icon18, size: 16, className: "animate-spin text-stone-400 absolute" }), /* @__PURE__ */ React44.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
|
|
4119
4148
|
};
|
|
4120
4149
|
var UniversalRewardPage = ({
|
|
4121
4150
|
leaderboardToday,
|
|
@@ -4165,30 +4194,30 @@ var UniversalRewardPage = ({
|
|
|
4165
4194
|
setIsClaiming(false);
|
|
4166
4195
|
}
|
|
4167
4196
|
};
|
|
4168
|
-
return /* @__PURE__ */ React44.createElement("div", null, /* @__PURE__ */ React44.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ React44.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-
|
|
4197
|
+
return /* @__PURE__ */ React44.createElement("div", null, /* @__PURE__ */ React44.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ React44.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none" }, /* @__PURE__ */ React44.createElement(HugeiconsIcon31, { icon: ArrowLeft01Icon11, size: 16 }), " Back")), /* @__PURE__ */ React44.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React44.createElement(ManagedToaster, null), showConfetti && /* @__PURE__ */ React44.createElement("div", { className: "fixed inset-0 z-200 pointer-events-none" }, /* @__PURE__ */ React44.createElement(Confetti, { width, height, recycle: false, numberOfPieces: 500, gravity: 0.15 })), isLoading ? /* @__PURE__ */ React44.createElement(PageSpinner4, null) : /* @__PURE__ */ React44.createElement(React44.Fragment, null, /* @__PURE__ */ React44.createElement("div", { className: "w-full p-4 pt-10 mb-6 flex items-end justify-center gap-2 sm:gap-6 h-64 relative overflow-hidden" }, /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col items-center w-1/3 z-10" }, secondPlace ? /* @__PURE__ */ React44.createElement(React44.Fragment, null, /* @__PURE__ */ React44.createElement("span", { className: "text-black text-xs mb-2 truncate max-w-full px-1" }, formatWeb3Name(secondPlace.profile.web3Name)), /* @__PURE__ */ React44.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ React44.createElement(AvatarLogo, { src: secondPlace.profile.avatarUrl, alt: secondPlace.profile.username, name: formatWeb3Name(secondPlace.profile.web3Name), sizeClass: "w-14 h-14" }), /* @__PURE__ */ React44.createElement("div", { className: "absolute -bottom-2 right-0 w-5 h-5 rounded-full bg-[#ceff8a] text-black flex items-center justify-center text-xs border border-white " }, "2")), /* @__PURE__ */ React44.createElement("div", { className: "w-full bg-linear-to-t from-stone-100 to-[#ceff8a] rounded-t-xl h-24 flex items-center justify-center" }, /* @__PURE__ */ React44.createElement("span", { className: "text-stone-800/30 text-2xl " }, "2nd"))) : /* @__PURE__ */ React44.createElement("div", { className: "w-full bg-linear-to-t from-stone-200 to-stone-100 rounded-t-xl h-24 mt-auto" })), /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col items-center w-1/3 z-20 -mt-8" }, firstPlace ? /* @__PURE__ */ React44.createElement(React44.Fragment, null, /* @__PURE__ */ React44.createElement("span", { className: "text-black text-xs mb-2 truncate max-w-full px-1" }, formatWeb3Name(firstPlace.profile.web3Name)), /* @__PURE__ */ React44.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ React44.createElement(AvatarLogo, { src: firstPlace.profile.avatarUrl, alt: firstPlace.profile.username, name: formatWeb3Name(firstPlace.profile.web3Name), sizeClass: "w-17 h-17" }), /* @__PURE__ */ React44.createElement("div", { className: "absolute -bottom-2 right-2 w-5 h-5 rounded-full bg-[#143731] text-white flex items-center justify-center text-xs border border-white " }, "1")), /* @__PURE__ */ React44.createElement("div", { className: "w-full bg-linear-to-t from-stone-100 to-[#143731] rounded-t-xl h-32 flex items-center justify-center " }, /* @__PURE__ */ React44.createElement("span", { className: "text-white/40 text-3xl tracking-widest" }, "1st"))) : /* @__PURE__ */ React44.createElement("div", { className: "w-full bg-linear-to-t from-stone-200 to-stone-100 rounded-t-xl h-32 mt-auto" })), /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col items-center w-1/3 z-10" }, thirdPlace ? /* @__PURE__ */ React44.createElement(React44.Fragment, null, /* @__PURE__ */ React44.createElement("span", { className: "text-black text-xs mb-2 truncate max-w-full px-1" }, formatWeb3Name(thirdPlace.profile.web3Name)), /* @__PURE__ */ React44.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ React44.createElement(AvatarLogo, { src: thirdPlace.profile.avatarUrl, alt: thirdPlace.profile.username, name: formatWeb3Name(thirdPlace.profile.web3Name), sizeClass: "w-12 h-12" }), /* @__PURE__ */ React44.createElement("div", { className: "absolute -bottom-2 right-0 w-5 h-5 rounded-full bg-[#ceff8a] text-black flex items-center justify-center text-xs border border-white " }, "3")), /* @__PURE__ */ React44.createElement("div", { className: "w-full bg-linear-to-t from-stone-100 to-[#ceff8a] rounded-t-xl h-20 flex items-center justify-center" }, /* @__PURE__ */ React44.createElement("span", { className: "text-stone-800/30 text-xl " }, "3rd"))) : /* @__PURE__ */ React44.createElement("div", { className: "w-full bg-linear-to-t from-stone-200 to-stone-100 rounded-t-xl h-20 mt-auto" }))), /* @__PURE__ */ React44.createElement("div", { className: "flex items-center justify-center mb-6 sm:mb-8 w-full animate-in fade-in duration-300 px-2" }, /* @__PURE__ */ React44.createElement("div", { className: "flex items-center bg-white rounded-full p-1 sm:p-1.5 max-w-full overflow-x-auto custom-scrollbar " }, tabs.map((tab, idx) => {
|
|
4169
4198
|
const isActive = activeTabIndex === idx;
|
|
4170
4199
|
return /* @__PURE__ */ React44.createElement(
|
|
4171
4200
|
"button",
|
|
4172
4201
|
{
|
|
4173
4202
|
key: idx,
|
|
4174
4203
|
onClick: () => setActiveTabIndex(idx),
|
|
4175
|
-
className: `px-5 py-1.5 rounded-full text-
|
|
4204
|
+
className: `px-5 py-1.5 rounded-full text-xs transition-all duration-200 outline-none whitespace-nowrap shrink-0 ${isActive ? "bg-stone-100 text-black " : "text-stone-500 hover:text-black hover:bg-stone-50/50"}`
|
|
4176
4205
|
},
|
|
4177
4206
|
tab.label
|
|
4178
4207
|
);
|
|
4179
|
-
}))), /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col gap-6 w-full" }, /* @__PURE__ */ React44.createElement("div", { className: "bg-white rounded-2xl p-6 " }, /* @__PURE__ */ React44.createElement("h2", { className: "text-black text-lg mb-4 tracking-tight" }, "Available Tasks"), /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col" }, rewards.length === 0 ? /* @__PURE__ */ React44.createElement("p", { className: "text-xs text-
|
|
4208
|
+
}))), /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col gap-6 w-full" }, /* @__PURE__ */ React44.createElement("div", { className: "bg-white rounded-2xl p-6 " }, /* @__PURE__ */ React44.createElement("h2", { className: "text-black text-lg mb-4 tracking-tight" }, "Available Tasks"), /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col" }, rewards.length === 0 ? /* @__PURE__ */ React44.createElement("p", { className: "text-xs text-stone-400 py-6 text-center" }, "No rewards available at the moment.") : rewards.map((reward) => {
|
|
4180
4209
|
const statusText = reward.status === "CLAIMED" ? "Claimed" : "Unclaimed";
|
|
4181
4210
|
return /* @__PURE__ */ React44.createElement(
|
|
4182
4211
|
"div",
|
|
4183
4212
|
{
|
|
4184
4213
|
key: reward.id,
|
|
4185
4214
|
onClick: () => setSelectedReward(reward),
|
|
4186
|
-
className: "flex items-center justify-between py-4 hover:bg-
|
|
4215
|
+
className: "flex items-center justify-between py-4 hover:bg-stone-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
|
|
4187
4216
|
},
|
|
4188
|
-
/* @__PURE__ */ React44.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React44.createElement("div", { className: "w-10 h-10 shrink-0 rounded-full flex items-center justify-center border border-
|
|
4189
|
-
/* @__PURE__ */ React44.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1" }, /* @__PURE__ */ React44.createElement("span", { className: "text-
|
|
4217
|
+
/* @__PURE__ */ React44.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React44.createElement("div", { className: "w-10 h-10 shrink-0 rounded-full flex items-center justify-center border border-stone-200 text-black" }, /* @__PURE__ */ React44.createElement(HugeiconsIcon31, { icon: GiftIcon, size: 16 })), /* @__PURE__ */ React44.createElement("div", { className: "min-w-0 flex-1 flex flex-col items-start gap-0.5 pr-4" }, /* @__PURE__ */ React44.createElement("p", { className: "text-sm text-black truncate w-full" }, reward.title), /* @__PURE__ */ React44.createElement("p", { className: `text-xs inline-flex items-center bg-stone-50 rounded-full px-2 py-1 text-stone-500 mt-0.5` }, statusText))),
|
|
4218
|
+
/* @__PURE__ */ React44.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1" }, /* @__PURE__ */ React44.createElement("span", { className: "text-sm text-black" }, reward.amount))
|
|
4190
4219
|
);
|
|
4191
|
-
}))), remainingLeaderboard.length > 0 && /* @__PURE__ */ React44.createElement("div", { className: "bg-white rounded-2xl p-6 " }, /* @__PURE__ */ React44.createElement("h2", { className: "text-black text-lg mb-4 tracking-tight" }, "Leaderboard"), /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col" }, remainingLeaderboard.map((lb) => /* @__PURE__ */ React44.createElement("div", { key: lb.profile.username, className: "flex items-center justify-between py-3 min-w-0" }, /* @__PURE__ */ React44.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React44.createElement("div", { className: "text-
|
|
4220
|
+
}))), remainingLeaderboard.length > 0 && /* @__PURE__ */ React44.createElement("div", { className: "bg-white rounded-2xl p-6 " }, /* @__PURE__ */ React44.createElement("h2", { className: "text-black text-lg mb-4 tracking-tight" }, "Leaderboard"), /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col" }, remainingLeaderboard.map((lb) => /* @__PURE__ */ React44.createElement("div", { key: lb.profile.username, className: "flex items-center justify-between py-3 min-w-0" }, /* @__PURE__ */ React44.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React44.createElement("div", { className: "text-xs text-stone-400 w-4" }, lb.position), /* @__PURE__ */ React44.createElement(AvatarLogo, { src: lb.profile.avatarUrl, alt: lb.profile.username, name: formatWeb3Name(lb.profile.web3Name), sizeClass: "w-9 h-9" }), /* @__PURE__ */ React44.createElement("div", { className: "min-w-0 flex-1 flex flex-col" }, /* @__PURE__ */ React44.createElement("p", { className: "text-sm text-black truncate" }, formatWeb3Name(lb.profile.web3Name)), /* @__PURE__ */ React44.createElement("p", { className: "text-xs text-stone-400 truncate" }, "@", lb.profile.username))), /* @__PURE__ */ React44.createElement("div", { className: "shrink-0 text-sm text-black" }, lb.amount))))))), selectedReward && /* @__PURE__ */ React44.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React44.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => !isClaiming && setSelectedReward(null) }), /* @__PURE__ */ React44.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-3xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React44.createElement("div", { className: "flex-1 p-6 flex flex-col items-center text-center mt-2" }, /* @__PURE__ */ React44.createElement("h2", { className: "text-xl text-black mb-2" }, selectedReward.title), /* @__PURE__ */ React44.createElement("p", { className: "text-sm text-stone-500 mb-6 leading-relaxed" }, selectedReward.description), selectedReward.progressText && /* @__PURE__ */ React44.createElement("div", { className: "w-full mb-6" }, /* @__PURE__ */ React44.createElement("div", { className: `px-4 py-2 rounded-full text-xs tracking-wide ${selectedReward.status === "CLAIMED" ? "bg-green-50 text-green-600" : selectedReward.isEligible ? "bg-blue-50 text-blue-600" : "bg-stone-100 text-stone-600"}` }, selectedReward.progressText)), /* @__PURE__ */ React44.createElement("div", { className: " w-full rounded-xl p-4 mb-8 flex flex-col items-center" }, /* @__PURE__ */ React44.createElement("span", { className: "text-xs tracking-widest text-stone-400 mb-1" }, "Reward Value"), /* @__PURE__ */ React44.createElement("span", { className: "text-3xl text-black " }, selectedReward.amount)), /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col gap-3 w-full" }, /* @__PURE__ */ React44.createElement(
|
|
4192
4221
|
ThreeDActionButton,
|
|
4193
4222
|
{
|
|
4194
4223
|
onClick: handleClaimReward,
|
|
@@ -4202,7 +4231,7 @@ var UniversalRewardPage = ({
|
|
|
4202
4231
|
{
|
|
4203
4232
|
onClick: () => setSelectedReward(null),
|
|
4204
4233
|
disabled: isClaiming,
|
|
4205
|
-
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-
|
|
4234
|
+
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-stone-200 text-black hover:bg-stone-50 transition-colors outline-none text-xs tracking-wide mt-2"
|
|
4206
4235
|
},
|
|
4207
4236
|
"Cancel"
|
|
4208
4237
|
)))))));
|
|
@@ -4253,21 +4282,21 @@ var UniversalReferralPage = ({
|
|
|
4253
4282
|
const [isLoaded, setIsLoaded] = useState31(false);
|
|
4254
4283
|
const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=e0e0e0&color=000000&size=100&font-size=0.33`;
|
|
4255
4284
|
const finalSrc = src || fallbackUrl;
|
|
4256
|
-
return /* @__PURE__ */ React45.createElement("div", { className: `relative shrink-0 rounded-full bg-
|
|
4285
|
+
return /* @__PURE__ */ React45.createElement("div", { className: `relative shrink-0 rounded-full bg-stone-100 flex items-center justify-center overflow-hidden border-2 border-white ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React45.createElement(HugeiconsIcon32, { icon: Loading03Icon19, size: 16, className: "animate-spin text-stone-400 absolute" }), /* @__PURE__ */ React45.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
|
|
4257
4286
|
};
|
|
4258
|
-
return /* @__PURE__ */ React45.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React45.createElement(ManagedToaster, null), /* @__PURE__ */ React45.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React45.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-
|
|
4287
|
+
return /* @__PURE__ */ React45.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React45.createElement(ManagedToaster, null), /* @__PURE__ */ React45.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React45.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none" }, /* @__PURE__ */ React45.createElement(HugeiconsIcon32, { icon: ArrowLeft01Icon12, size: 16 }), " Back")), /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-4 mb-6 px-1" }, /* @__PURE__ */ React45.createElement("div", null, /* @__PURE__ */ React45.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, "Your Referrals"), /* @__PURE__ */ React45.createElement("p", { className: "text-xs text-stone-500" }, "Invite friends and earn rewards when they verify and activate cards.")), /* @__PURE__ */ React45.createElement("div", { className: "bg-[#143731] rounded-3xl p-6 relative overflow-hidden flex flex-col min-h-25 w-full mt-2" }, /* @__PURE__ */ React45.createElement("div", { className: "relative z-10 flex flex-col items-start" }, /* @__PURE__ */ React45.createElement("p", { className: "text-xs text-white leading-tight mb-1" }, /* @__PURE__ */ React45.createElement("span", { className: "text-white/60" }, "AFT Balance")), isLoading ? /* @__PURE__ */ React45.createElement("div", { className: "h-8 w-32 bg-white/10 animate-pulse rounded mt-2" }) : /* @__PURE__ */ React45.createElement("span", { className: "text-lg text-white tracking-tight mt-1" }, referralCoins)))), /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-6 p-4 rounded-3xl bg-white w-full" }, /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React45.createElement("div", { className: "border border-stone-200 rounded-xl p-4 flex items-center justify-between" }, /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React45.createElement("span", { className: "text-xs tracking-widest text-stone-400 " }, "Invitation Code"), isLoading && !referralCode ? /* @__PURE__ */ React45.createElement("div", { className: "h-6 w-24 bg-stone-50 animate-pulse rounded mt-1" }) : /* @__PURE__ */ React45.createElement("span", { className: "text-sm text-black tracking-widest" }, referralCode)), /* @__PURE__ */ React45.createElement(
|
|
4259
4288
|
"button",
|
|
4260
4289
|
{
|
|
4261
4290
|
onClick: handleCopyCode,
|
|
4262
4291
|
disabled: isLoading || !referralCode,
|
|
4263
|
-
className: "w-10 h-10 rounded-full bg-white flex items-center justify-center text-
|
|
4292
|
+
className: "w-10 h-10 rounded-full bg-white flex items-center justify-center text-stone-500 hover:text-black transition-colors outline-none disabled:opacity-50"
|
|
4264
4293
|
},
|
|
4265
4294
|
/* @__PURE__ */ React45.createElement(HugeiconsIcon32, { icon: Copy01Icon4, size: 18 })
|
|
4266
|
-
)), /* @__PURE__ */ React45.createElement("div", { className: "flex items-center justify-between text-
|
|
4295
|
+
)), /* @__PURE__ */ React45.createElement("div", { className: "flex items-center justify-between text-sm text-stone-500 px-1" }, /* @__PURE__ */ React45.createElement("span", null, "Total Invited: ", /* @__PURE__ */ React45.createElement("span", { className: "text-black " }, isLoading && !totalCount ? "-" : totalCount)))), /* @__PURE__ */ React45.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React45.createElement(PageSpinner5, null) : /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React45.createElement("div", null, referrals.length === 0 ? /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col items-center justify-center py-8 opacity-50" }, /* @__PURE__ */ React45.createElement("p", { className: "text-xs text-stone-500 text-center" }, "You haven't referred anyone yet.")) : referrals.map((ref, idx) => /* @__PURE__ */ React45.createElement(
|
|
4267
4296
|
"div",
|
|
4268
4297
|
{
|
|
4269
4298
|
key: `${ref.profile.username}-${idx}`,
|
|
4270
|
-
className: "flex items-center justify-between py-4 hover:bg-
|
|
4299
|
+
className: "flex items-center justify-between py-4 hover:bg-stone-50 transition-colors group min-w-0 px-3 -mx-3 rounded-xl"
|
|
4271
4300
|
},
|
|
4272
4301
|
/* @__PURE__ */ React45.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React45.createElement(
|
|
4273
4302
|
AvatarLogo2,
|
|
@@ -4276,14 +4305,14 @@ var UniversalReferralPage = ({
|
|
|
4276
4305
|
alt: ref.profile.username,
|
|
4277
4306
|
name: formatWeb3Name2(ref.profile.web3Name)
|
|
4278
4307
|
}
|
|
4279
|
-
), /* @__PURE__ */ React45.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5 pr-4" }, /* @__PURE__ */ React45.createElement("p", { className: "text-
|
|
4280
|
-
/* @__PURE__ */ React45.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React45.createElement("span", { className: "text-
|
|
4281
|
-
))), /* @__PURE__ */ React45.createElement("div", { className: "flex items-center justify-between pt-6 mt-2" }, /* @__PURE__ */ React45.createElement("span", { className: "text-
|
|
4308
|
+
), /* @__PURE__ */ React45.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5 pr-4" }, /* @__PURE__ */ React45.createElement("p", { className: "text-sm text-black truncate" }, formatWeb3Name2(ref.profile.web3Name)), /* @__PURE__ */ React45.createElement("p", { className: "text-xs text-stone-500 truncate" }, "@", ref.profile.username))),
|
|
4309
|
+
/* @__PURE__ */ React45.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React45.createElement("span", { className: "text-xs text-stone-400" }, "Joined"), /* @__PURE__ */ React45.createElement("span", { className: "text-xs text-black" }, formatDate(ref.joinedAt)))
|
|
4310
|
+
))), /* @__PURE__ */ React45.createElement("div", { className: "flex items-center justify-between pt-6 mt-2" }, /* @__PURE__ */ React45.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ React45.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React45.createElement(
|
|
4282
4311
|
"button",
|
|
4283
4312
|
{
|
|
4284
4313
|
onClick: () => onPageChange(currentPage - 1),
|
|
4285
4314
|
disabled: currentPage <= 1 || isLoading,
|
|
4286
|
-
className: "p-2 bg-white border border-
|
|
4315
|
+
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
4287
4316
|
},
|
|
4288
4317
|
/* @__PURE__ */ React45.createElement(HugeiconsIcon32, { icon: ArrowLeft01Icon12, size: 14 })
|
|
4289
4318
|
), /* @__PURE__ */ React45.createElement(
|
|
@@ -4291,7 +4320,7 @@ var UniversalReferralPage = ({
|
|
|
4291
4320
|
{
|
|
4292
4321
|
onClick: () => onPageChange(currentPage + 1),
|
|
4293
4322
|
disabled: currentPage >= totalPages || isLoading || totalPages === 0,
|
|
4294
|
-
className: "p-2 bg-white border border-
|
|
4323
|
+
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
4295
4324
|
},
|
|
4296
4325
|
/* @__PURE__ */ React45.createElement(HugeiconsIcon32, { icon: ArrowRight01Icon10, size: 14 })
|
|
4297
4326
|
)))))));
|
|
@@ -4316,7 +4345,7 @@ var formatTierName = (name) => {
|
|
|
4316
4345
|
var getTierGlow = (tier) => {
|
|
4317
4346
|
switch (tier.toUpperCase()) {
|
|
4318
4347
|
case "PLATINUM":
|
|
4319
|
-
return "from-
|
|
4348
|
+
return "from-stone-300";
|
|
4320
4349
|
case "PREMIUM":
|
|
4321
4350
|
return "from-purple-200";
|
|
4322
4351
|
case "GOLD":
|
|
@@ -4332,7 +4361,7 @@ var getTierGlow = (tier) => {
|
|
|
4332
4361
|
case "ZERO":
|
|
4333
4362
|
return "from-rose-200";
|
|
4334
4363
|
default:
|
|
4335
|
-
return "from-
|
|
4364
|
+
return "from-stone-100";
|
|
4336
4365
|
}
|
|
4337
4366
|
};
|
|
4338
4367
|
var UniversalCardActionPage = ({
|
|
@@ -4393,11 +4422,11 @@ var UniversalCardActionPage = ({
|
|
|
4393
4422
|
"button",
|
|
4394
4423
|
{
|
|
4395
4424
|
onClick: onBackHandler,
|
|
4396
|
-
className: "flex items-center gap-2 text-
|
|
4425
|
+
className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none"
|
|
4397
4426
|
},
|
|
4398
4427
|
/* @__PURE__ */ React46.createElement(HugeiconsIcon33, { icon: ArrowLeft01Icon13, size: 16 }),
|
|
4399
4428
|
" Back"
|
|
4400
|
-
)), /* @__PURE__ */ React46.createElement("div", { className: "flex flex-col animate-in max-w-5xl w-full mx-auto fade-in duration-300" }, /* @__PURE__ */ React46.createElement("div", { className: "w-full flex flex-col items-center text-center mb-10 px-4" }, /* @__PURE__ */ React46.createElement("span", { className: "text-
|
|
4429
|
+
)), /* @__PURE__ */ React46.createElement("div", { className: "flex flex-col animate-in max-w-5xl w-full mx-auto fade-in duration-300" }, /* @__PURE__ */ React46.createElement("div", { className: "w-full flex flex-col items-center text-center mb-10 px-4" }, /* @__PURE__ */ React46.createElement("span", { className: "text-xs tracking-[0.4em] text-stone-400 block mb-3" }, cardType, " CARD ACTIVATION"), /* @__PURE__ */ React46.createElement("h1", { className: "text-2xl sm:text-3xl text-black tracking-tight mb-2" }, "Select Your Tier"), /* @__PURE__ */ React46.createElement("p", { className: "text-xs text-stone-500 max-w-lg" }, hasPreordered ? "You have already secured your card. Upgrades are disabled while your order is pending processing." : "Upgrade your tier or secure your card now. Pre-orders guarantee priority processing when the batch goes live.")), isLoadingData ? /* @__PURE__ */ React46.createElement("div", { className: "flex justify-center py-20" }, /* @__PURE__ */ React46.createElement(HugeiconsIcon33, { icon: Loading03Icon20, size: 32, className: "animate-spin text-stone-300" })) : /* @__PURE__ */ React46.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-4xl mx-auto px-4" }, availableTiers.map((tier) => {
|
|
4401
4430
|
const isCurrent = tier.tierName === currentTier;
|
|
4402
4431
|
const isCardDisabled = hasPreordered && !isCurrent;
|
|
4403
4432
|
const isHighlighted = hasPreordered && isCurrent;
|
|
@@ -4420,7 +4449,7 @@ var UniversalCardActionPage = ({
|
|
|
4420
4449
|
}
|
|
4421
4450
|
),
|
|
4422
4451
|
isThisCardLoading && /* @__PURE__ */ React46.createElement("div", { className: "absolute inset-0 z-50 flex items-center justify-center bg-white/40 backdrop-blur-[1px]" }, /* @__PURE__ */ React46.createElement(HugeiconsIcon33, { icon: Loading03Icon20, size: 32, className: "animate-spin text-black" })),
|
|
4423
|
-
/* @__PURE__ */ React46.createElement("div", { className: "mb-6 relative z-10" }, /* @__PURE__ */ React46.createElement("div", { className: "flex justify-between items-start mb-1" }, /* @__PURE__ */ React46.createElement("span", { className: "text-black text-sm tracking-widest " }, formatTierName(tier.tierName)), isCurrent && !hasPreordered && /* @__PURE__ */ React46.createElement("span", { className: "text-
|
|
4452
|
+
/* @__PURE__ */ React46.createElement("div", { className: "mb-6 relative z-10" }, /* @__PURE__ */ React46.createElement("div", { className: "flex justify-between items-start mb-1" }, /* @__PURE__ */ React46.createElement("span", { className: "text-black text-sm tracking-widest " }, formatTierName(tier.tierName)), isCurrent && !hasPreordered && /* @__PURE__ */ React46.createElement("span", { className: "text-xs bg-stone-100 text-stone-600 px-2 py-1 rounded-full tracking-wider" }, "Current")), /* @__PURE__ */ React46.createElement("div", { className: "flex items-baseline gap-1 mt-2" }, /* @__PURE__ */ React46.createElement("h3", { className: "text-3xl font-light text-black" }, tier.priceUSD === 0 ? "Free" : `$${tier.priceUSD.toFixed(2)}`), tier.priceUSD > 0 && /* @__PURE__ */ React46.createElement("span", { className: "text-xs text-stone-500" }, tier.isYearly ? "/ year" : "one-time")), /* @__PURE__ */ React46.createElement("p", { className: "text-sm text-stone-500 mt-3 min-h-12 leading-relaxed" }, tier.description)),
|
|
4424
4453
|
/* @__PURE__ */ React46.createElement("div", { className: "flex flex-col gap-2.5 mb-6 relative z-10" }, /* @__PURE__ */ React46.createElement("div", { className: isPrimaryDisabled ? "opacity-50 pointer-events-none" : "" }, /* @__PURE__ */ React46.createElement(
|
|
4425
4454
|
ThreeDActionButton,
|
|
4426
4455
|
{
|
|
@@ -4435,7 +4464,7 @@ var UniversalCardActionPage = ({
|
|
|
4435
4464
|
disabled: isWaitlistDisabled,
|
|
4436
4465
|
onClick: () => handleTierClick(tier, "join_waitlist"),
|
|
4437
4466
|
className: `w-full py-2.5 rounded-full text-xs tracking-wide transition-all outline-none border
|
|
4438
|
-
${isCurrent && (onWaitlist || hasPreordered) ? "bg-
|
|
4467
|
+
${isCurrent && (onWaitlist || hasPreordered) ? "bg-stone-50 border-stone-200 text-stone-400 cursor-not-allowed" : "bg-white border-stone-200 text-black hover:bg-stone-50"}
|
|
4439
4468
|
disabled:opacity-40 disabled:cursor-not-allowed
|
|
4440
4469
|
`
|
|
4441
4470
|
},
|
|
@@ -4444,7 +4473,7 @@ var UniversalCardActionPage = ({
|
|
|
4444
4473
|
/* @__PURE__ */ React46.createElement("div", { className: "flex flex-col gap-3 relative z-10" }, tier.features.map((feature, featureIdx) => {
|
|
4445
4474
|
const isAvailable = feature.value !== false;
|
|
4446
4475
|
const valueText = typeof feature.value === "string" ? feature.value : "";
|
|
4447
|
-
return /* @__PURE__ */ React46.createElement("div", { key: featureIdx, className: "flex items-center gap-3" }, isAvailable ? /* @__PURE__ */ React46.createElement(CheckIcon2, null) : /* @__PURE__ */ React46.createElement(CrossIcon2, null), /* @__PURE__ */ React46.createElement("span", { className: `text-
|
|
4476
|
+
return /* @__PURE__ */ React46.createElement("div", { key: featureIdx, className: "flex items-center gap-3" }, isAvailable ? /* @__PURE__ */ React46.createElement(CheckIcon2, null) : /* @__PURE__ */ React46.createElement(CrossIcon2, null), /* @__PURE__ */ React46.createElement("span", { className: `text-xs truncate ${isAvailable ? "text-stone-800" : "text-stone-400"}` }, feature.name, valueText && /* @__PURE__ */ React46.createElement("span", { className: "text-stone-500 ml-1 " }, valueText)));
|
|
4448
4477
|
}))
|
|
4449
4478
|
);
|
|
4450
4479
|
}))), selectedTier && intendedAction !== "join_waitlist" && /* @__PURE__ */ React46.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React46.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => !isProcessing && setSelectedTier(null) }), /* @__PURE__ */ React46.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React46.createElement(
|
|
@@ -4452,15 +4481,15 @@ var UniversalCardActionPage = ({
|
|
|
4452
4481
|
{
|
|
4453
4482
|
className: `absolute -top-10 -right-10 w-40 h-40 bg-linear-to-bl ${getTierGlow(selectedTier.tierName)} to-transparent opacity-40 blur-2xl rounded-full pointer-events-none`
|
|
4454
4483
|
}
|
|
4455
|
-
), /* @__PURE__ */ React46.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 relative z-10" }, /* @__PURE__ */ React46.createElement("h3", { className: "text-
|
|
4484
|
+
), /* @__PURE__ */ React46.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 relative z-10" }, /* @__PURE__ */ React46.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Confirm Action"), /* @__PURE__ */ React46.createElement(
|
|
4456
4485
|
"button",
|
|
4457
4486
|
{
|
|
4458
4487
|
disabled: isProcessing,
|
|
4459
4488
|
onClick: () => setSelectedTier(null),
|
|
4460
|
-
className: "text-
|
|
4489
|
+
className: "text-stone-400 hover:text-black transition-colors outline-none disabled:opacity-50"
|
|
4461
4490
|
},
|
|
4462
4491
|
/* @__PURE__ */ React46.createElement(HugeiconsIcon33, { icon: CancelCircleIcon9, size: 18 })
|
|
4463
|
-
)), /* @__PURE__ */ React46.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 relative z-10" }, /* @__PURE__ */ React46.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ React46.createElement("p", { className: "text-2xl text-black mb-1" }, selectedTier.priceUSD === 0 ? "Free" : `$${selectedTier.priceUSD.toFixed(2)}`), /* @__PURE__ */ React46.createElement("span", { className: `text-
|
|
4492
|
+
)), /* @__PURE__ */ React46.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 relative z-10" }, /* @__PURE__ */ React46.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ React46.createElement("p", { className: "text-2xl text-black mb-1" }, selectedTier.priceUSD === 0 ? "Free" : `$${selectedTier.priceUSD.toFixed(2)}`), /* @__PURE__ */ React46.createElement("span", { className: `text-xs tracking-widest px-4 py-1.5 rounded-full bg-stone-100 text-black mt-1` }, formatTierName(selectedTier.tierName), " ", formatTierName(cardType))), /* @__PURE__ */ React46.createElement("div", { className: "grid grid-cols-1 gap-y-6 mb-8 mt-4" }, /* @__PURE__ */ React46.createElement("div", null, /* @__PURE__ */ React46.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-1" }, "Action"), /* @__PURE__ */ React46.createElement("span", { className: "text-sm text-black " }, intendedAction === "upgrade" ? `Upgrade to ${formatTierName(selectedTier.tierName)}` : `Pre-order Card`)), intendedAction === "pre_order" && selectedTier.priceUSD > 0 && /* @__PURE__ */ React46.createElement("div", null, /* @__PURE__ */ React46.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-1" }, "Payment Notice"), /* @__PURE__ */ React46.createElement("span", { className: "text-xs text-stone-600 leading-relaxed block" }, "By confirming, $", selectedTier.priceUSD.toFixed(2), " will be securely deducted from your USD asset balance to guarantee your order."))), /* @__PURE__ */ React46.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React46.createElement(
|
|
4464
4493
|
ThreeDActionButton,
|
|
4465
4494
|
{
|
|
4466
4495
|
onClick: processAction,
|
|
@@ -4473,7 +4502,7 @@ var UniversalCardActionPage = ({
|
|
|
4473
4502
|
{
|
|
4474
4503
|
disabled: isProcessing,
|
|
4475
4504
|
onClick: () => setSelectedTier(null),
|
|
4476
|
-
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-
|
|
4505
|
+
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-stone-200 text-black hover:bg-stone-50 transition-colors outline-none text-sm mt-1 disabled:opacity-50"
|
|
4477
4506
|
},
|
|
4478
4507
|
"Cancel"
|
|
4479
4508
|
))))), selectedTier && intendedAction === "join_waitlist" && /* @__PURE__ */ React46.createElement(
|
|
@@ -4520,14 +4549,14 @@ var PinDialerBottomSheet = ({
|
|
|
4520
4549
|
if (!isVerifying) onClose();
|
|
4521
4550
|
}
|
|
4522
4551
|
}
|
|
4523
|
-
), /* @__PURE__ */ React47.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-
|
|
4552
|
+
), /* @__PURE__ */ React47.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-sm text-black tracking-tight" }, title), /* @__PURE__ */ React47.createElement(
|
|
4524
4553
|
"button",
|
|
4525
4554
|
{
|
|
4526
4555
|
onClick: () => {
|
|
4527
4556
|
if (!isVerifying) onClose();
|
|
4528
4557
|
},
|
|
4529
4558
|
disabled: isVerifying,
|
|
4530
|
-
className: "text-
|
|
4559
|
+
className: "text-stone-400 hover:text-black transition-colors outline-none disabled:opacity-50"
|
|
4531
4560
|
},
|
|
4532
4561
|
/* @__PURE__ */ React47.createElement(HugeiconsIcon34, { icon: CancelCircleIcon10, size: 20 })
|
|
4533
4562
|
)), /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col px-6 pb-6 pt-2 relative" }, /* @__PURE__ */ React47.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col gap-6" }, /* @__PURE__ */ React47.createElement(
|
|
@@ -4564,7 +4593,7 @@ import {
|
|
|
4564
4593
|
var CircularLogo = ({ src, alt, fallbackText }) => {
|
|
4565
4594
|
const [isLoaded, setIsLoaded] = useState34(false);
|
|
4566
4595
|
const [hasError, setHasError] = useState34(false);
|
|
4567
|
-
return /* @__PURE__ */ React48.createElement("div", { className: "relative w-5 h-5 rounded-full overflow-hidden bg-
|
|
4596
|
+
return /* @__PURE__ */ React48.createElement("div", { className: "relative w-5 h-5 rounded-full overflow-hidden bg-stone-100 flex items-center justify-center shrink-0" }, !hasError && src ? /* @__PURE__ */ React48.createElement(React48.Fragment, null, !isLoaded && /* @__PURE__ */ React48.createElement("div", { className: "absolute inset-0 bg-stone-200 animate-pulse" }), /* @__PURE__ */ React48.createElement(
|
|
4568
4597
|
"img",
|
|
4569
4598
|
{
|
|
4570
4599
|
src,
|
|
@@ -4573,7 +4602,7 @@ var CircularLogo = ({ src, alt, fallbackText }) => {
|
|
|
4573
4602
|
onError: () => setHasError(true),
|
|
4574
4603
|
className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}`
|
|
4575
4604
|
}
|
|
4576
|
-
)) : /* @__PURE__ */ React48.createElement("span", { className: "text-
|
|
4605
|
+
)) : /* @__PURE__ */ React48.createElement("span", { className: "text-xs text-black uppercase" }, fallbackText.substring(0, 2)));
|
|
4577
4606
|
};
|
|
4578
4607
|
var DEFAULT_NETWORK_REGEX = {
|
|
4579
4608
|
EVM: /^0x[a-fA-F0-9]{40}$/,
|
|
@@ -4736,7 +4765,7 @@ var UniversalBuyCryptoPage = ({
|
|
|
4736
4765
|
}
|
|
4737
4766
|
};
|
|
4738
4767
|
const isButtonDisabled = isSubmitting || isCalculating || !fiatAmount || !cryptoAmount || !isAddressValid || !currentRateKey;
|
|
4739
|
-
return /* @__PURE__ */ React48.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React48.createElement(ManagedToaster, null), !hideBackButton && /* @__PURE__ */ React48.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React48.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-
|
|
4768
|
+
return /* @__PURE__ */ React48.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React48.createElement(ManagedToaster, null), !hideBackButton && /* @__PURE__ */ React48.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React48.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none" }, /* @__PURE__ */ React48.createElement(HugeiconsIcon35, { icon: ArrowLeft01Icon14, size: 16 }), " Back")), /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-1 mb-6 px-1" }, /* @__PURE__ */ React48.createElement("h1", { className: "text-black text-xl tracking-tight" }, "Buy Crypto"), /* @__PURE__ */ React48.createElement("p", { className: "text-xs text-stone-500" }, "Purchase digital assets instantly in your local currency with direct wallet delivery.")), /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-6 p-6 sm:p-8 rounded-3xl bg-white w-full " }, /* @__PURE__ */ React48.createElement("div", { className: "relative flex flex-col gap-3" }, /* @__PURE__ */ React48.createElement("div", { className: "border border-stone-200 rounded-2xl p-4 flex items-center justify-between transition-all focus-within:border-black" }, /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-1 flex-1 pr-3 min-w-0" }, /* @__PURE__ */ React48.createElement("span", { className: "text-xs tracking-widest text-stone-400" }, "You Pay (", fiatCurrency.code, ")"), isCalculating && activeSource === "CRYPTO" ? /* @__PURE__ */ React48.createElement("div", { className: "h-7 w-32 bg-stone-100 animate-pulse rounded-md mt-1" }) : /* @__PURE__ */ React48.createElement(
|
|
4740
4769
|
"input",
|
|
4741
4770
|
{
|
|
4742
4771
|
type: "text",
|
|
@@ -4745,9 +4774,9 @@ var UniversalBuyCryptoPage = ({
|
|
|
4745
4774
|
onChange: handleFiatInputChange,
|
|
4746
4775
|
placeholder: "0.00",
|
|
4747
4776
|
disabled: isSubmitting,
|
|
4748
|
-
className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-
|
|
4777
|
+
className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-stone-300 "
|
|
4749
4778
|
}
|
|
4750
|
-
)), /* @__PURE__ */ React48.createElement("div", { className: "flex items-center gap-2 bg-
|
|
4779
|
+
)), /* @__PURE__ */ React48.createElement("div", { className: "flex items-center gap-2 bg-stone-50 rounded-full px-3 py-1.5 shrink-0 select-none" }, /* @__PURE__ */ React48.createElement(CircularLogo, { src: fiatCurrency.logoUrl, alt: fiatCurrency.code, fallbackText: fiatCurrency.code }), /* @__PURE__ */ React48.createElement("span", { className: "text-xs text-black" }, fiatCurrency.code))), /* @__PURE__ */ React48.createElement("div", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-10" }, /* @__PURE__ */ React48.createElement("div", { className: "w-10 h-10 rounded-full bg-white border border-stone-200 flex items-center justify-center" }, /* @__PURE__ */ React48.createElement("svg", { className: "w-4 h-4 text-black", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React48.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4" })))), /* @__PURE__ */ React48.createElement("div", { className: "border border-stone-200 rounded-2xl p-4 flex items-center justify-between transition-all focus-within:border-black" }, /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-1 flex-1 pr-3 min-w-0" }, /* @__PURE__ */ React48.createElement("span", { className: "text-xs tracking-widest text-stone-400" }, "You Receive"), isCalculating && activeSource === "FIAT" ? /* @__PURE__ */ React48.createElement("div", { className: "h-7 w-32 bg-stone-100 animate-pulse rounded-md mt-1" }) : /* @__PURE__ */ React48.createElement(
|
|
4751
4780
|
"input",
|
|
4752
4781
|
{
|
|
4753
4782
|
type: "text",
|
|
@@ -4756,7 +4785,7 @@ var UniversalBuyCryptoPage = ({
|
|
|
4756
4785
|
onChange: handleCryptoInputChange,
|
|
4757
4786
|
placeholder: "0.00",
|
|
4758
4787
|
disabled: isSubmitting,
|
|
4759
|
-
className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-
|
|
4788
|
+
className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-stone-300 "
|
|
4760
4789
|
}
|
|
4761
4790
|
)), /* @__PURE__ */ React48.createElement(
|
|
4762
4791
|
"button",
|
|
@@ -4764,21 +4793,21 @@ var UniversalBuyCryptoPage = ({
|
|
|
4764
4793
|
type: "button",
|
|
4765
4794
|
onClick: () => setIsCryptoDialogOpen(true),
|
|
4766
4795
|
disabled: isSubmitting,
|
|
4767
|
-
className: "flex items-center gap-2 bg-
|
|
4796
|
+
className: "flex items-center gap-2 bg-stone-100 hover:bg-stone-200 transition-colors rounded-full px-1 py-1.5 shrink-0 outline-none"
|
|
4768
4797
|
},
|
|
4769
4798
|
/* @__PURE__ */ React48.createElement(CircularLogo, { src: selectedCrypto.logoUrl, alt: selectedCrypto.code, fallbackText: selectedCrypto.code }),
|
|
4770
4799
|
/* @__PURE__ */ React48.createElement("span", { className: "text-xs text-black" }, selectedCrypto.code),
|
|
4771
|
-
/* @__PURE__ */ React48.createElement("svg", { className: "w-3.5 h-3.5 text-
|
|
4772
|
-
))), rateDisplay && /* @__PURE__ */ React48.createElement("div", { className: "flex items-center justify-between text-
|
|
4800
|
+
/* @__PURE__ */ React48.createElement("svg", { className: "w-3.5 h-3.5 text-stone-500 ml-0.5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React48.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }))
|
|
4801
|
+
))), rateDisplay && /* @__PURE__ */ React48.createElement("div", { className: "flex items-center justify-between text-xs text-stone-500 px-1 -mt-2" }, /* @__PURE__ */ React48.createElement("span", null, "Exchange Rate"), /* @__PURE__ */ React48.createElement("span", { className: "text-black" }, rateDisplay)), !hideRecipientSection && /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-6 pt-4 border-t border-stone-100" }, /* @__PURE__ */ React48.createElement("div", { className: "space-y-2 flex-1 w-full relative" }, /* @__PURE__ */ React48.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Network / Blockchain"), /* @__PURE__ */ React48.createElement(
|
|
4773
4802
|
"button",
|
|
4774
4803
|
{
|
|
4775
4804
|
type: "button",
|
|
4776
4805
|
onClick: () => !readOnlyRecipientSection && setIsNetworkDialogOpen(true),
|
|
4777
4806
|
disabled: isSubmitting || selectedCrypto?.networks?.length <= 1 || readOnlyRecipientSection,
|
|
4778
|
-
className: `w-full px-2 py-3 text-sm bg-transparent border-b text-black transition-all outline-none flex items-center justify-between ${readOnlyRecipientSection ? "border-
|
|
4807
|
+
className: `w-full px-2 py-3 text-sm bg-transparent border-b text-black transition-all outline-none flex items-center justify-between ${readOnlyRecipientSection ? "border-stone-200 cursor-default opacity-80" : "border-stone-200 hover:border-black focus:border-black"}`
|
|
4779
4808
|
},
|
|
4780
4809
|
/* @__PURE__ */ React48.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React48.createElement(CircularLogo, { src: selectedNetwork.logoUrl || selectedCrypto.logoUrl, alt: selectedNetwork.name, fallbackText: selectedNetwork.symbol }), /* @__PURE__ */ React48.createElement("span", null, selectedNetwork.name)),
|
|
4781
|
-
!readOnlyRecipientSection && selectedCrypto?.networks?.length > 1 && /* @__PURE__ */ React48.createElement("svg", { className: "w-4 h-4 text-
|
|
4810
|
+
!readOnlyRecipientSection && selectedCrypto?.networks?.length > 1 && /* @__PURE__ */ React48.createElement("svg", { className: "w-4 h-4 text-stone-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React48.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }))
|
|
4782
4811
|
)), /* @__PURE__ */ React48.createElement(
|
|
4783
4812
|
TextInput,
|
|
4784
4813
|
{
|
|
@@ -4802,20 +4831,20 @@ var UniversalBuyCryptoPage = ({
|
|
|
4802
4831
|
"Buy ",
|
|
4803
4832
|
selectedCrypto.code,
|
|
4804
4833
|
" Now"
|
|
4805
|
-
))), isCryptoDialogOpen && /* @__PURE__ */ React48.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40" }, /* @__PURE__ */ React48.createElement("div", { className: "absolute inset-0", onClick: () => setIsCryptoDialogOpen(false) }), /* @__PURE__ */ React48.createElement("div", { className: "w-full max-w-sm bg-white rounded-2xl shadow-2xl overflow-hidden relative z-10 animate-in fade-in zoom-in-95 duration-200" }, /* @__PURE__ */ React48.createElement("button", { onClick: () => setIsCryptoDialogOpen(false), className: "absolute top-4 right-4 p-2 text-
|
|
4834
|
+
))), isCryptoDialogOpen && /* @__PURE__ */ React48.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40" }, /* @__PURE__ */ React48.createElement("div", { className: "absolute inset-0", onClick: () => setIsCryptoDialogOpen(false) }), /* @__PURE__ */ React48.createElement("div", { className: "w-full max-w-sm bg-white rounded-2xl shadow-2xl overflow-hidden relative z-10 animate-in fade-in zoom-in-95 duration-200" }, /* @__PURE__ */ React48.createElement("button", { onClick: () => setIsCryptoDialogOpen(false), className: "absolute top-4 right-4 p-2 text-stone-700 hover:text-stone-400 transition-colors outline-none" }, /* @__PURE__ */ React48.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React48.createElement("path", { d: "M18 6 6 18" }), /* @__PURE__ */ React48.createElement("path", { d: "m6 6 12 12" }))), /* @__PURE__ */ React48.createElement("div", { className: "p-6 sm:p-8" }, /* @__PURE__ */ React48.createElement("div", { className: "mb-6 mt-2" }, /* @__PURE__ */ React48.createElement("h2", { className: "text-xl text-black tracking-tight mb-2" }, "Select Cryptocurrency"), /* @__PURE__ */ React48.createElement("p", { className: "text-sm text-stone-500 leading-relaxed" }, "Choose the digital asset you want to purchase.")), /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-2 max-h-72 overflow-y-auto custom-scrollbar pr-1" }, cryptoOptions.map((c) => {
|
|
4806
4835
|
const isSelected = c.code === selectedCrypto.code;
|
|
4807
4836
|
return /* @__PURE__ */ React48.createElement(
|
|
4808
4837
|
"button",
|
|
4809
4838
|
{
|
|
4810
4839
|
key: c.code,
|
|
4811
4840
|
onClick: () => handleCryptoSelect(c),
|
|
4812
|
-
className: `flex items-center gap-4 p-3 rounded-full hover:bg-
|
|
4841
|
+
className: `flex items-center gap-4 p-3 rounded-full hover:bg-stone-50 transition-colors text-left outline-none border ${isSelected ? "border-black bg-stone-50/50" : "border-transparent"}`
|
|
4813
4842
|
},
|
|
4814
4843
|
/* @__PURE__ */ React48.createElement(CircularLogo, { src: c.logoUrl, alt: c.name, fallbackText: c.code }),
|
|
4815
|
-
/* @__PURE__ */ React48.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ React48.createElement("span", { className: "text-xs text-black truncate" }, c.name), /* @__PURE__ */ React48.createElement("span", { className: "text-
|
|
4844
|
+
/* @__PURE__ */ React48.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ React48.createElement("span", { className: "text-xs text-black truncate" }, c.name), /* @__PURE__ */ React48.createElement("span", { className: "text-xs text-stone-400" }, c.code)),
|
|
4816
4845
|
isSelected && /* @__PURE__ */ React48.createElement(HugeiconsIcon35, { icon: CheckmarkCircle02Icon, size: 16, className: "text-black" })
|
|
4817
4846
|
);
|
|
4818
|
-
}))))), isNetworkDialogOpen && /* @__PURE__ */ React48.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40" }, /* @__PURE__ */ React48.createElement("div", { className: "absolute inset-0", onClick: () => setIsNetworkDialogOpen(false) }), /* @__PURE__ */ React48.createElement("div", { className: "w-full max-w-sm bg-white rounded-2xl shadow-2xl overflow-hidden relative z-10 animate-in fade-in zoom-in-95 duration-200" }, /* @__PURE__ */ React48.createElement("button", { onClick: () => setIsNetworkDialogOpen(false), className: "absolute top-4 right-4 p-2 text-
|
|
4847
|
+
}))))), isNetworkDialogOpen && /* @__PURE__ */ React48.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40" }, /* @__PURE__ */ React48.createElement("div", { className: "absolute inset-0", onClick: () => setIsNetworkDialogOpen(false) }), /* @__PURE__ */ React48.createElement("div", { className: "w-full max-w-sm bg-white rounded-2xl shadow-2xl overflow-hidden relative z-10 animate-in fade-in zoom-in-95 duration-200" }, /* @__PURE__ */ React48.createElement("button", { onClick: () => setIsNetworkDialogOpen(false), className: "absolute top-4 right-4 p-2 text-stone-700 hover:text-stone-400 transition-colors outline-none" }, /* @__PURE__ */ React48.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React48.createElement("path", { d: "M18 6 6 18" }), /* @__PURE__ */ React48.createElement("path", { d: "m6 6 12 12" }))), /* @__PURE__ */ React48.createElement("div", { className: "p-6 sm:p-8" }, /* @__PURE__ */ React48.createElement("div", { className: "mb-6 mt-2" }, /* @__PURE__ */ React48.createElement("h2", { className: "text-xl text-black tracking-tight mb-2" }, "Select Network"), /* @__PURE__ */ React48.createElement("p", { className: "text-sm text-stone-500 leading-relaxed" }, "Ensure your receiving wallet supports this network.")), /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-2 max-h-72 overflow-y-auto custom-scrollbar pr-1" }, selectedCrypto?.networks?.map((net) => {
|
|
4819
4848
|
const isSelected = net.id === selectedNetwork.id;
|
|
4820
4849
|
return /* @__PURE__ */ React48.createElement(
|
|
4821
4850
|
"button",
|
|
@@ -4825,10 +4854,10 @@ var UniversalBuyCryptoPage = ({
|
|
|
4825
4854
|
setSelectedNetwork(net);
|
|
4826
4855
|
setIsNetworkDialogOpen(false);
|
|
4827
4856
|
},
|
|
4828
|
-
className: `flex items-center gap-4 p-3 rounded-full hover:bg-
|
|
4857
|
+
className: `flex items-center gap-4 p-3 rounded-full hover:bg-stone-50 transition-colors text-left outline-none border ${isSelected ? "border-black bg-stone-50/50" : "border-transparent"}`
|
|
4829
4858
|
},
|
|
4830
4859
|
/* @__PURE__ */ React48.createElement(CircularLogo, { src: net.logoUrl || selectedCrypto.logoUrl, alt: net.name, fallbackText: net.symbol }),
|
|
4831
|
-
/* @__PURE__ */ React48.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ React48.createElement("span", { className: "text-xs text-black truncate" }, net.name), /* @__PURE__ */ React48.createElement("span", { className: "text-
|
|
4860
|
+
/* @__PURE__ */ React48.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ React48.createElement("span", { className: "text-xs text-black truncate" }, net.name), /* @__PURE__ */ React48.createElement("span", { className: "text-xs text-stone-400" }, net.symbol)),
|
|
4832
4861
|
isSelected && /* @__PURE__ */ React48.createElement(HugeiconsIcon35, { icon: CheckmarkCircle02Icon, size: 16, className: "text-black" })
|
|
4833
4862
|
);
|
|
4834
4863
|
}))))));
|
|
@@ -4854,14 +4883,14 @@ var HuddleAvatar = ({ src, status, sizeClass = "w-10 h-10" }) => {
|
|
|
4854
4883
|
case "ONGOING":
|
|
4855
4884
|
return "bg-emerald-500";
|
|
4856
4885
|
case "COMPLETED":
|
|
4857
|
-
return "bg-
|
|
4886
|
+
return "bg-stone-400";
|
|
4858
4887
|
case "CANCELLED":
|
|
4859
4888
|
return "bg-rose-500";
|
|
4860
4889
|
default:
|
|
4861
|
-
return "bg-
|
|
4890
|
+
return "bg-stone-200";
|
|
4862
4891
|
}
|
|
4863
4892
|
};
|
|
4864
|
-
return /* @__PURE__ */ React49.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React49.createElement("div", { className: "w-full h-full rounded-lg bg-
|
|
4893
|
+
return /* @__PURE__ */ React49.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React49.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ React49.createElement(HugeiconsIcon36, { icon: Loading03Icon22, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ React49.createElement(
|
|
4865
4894
|
"img",
|
|
4866
4895
|
{
|
|
4867
4896
|
src: finalSrc,
|
|
@@ -4888,25 +4917,25 @@ var UniversalHuddlesPage = ({
|
|
|
4888
4917
|
"button",
|
|
4889
4918
|
{
|
|
4890
4919
|
onClick: () => onCreateHuddle?.(),
|
|
4891
|
-
className: "shrink-0 px-4 py-1.5 border border-
|
|
4920
|
+
className: "shrink-0 px-4 py-1.5 border border-stone-200 text-black text-xs tracking-wide rounded-full hover:bg-stone-50 transition-colors outline-none"
|
|
4892
4921
|
},
|
|
4893
4922
|
"Create new"
|
|
4894
|
-
)), headerDescription && /* @__PURE__ */ React49.createElement("p", { className: "text-
|
|
4923
|
+
)), headerDescription && /* @__PURE__ */ React49.createElement("p", { className: "text-xs text-stone-500" }, headerDescription)), /* @__PURE__ */ React49.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React49.createElement(PageSpinner6, null) : /* @__PURE__ */ React49.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React49.createElement("div", null, huddles.length === 0 ? /* @__PURE__ */ React49.createElement("p", { className: "text-xs text-stone-400 py-6 text-center" }, "No huddles available") : huddles.map((huddle) => /* @__PURE__ */ React49.createElement(
|
|
4895
4924
|
"div",
|
|
4896
4925
|
{
|
|
4897
4926
|
key: huddle.id,
|
|
4898
4927
|
onClick: () => onHuddleClick(huddle.id),
|
|
4899
|
-
className: "flex flex-row items-center gap-4 py-2 hover:bg-
|
|
4928
|
+
className: "flex flex-row items-center gap-4 py-2 hover:bg-stone-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
|
|
4900
4929
|
},
|
|
4901
4930
|
/* @__PURE__ */ React49.createElement(HuddleAvatar, { src: huddle.imageUrl, status: huddle.status }),
|
|
4902
|
-
/* @__PURE__ */ React49.createElement("div", { className: "flex flex-col min-w-0 flex-1" }, /* @__PURE__ */ React49.createElement("p", { className: "text-
|
|
4903
|
-
/* @__PURE__ */ React49.createElement(HugeiconsIcon36, { icon: ArrowRight01Icon11, size: 14, className: "shrink-0 text-
|
|
4904
|
-
))), /* @__PURE__ */ React49.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ React49.createElement("span", { className: "text-
|
|
4931
|
+
/* @__PURE__ */ React49.createElement("div", { className: "flex flex-col min-w-0 flex-1" }, /* @__PURE__ */ React49.createElement("p", { className: "text-sm text-black tracking-tight truncate" }, huddle.name), /* @__PURE__ */ React49.createElement("span", { className: "text-xs text-stone-500 truncate block mt-0.5" }, huddle.timeString)),
|
|
4932
|
+
/* @__PURE__ */ React49.createElement(HugeiconsIcon36, { icon: ArrowRight01Icon11, size: 14, className: "shrink-0 text-stone-400" })
|
|
4933
|
+
))), /* @__PURE__ */ React49.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ React49.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ React49.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React49.createElement(
|
|
4905
4934
|
"button",
|
|
4906
4935
|
{
|
|
4907
4936
|
onClick: () => onPageChange(currentPage - 1),
|
|
4908
4937
|
disabled: currentPage <= 1 || isLoading,
|
|
4909
|
-
className: "p-2 bg-white border border-
|
|
4938
|
+
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
4910
4939
|
},
|
|
4911
4940
|
/* @__PURE__ */ React49.createElement(HugeiconsIcon36, { icon: ArrowLeft01Icon15, size: 14 })
|
|
4912
4941
|
), /* @__PURE__ */ React49.createElement(
|
|
@@ -4914,7 +4943,7 @@ var UniversalHuddlesPage = ({
|
|
|
4914
4943
|
{
|
|
4915
4944
|
onClick: () => onPageChange(currentPage + 1),
|
|
4916
4945
|
disabled: currentPage >= totalPages || isLoading || totalPages === 0,
|
|
4917
|
-
className: "p-2 bg-white border border-
|
|
4946
|
+
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
4918
4947
|
},
|
|
4919
4948
|
/* @__PURE__ */ React49.createElement(HugeiconsIcon36, { icon: ArrowRight01Icon11, size: 14 })
|
|
4920
4949
|
)))))));
|
|
@@ -4946,12 +4975,12 @@ var MemberAvatar2 = ({ src, status }) => {
|
|
|
4946
4975
|
case "OFFLINE":
|
|
4947
4976
|
return "bg-rose-500";
|
|
4948
4977
|
case "AWAY":
|
|
4949
|
-
return "bg-
|
|
4978
|
+
return "bg-stone-400";
|
|
4950
4979
|
default:
|
|
4951
|
-
return "bg-
|
|
4980
|
+
return "bg-stone-200";
|
|
4952
4981
|
}
|
|
4953
4982
|
};
|
|
4954
|
-
return /* @__PURE__ */ React50.createElement("div", { className: "relative w-10 h-10 shrink-0" }, /* @__PURE__ */ React50.createElement("div", { className: "w-full h-full rounded-lg bg-
|
|
4983
|
+
return /* @__PURE__ */ React50.createElement("div", { className: "relative w-10 h-10 shrink-0" }, /* @__PURE__ */ React50.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ React50.createElement(HugeiconsIcon37, { icon: Loading03Icon23, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ React50.createElement(
|
|
4955
4984
|
"img",
|
|
4956
4985
|
{
|
|
4957
4986
|
src: finalSrc,
|
|
@@ -5062,37 +5091,37 @@ var UniversalMembersPage = ({
|
|
|
5062
5091
|
onClose: () => setMemberToRemove(null),
|
|
5063
5092
|
onConfirm: handleConfirmRemove
|
|
5064
5093
|
}
|
|
5065
|
-
), !isInviteMode && /* @__PURE__ */ React50.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full animate-in fade-in duration-300" }, /* @__PURE__ */ React50.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ React50.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React50.createElement(HugeiconsIcon37, { icon: Search01Icon5, size: 16, className: "text-
|
|
5094
|
+
), !isInviteMode && /* @__PURE__ */ React50.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full animate-in fade-in duration-300" }, /* @__PURE__ */ React50.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ React50.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React50.createElement(HugeiconsIcon37, { icon: Search01Icon5, size: 16, className: "text-stone-400" })), /* @__PURE__ */ React50.createElement(
|
|
5066
5095
|
"input",
|
|
5067
5096
|
{
|
|
5068
5097
|
type: "text",
|
|
5069
5098
|
placeholder: "Search members...",
|
|
5070
5099
|
value: localSearchQuery,
|
|
5071
5100
|
onChange: (e) => setLocalSearchQuery(e.target.value),
|
|
5072
|
-
className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-
|
|
5101
|
+
className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-sm text-black placeholder-stone-400 outline-none transition-colors focus:border-black"
|
|
5073
5102
|
}
|
|
5074
5103
|
)), /* @__PURE__ */ React50.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ React50.createElement(
|
|
5075
5104
|
"button",
|
|
5076
5105
|
{
|
|
5077
5106
|
onClick: () => setIsStatusModalOpen(true),
|
|
5078
|
-
className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-
|
|
5107
|
+
className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none"
|
|
5079
5108
|
},
|
|
5080
5109
|
/* @__PURE__ */ React50.createElement(HugeiconsIcon37, { icon: SearchList02Icon2, size: 16 })
|
|
5081
5110
|
), /* @__PURE__ */ React50.createElement(
|
|
5082
5111
|
"button",
|
|
5083
5112
|
{
|
|
5084
5113
|
onClick: () => setIsRoleModalOpen(true),
|
|
5085
|
-
className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-
|
|
5114
|
+
className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none"
|
|
5086
5115
|
},
|
|
5087
5116
|
/* @__PURE__ */ React50.createElement(HugeiconsIcon37, { icon: ListSettingIcon2, size: 16 })
|
|
5088
|
-
))), /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ React50.createElement("div", { className: "flex flex-row items-start justify-between gap-4" }, /* @__PURE__ */ React50.createElement("div", null, /* @__PURE__ */ React50.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, isInviteMode ? "Add Member" : headerTitle), headerDescription && !isInviteMode && /* @__PURE__ */ React50.createElement("p", { className: "text-
|
|
5117
|
+
))), /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ React50.createElement("div", { className: "flex flex-row items-start justify-between gap-4" }, /* @__PURE__ */ React50.createElement("div", null, /* @__PURE__ */ React50.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, isInviteMode ? "Add Member" : headerTitle), headerDescription && !isInviteMode && /* @__PURE__ */ React50.createElement("p", { className: "text-xs text-stone-500" }, headerDescription)), !isInviteMode && /* @__PURE__ */ React50.createElement(
|
|
5089
5118
|
"button",
|
|
5090
5119
|
{
|
|
5091
5120
|
onClick: () => setIsInviteMode(true),
|
|
5092
|
-
className: "shrink-0 px-4 py-2 border border-
|
|
5121
|
+
className: "shrink-0 px-4 py-2 border border-stone-200 text-black text-xs tracking-wide rounded-full hover:bg-stone-50 transition-colors outline-none"
|
|
5093
5122
|
},
|
|
5094
5123
|
"Invite Team"
|
|
5095
|
-
)), /* @__PURE__ */ React50.createElement("div", { className: "w-full overflow-hidden" }, isInviteMode ? /* @__PURE__ */ React50.createElement("form", { onSubmit: handleInviteSubmit, className: "flex flex-col gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ React50.createElement("div", { className: "space-y-1.5 mt-2" }, /* @__PURE__ */ React50.createElement("label", { className: "text-
|
|
5124
|
+
)), /* @__PURE__ */ React50.createElement("div", { className: "w-full overflow-hidden" }, isInviteMode ? /* @__PURE__ */ React50.createElement("form", { onSubmit: handleInviteSubmit, className: "flex flex-col gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ React50.createElement("div", { className: "space-y-1.5 mt-2" }, /* @__PURE__ */ React50.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Email Address"), /* @__PURE__ */ React50.createElement(
|
|
5096
5125
|
"input",
|
|
5097
5126
|
{
|
|
5098
5127
|
type: "email",
|
|
@@ -5100,7 +5129,7 @@ var UniversalMembersPage = ({
|
|
|
5100
5129
|
onChange: (e) => setInviteEmail(cleanEmailId(e.target.value)),
|
|
5101
5130
|
required: true,
|
|
5102
5131
|
autoFocus: true,
|
|
5103
|
-
className: "w-full px-2 py-3 bg-transparent text-sm border-b border-
|
|
5132
|
+
className: "w-full px-2 py-3 bg-transparent text-sm border-b border-stone-200 text-black outline-none focus:border-black transition-all duration-300",
|
|
5104
5133
|
placeholder: "name@company.com"
|
|
5105
5134
|
}
|
|
5106
5135
|
)), /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React50.createElement(
|
|
@@ -5121,36 +5150,36 @@ var UniversalMembersPage = ({
|
|
|
5121
5150
|
setInviteEmail("");
|
|
5122
5151
|
},
|
|
5123
5152
|
disabled: isInviting,
|
|
5124
|
-
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-
|
|
5153
|
+
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-stone-200 text-black hover:bg-stone-50 transition-colors outline-none text-xs tracking-wide"
|
|
5125
5154
|
},
|
|
5126
5155
|
"Cancel"
|
|
5127
|
-
))) : isListLoading ? /* @__PURE__ */ React50.createElement(PageSpinner7, null) : /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col min-w-0 animate-in fade-in duration-300" }, /* @__PURE__ */ React50.createElement("div", null, members.length === 0 ? /* @__PURE__ */ React50.createElement("p", { className: "text-
|
|
5156
|
+
))) : isListLoading ? /* @__PURE__ */ React50.createElement(PageSpinner7, null) : /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col min-w-0 animate-in fade-in duration-300" }, /* @__PURE__ */ React50.createElement("div", null, members.length === 0 ? /* @__PURE__ */ React50.createElement("p", { className: "text-xs text-stone-400 py-6 text-center" }, "No members found") : members.map((member) => /* @__PURE__ */ React50.createElement(React50.Fragment, { key: member.id }, expandedId === member.id ? /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col p-5 bg-stone-50 rounded-xl animate-in fade-in zoom-in-95 duration-200 gap-5 my-2" }, /* @__PURE__ */ React50.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ React50.createElement(MemberAvatar2, { src: member.avatarUrl, status: member.status }), /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React50.createElement("span", { className: "text-sm text-black tracking-tight truncate" }, member.name), /* @__PURE__ */ React50.createElement("span", { className: "text-xs text-stone-500 capitalize" }, member.role.toLowerCase()))), member.departmentName && /* @__PURE__ */ React50.createElement("div", { className: "pt-3 border-t border-stone-200" }, /* @__PURE__ */ React50.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-1" }, "Department"), /* @__PURE__ */ React50.createElement("span", { className: "text-sm text-black truncate block" }, member.departmentName)), /* @__PURE__ */ React50.createElement("div", { className: "flex gap-3 pt-2" }, !hideAction && /* @__PURE__ */ React50.createElement(
|
|
5128
5157
|
"button",
|
|
5129
5158
|
{
|
|
5130
5159
|
onClick: () => setMemberToRemove(member),
|
|
5131
|
-
className: "flex-1 py-2.5 bg-white border border-rose-200 text-rose-600 hover:bg-rose-50 rounded-full text-
|
|
5160
|
+
className: "flex-1 py-2.5 bg-white border border-rose-200 text-rose-600 hover:bg-rose-50 rounded-full text-xs tracking-wide transition-colors outline-none"
|
|
5132
5161
|
},
|
|
5133
5162
|
actionButtonText
|
|
5134
5163
|
), /* @__PURE__ */ React50.createElement(
|
|
5135
5164
|
"button",
|
|
5136
5165
|
{
|
|
5137
5166
|
onClick: () => setExpandedId(null),
|
|
5138
|
-
className: "flex-1 py-2.5 bg-white border border-
|
|
5167
|
+
className: "flex-1 py-2.5 bg-white border border-stone-200 text-black hover:bg-stone-100 rounded-full text-xs tracking-wide transition-colors outline-none"
|
|
5139
5168
|
},
|
|
5140
5169
|
"Close"
|
|
5141
5170
|
))) : /* @__PURE__ */ React50.createElement(
|
|
5142
5171
|
"div",
|
|
5143
5172
|
{
|
|
5144
5173
|
onClick: () => setExpandedId(member.id),
|
|
5145
|
-
className: "flex items-center justify-between py-3 hover:bg-
|
|
5174
|
+
className: "flex items-center justify-between py-3 hover:bg-stone-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
|
|
5146
5175
|
},
|
|
5147
|
-
/* @__PURE__ */ React50.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React50.createElement(MemberAvatar2, { src: member.avatarUrl, status: member.status }), /* @__PURE__ */ React50.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5" }, /* @__PURE__ */ React50.createElement("p", { className: "text-
|
|
5148
|
-
)))), /* @__PURE__ */ React50.createElement("div", { className: "flex items-center justify-between pt-6 mt-2" }, /* @__PURE__ */ React50.createElement("span", { className: "text-
|
|
5176
|
+
/* @__PURE__ */ React50.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React50.createElement(MemberAvatar2, { src: member.avatarUrl, status: member.status }), /* @__PURE__ */ React50.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5" }, /* @__PURE__ */ React50.createElement("p", { className: "text-sm text-black truncate" }, member.name), /* @__PURE__ */ React50.createElement("p", { className: "text-xs text-stone-500 capitalize truncate" }, member.role.toLowerCase())))
|
|
5177
|
+
)))), /* @__PURE__ */ React50.createElement("div", { className: "flex items-center justify-between pt-6 mt-2" }, /* @__PURE__ */ React50.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ React50.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React50.createElement(
|
|
5149
5178
|
"button",
|
|
5150
5179
|
{
|
|
5151
5180
|
onClick: () => onPageChange(currentPage - 1),
|
|
5152
5181
|
disabled: currentPage <= 1 || isListLoading,
|
|
5153
|
-
className: "p-2 bg-white border border-
|
|
5182
|
+
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
5154
5183
|
},
|
|
5155
5184
|
/* @__PURE__ */ React50.createElement(HugeiconsIcon37, { icon: ArrowLeft01Icon16, size: 14 })
|
|
5156
5185
|
), /* @__PURE__ */ React50.createElement(
|
|
@@ -5158,10 +5187,10 @@ var UniversalMembersPage = ({
|
|
|
5158
5187
|
{
|
|
5159
5188
|
onClick: () => onPageChange(currentPage + 1),
|
|
5160
5189
|
disabled: currentPage >= totalPages || isListLoading || totalPages === 0,
|
|
5161
|
-
className: "p-2 bg-white border border-
|
|
5190
|
+
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
5162
5191
|
},
|
|
5163
5192
|
/* @__PURE__ */ React50.createElement(HugeiconsIcon37, { icon: ArrowRight01Icon12, size: 14 })
|
|
5164
|
-
)))))), isStatusModalOpen && /* @__PURE__ */ React50.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React50.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => setIsStatusModalOpen(false) }), /* @__PURE__ */ React50.createElement("div", { ref: statusDropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React50.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ React50.createElement("h3", { className: "text-
|
|
5193
|
+
)))))), isStatusModalOpen && /* @__PURE__ */ React50.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React50.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => setIsStatusModalOpen(false) }), /* @__PURE__ */ React50.createElement("div", { ref: statusDropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React50.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ React50.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Status Filter")), /* @__PURE__ */ React50.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 gap-1" }, ["ALL", "ACTIVE", "BUSY", "OFFLINE", "AWAY"].map((option) => /* @__PURE__ */ React50.createElement(
|
|
5165
5194
|
"button",
|
|
5166
5195
|
{
|
|
5167
5196
|
key: option,
|
|
@@ -5169,10 +5198,10 @@ var UniversalMembersPage = ({
|
|
|
5169
5198
|
onStatusFilterChange(option);
|
|
5170
5199
|
setIsStatusModalOpen(false);
|
|
5171
5200
|
},
|
|
5172
|
-
className: `text-left px-4 py-3 text-
|
|
5201
|
+
className: `text-left px-4 py-3 text-xs tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeStatusFilter === option ? "bg-stone-100 text-black" : "text-stone-500 hover:bg-stone-50 hover:text-black"}`
|
|
5173
5202
|
},
|
|
5174
5203
|
/* @__PURE__ */ React50.createElement("span", { className: "truncate pr-2 capitalize" }, option.toLowerCase())
|
|
5175
|
-
))), /* @__PURE__ */ React50.createElement("div", { className: "w-full flex mt-2" }, /* @__PURE__ */ React50.createElement("button", { onClick: () => setIsStatusModalOpen(false), className: "w-full py-4 text-
|
|
5204
|
+
))), /* @__PURE__ */ React50.createElement("div", { className: "w-full flex mt-2" }, /* @__PURE__ */ React50.createElement("button", { onClick: () => setIsStatusModalOpen(false), className: "w-full py-4 text-sm text-stone-500 hover:text-black transition-colors outline-none" }, "Cancel")))), isRoleModalOpen && /* @__PURE__ */ React50.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React50.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => setIsRoleModalOpen(false) }), /* @__PURE__ */ React50.createElement("div", { ref: roleDropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React50.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ React50.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Role Filter")), /* @__PURE__ */ React50.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 gap-1" }, ["ALL", "ADMIN", "MANAGER", "MEMBER", "GUEST"].map((option) => /* @__PURE__ */ React50.createElement(
|
|
5176
5205
|
"button",
|
|
5177
5206
|
{
|
|
5178
5207
|
key: option,
|
|
@@ -5180,10 +5209,10 @@ var UniversalMembersPage = ({
|
|
|
5180
5209
|
onRoleFilterChange(option);
|
|
5181
5210
|
setIsRoleModalOpen(false);
|
|
5182
5211
|
},
|
|
5183
|
-
className: `text-left px-4 py-3 text-
|
|
5212
|
+
className: `text-left px-4 py-3 text-xs tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeRoleFilter === option ? "bg-stone-100 text-black" : "text-stone-500 hover:bg-stone-50 hover:text-black"}`
|
|
5184
5213
|
},
|
|
5185
5214
|
/* @__PURE__ */ React50.createElement("span", { className: "truncate pr-2 capitalize" }, option.toLowerCase())
|
|
5186
|
-
))), /* @__PURE__ */ React50.createElement("div", { className: "w-full flex mt-2" }, /* @__PURE__ */ React50.createElement("button", { onClick: () => setIsRoleModalOpen(false), className: "w-full py-4 text-
|
|
5215
|
+
))), /* @__PURE__ */ React50.createElement("div", { className: "w-full flex mt-2" }, /* @__PURE__ */ React50.createElement("button", { onClick: () => setIsRoleModalOpen(false), className: "w-full py-4 text-sm text-stone-500 hover:text-black transition-colors outline-none" }, "Cancel")))));
|
|
5187
5216
|
};
|
|
5188
5217
|
|
|
5189
5218
|
// src/components/UniversalHome2.tsx
|
|
@@ -5207,7 +5236,7 @@ var OrgAvatar = ({ src, sizeClass = "w-10 h-10" }) => {
|
|
|
5207
5236
|
const [error, setError] = useState37(false);
|
|
5208
5237
|
const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/office_a.avif";
|
|
5209
5238
|
const finalSrc = error || !src ? defaultAvatar : src;
|
|
5210
|
-
return /* @__PURE__ */ React51.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React51.createElement("div", { className: "w-full h-full rounded-lg bg-
|
|
5239
|
+
return /* @__PURE__ */ React51.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React51.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: Loading03Icon24, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ React51.createElement(
|
|
5211
5240
|
"img",
|
|
5212
5241
|
{
|
|
5213
5242
|
src: finalSrc,
|
|
@@ -5295,7 +5324,7 @@ var UniversalHome2 = ({
|
|
|
5295
5324
|
"button",
|
|
5296
5325
|
{
|
|
5297
5326
|
onClick: () => router.push("/app/settings"),
|
|
5298
|
-
className: "relative w-10 h-10 flex items-center justify-center rounded-full bg-white outline-none hover:bg-
|
|
5327
|
+
className: "relative w-10 h-10 flex items-center justify-center rounded-full bg-white outline-none hover:bg-stone-50 transition-colors"
|
|
5299
5328
|
},
|
|
5300
5329
|
/* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: Settings03Icon, size: 20, className: "text-black" })
|
|
5301
5330
|
), /* @__PURE__ */ React51.createElement(
|
|
@@ -5305,7 +5334,7 @@ var UniversalHome2 = ({
|
|
|
5305
5334
|
setShowNotifDialog(true);
|
|
5306
5335
|
setSelectedNotif(null);
|
|
5307
5336
|
},
|
|
5308
|
-
className: "relative w-10 h-10 flex items-center justify-center rounded-full bg-white outline-none hover:bg-
|
|
5337
|
+
className: "relative w-10 h-10 flex items-center justify-center rounded-full bg-white outline-none hover:bg-stone-50 transition-colors"
|
|
5309
5338
|
},
|
|
5310
5339
|
/* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: Notification01Icon2, size: 20, className: "text-black" }),
|
|
5311
5340
|
hasUnreadNotifs && /* @__PURE__ */ React51.createElement("span", { className: "absolute top-2.5 right-2.5 w-2 h-2 bg-red-500 rounded-full border border-white" })
|
|
@@ -5313,9 +5342,9 @@ var UniversalHome2 = ({
|
|
|
5313
5342
|
"div",
|
|
5314
5343
|
{
|
|
5315
5344
|
onClick: createHuddleAction?.onClick,
|
|
5316
|
-
className: "bg-[#
|
|
5345
|
+
className: "bg-[#d97757] rounded-2xl p-5 relative overflow-hidden flex flex-col h-32 sm:h-36 cursor-pointer hover:opacity-90 transition-opacity"
|
|
5317
5346
|
},
|
|
5318
|
-
/* @__PURE__ */ React51.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ React51.createElement("p", { className: "text-
|
|
5347
|
+
/* @__PURE__ */ React51.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ React51.createElement("p", { className: "text-sm sm:text-sm text-white leading-tight" }, "Create", /* @__PURE__ */ React51.createElement("br", null), /* @__PURE__ */ React51.createElement("span", { className: "text-white/70" }, "Huddle")), /* @__PURE__ */ React51.createElement("div", { className: "w-8 h-8 rounded-full bg-white/10 flex items-center justify-center" }, /* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: ArrowUpRight01Icon3, size: 16, className: "text-white" }))),
|
|
5319
5348
|
/* @__PURE__ */ React51.createElement(
|
|
5320
5349
|
"img",
|
|
5321
5350
|
{
|
|
@@ -5330,7 +5359,7 @@ var UniversalHome2 = ({
|
|
|
5330
5359
|
onClick: joinHuddleAction?.onClick,
|
|
5331
5360
|
className: "bg-[#ffffff] rounded-2xl p-5 relative overflow-hidden flex flex-col h-32 sm:h-36 cursor-pointer hover:opacity-90 transition-opacity"
|
|
5332
5361
|
},
|
|
5333
|
-
/* @__PURE__ */ React51.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ React51.createElement("p", { className: "text-
|
|
5362
|
+
/* @__PURE__ */ React51.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ React51.createElement("p", { className: "text-sm sm:text-sm text-black leading-tight" }, "Join", /* @__PURE__ */ React51.createElement("br", null), /* @__PURE__ */ React51.createElement("span", { className: "text-black/60" }, "Huddle")), /* @__PURE__ */ React51.createElement("div", { className: "w-8 h-8 rounded-full bg-black/5 flex items-center justify-center" }, /* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: ArrowRight01Icon13, size: 16, className: "text-black" }))),
|
|
5334
5363
|
/* @__PURE__ */ React51.createElement(
|
|
5335
5364
|
"img",
|
|
5336
5365
|
{
|
|
@@ -5344,7 +5373,7 @@ var UniversalHome2 = ({
|
|
|
5344
5373
|
{
|
|
5345
5374
|
...huddlesProps
|
|
5346
5375
|
}
|
|
5347
|
-
)), showOrgSwitcher && /* @__PURE__ */ React51.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React51.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowOrgSwitcher(false) }), /* @__PURE__ */ React51.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[80vh] h-auto" }, /* @__PURE__ */ React51.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React51.createElement("h3", { className: "text-
|
|
5376
|
+
)), showOrgSwitcher && /* @__PURE__ */ React51.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React51.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowOrgSwitcher(false) }), /* @__PURE__ */ React51.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[80vh] h-auto" }, /* @__PURE__ */ React51.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React51.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Switch Workspace"), /* @__PURE__ */ React51.createElement("button", { onClick: () => setShowOrgSwitcher(false), className: "text-stone-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: CancelCircleIcon11, size: 18 }))), /* @__PURE__ */ React51.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2" }, /* @__PURE__ */ React51.createElement("div", { className: "flex flex-col" }, organizations?.length === 0 ? /* @__PURE__ */ React51.createElement("div", { className: "p-8 text-center text-xs text-stone-400" }, "No organizations found.") : organizations?.map((org) => /* @__PURE__ */ React51.createElement(
|
|
5348
5377
|
"button",
|
|
5349
5378
|
{
|
|
5350
5379
|
key: org.id,
|
|
@@ -5352,11 +5381,11 @@ var UniversalHome2 = ({
|
|
|
5352
5381
|
onOrganizationSelect?.(org.id);
|
|
5353
5382
|
setShowOrgSwitcher(false);
|
|
5354
5383
|
},
|
|
5355
|
-
className: `p-4 flex items-center justify-between gap-3 cursor-pointer outline-none transition-colors border-b border-
|
|
5384
|
+
className: `p-4 flex items-center justify-between gap-3 cursor-pointer outline-none transition-colors border-b border-stone-50 last:border-0 ${activeOrgId === org.id ? "bg-stone-50" : "hover:bg-stone-50/50"}`
|
|
5356
5385
|
},
|
|
5357
5386
|
/* @__PURE__ */ React51.createElement(OrgAvatar, { src: org.avatarUrl }),
|
|
5358
|
-
/* @__PURE__ */ React51.createElement("div", { className: "flex flex-col items-start min-w-0 flex-1" }, /* @__PURE__ */ React51.createElement("span", { className: `text-
|
|
5359
|
-
activeOrgId === org.id && /* @__PURE__ */ React51.createElement("div", { className: "w-2 h-2 rounded-full bg-[#
|
|
5387
|
+
/* @__PURE__ */ React51.createElement("div", { className: "flex flex-col items-start min-w-0 flex-1" }, /* @__PURE__ */ React51.createElement("span", { className: `text-sm tracking-tight truncate w-full text-left ${activeOrgId === org.id ? "text-black " : "text-stone-600"}` }, org.name), /* @__PURE__ */ React51.createElement("span", { className: "text-xs text-stone-500 capitalize truncate w-full text-left mt-0.5" }, org.role?.toLowerCase() || "Member")),
|
|
5388
|
+
activeOrgId === org.id && /* @__PURE__ */ React51.createElement("div", { className: "w-2 h-2 rounded-full bg-[#d97757] shrink-0" })
|
|
5360
5389
|
)))), /* @__PURE__ */ React51.createElement("div", { className: "p-4 shrink-0" }, /* @__PURE__ */ React51.createElement(
|
|
5361
5390
|
"button",
|
|
5362
5391
|
{
|
|
@@ -5364,16 +5393,16 @@ var UniversalHome2 = ({
|
|
|
5364
5393
|
setShowOrgSwitcher(false);
|
|
5365
5394
|
setShowLogoutConfirm(true);
|
|
5366
5395
|
},
|
|
5367
|
-
className: "w-full py-2.5 flex items-center justify-center gap-2 rounded-full border border-
|
|
5396
|
+
className: "w-full py-2.5 flex items-center justify-center gap-2 rounded-full border border-stone-200 text-stone-600 hover:bg-stone-100 transition-colors outline-none text-xs tracking-wide"
|
|
5368
5397
|
},
|
|
5369
5398
|
/* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: Logout01Icon, size: 15 }),
|
|
5370
5399
|
"Log Out"
|
|
5371
|
-
)))), showNotifDialog && /* @__PURE__ */ React51.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React51.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowNotifDialog(false) }), /* @__PURE__ */ React51.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[80vh] h-auto" }, /* @__PURE__ */ React51.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, selectedNotif ? /* @__PURE__ */ React51.createElement("button", { onClick: () => setSelectedNotif(null), disabled: isResolving, className: "text-[#
|
|
5400
|
+
)))), showNotifDialog && /* @__PURE__ */ React51.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React51.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowNotifDialog(false) }), /* @__PURE__ */ React51.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[80vh] h-auto" }, /* @__PURE__ */ React51.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, selectedNotif ? /* @__PURE__ */ React51.createElement("button", { onClick: () => setSelectedNotif(null), disabled: isResolving, className: "text-[#d97757] hover:text-[#d97757] transition-colors outline-none flex items-center gap-2 text-xs tracking-widest disabled:opacity-50" }, /* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: ArrowLeft01Icon17, size: 14 }), " Back") : /* @__PURE__ */ React51.createElement("h3", { className: "text-sm text-black tracking-tight flex items-center gap-2" }, "Notifications"), /* @__PURE__ */ React51.createElement("button", { onClick: () => setShowNotifDialog(false), disabled: isResolving, className: "text-stone-400 hover:text-black transition-colors outline-none disabled:opacity-50" }, /* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: CancelCircleIcon11, size: 18 }))), /* @__PURE__ */ React51.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2 relative" }, isNotifsLoading && !selectedNotif && /* @__PURE__ */ React51.createElement("div", { className: "absolute inset-0 z-10 flex items-center justify-center" }, /* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: Loading03Icon24, size: 28, className: "animate-spin text-black" })), selectedNotif ? /* @__PURE__ */ React51.createElement("div", { className: "p-4 text-left" }, selectedNotif.type === "HUDDLE_INVITE" && selectedNotif.meta_json?.action === "RESOLVE_INVITE" && selectedNotif.meta_json?.completed ? /* @__PURE__ */ React51.createElement("div", { className: "mb-2" }, /* @__PURE__ */ React51.createElement("span", { className: "inline-flex items-center gap-1.5 px-3 py-1 rounded-full bg-emerald-50 text-emerald-600 text-xs tracking-wide" }, /* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: Tick02Icon2, size: 12 }), " Action Completed")) : /* @__PURE__ */ React51.createElement("h4", { className: "text-sm text-black mb-1" }, selectedNotif.title), /* @__PURE__ */ React51.createElement("span", { className: "text-xs text-stone-400 tracking-widest mb-4 block" }, formatNotifDate(selectedNotif.createdAt)), /* @__PURE__ */ React51.createElement("p", { className: "text-xs text-stone-600 leading-relaxed whitespace-pre-wrap" }, selectedNotif.message), selectedNotif.type === "HUDDLE_INVITE" && selectedNotif.meta_json?.action === "RESOLVE_INVITE" && /* @__PURE__ */ React51.createElement("div", { className: `mt-8 flex gap-3 pt-6 ${selectedNotif.meta_json?.completed ? "opacity-40 pointer-events-none cursor-not-allowed" : ""}` }, /* @__PURE__ */ React51.createElement(
|
|
5372
5401
|
"button",
|
|
5373
5402
|
{
|
|
5374
5403
|
onClick: () => handleResolve("ACCEPTED"),
|
|
5375
5404
|
disabled: isResolving || selectedNotif.meta_json?.completed,
|
|
5376
|
-
className: "flex-1 py-2.5 rounded-full bg-black text-white text-
|
|
5405
|
+
className: "flex-1 py-2.5 rounded-full bg-black text-white text-xs tracking-wide transition-all outline-none hover:bg-stone-800 flex justify-center items-center disabled:opacity-50"
|
|
5377
5406
|
},
|
|
5378
5407
|
isResolving ? /* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: Loading03Icon24, className: "animate-spin", size: 16 }) : "Accept"
|
|
5379
5408
|
), /* @__PURE__ */ React51.createElement(
|
|
@@ -5381,10 +5410,10 @@ var UniversalHome2 = ({
|
|
|
5381
5410
|
{
|
|
5382
5411
|
onClick: () => handleResolve("REJECTED"),
|
|
5383
5412
|
disabled: isResolving || selectedNotif.meta_json?.completed,
|
|
5384
|
-
className: "flex-1 py-2.5 rounded-full bg-white border border-
|
|
5413
|
+
className: "flex-1 py-2.5 rounded-full bg-white border border-stone-200 text-black text-xs tracking-wide transition-all outline-none hover:bg-stone-50 flex justify-center items-center disabled:opacity-50"
|
|
5385
5414
|
},
|
|
5386
5415
|
"Reject"
|
|
5387
|
-
))) : /* @__PURE__ */ React51.createElement("div", { className: "flex flex-col divide-y divide-
|
|
5416
|
+
))) : /* @__PURE__ */ React51.createElement("div", { className: "flex flex-col divide-y divide-stone-50/50" }, notifications?.length === 0 && !isNotifsLoading ? /* @__PURE__ */ React51.createElement("div", { className: "p-8 text-center text-xs text-stone-400" }, "You have no notifications.") : notifications?.map((notif) => /* @__PURE__ */ React51.createElement(
|
|
5388
5417
|
"div",
|
|
5389
5418
|
{
|
|
5390
5419
|
key: notif.id,
|
|
@@ -5392,16 +5421,16 @@ var UniversalHome2 = ({
|
|
|
5392
5421
|
setSelectedNotif(notif);
|
|
5393
5422
|
onNotificationClick?.(notif);
|
|
5394
5423
|
},
|
|
5395
|
-
className: `p-3 flex items-start gap-3 rounded-xl cursor-pointer transition-colors ${isNotifsLoading ? "opacity-50 pointer-events-none" : "hover:bg-
|
|
5424
|
+
className: `p-3 flex items-start gap-3 rounded-xl cursor-pointer transition-colors ${isNotifsLoading ? "opacity-50 pointer-events-none" : "hover:bg-stone-50"}`
|
|
5396
5425
|
},
|
|
5397
5426
|
/* @__PURE__ */ React51.createElement("div", { className: "mt-1.5 shrink-0" }, !notif.isRead ? /* @__PURE__ */ React51.createElement("div", { className: "w-1.5 h-1.5 bg-red-500 rounded-full" }) : /* @__PURE__ */ React51.createElement("div", { className: "w-1.5 h-1.5 bg-transparent" })),
|
|
5398
|
-
/* @__PURE__ */ React51.createElement("div", { className: "flex-1 min-w-0 text-left" }, /* @__PURE__ */ React51.createElement("h5", { className: `text-
|
|
5399
|
-
)))), !selectedNotif && /* @__PURE__ */ React51.createElement("div", { className: "p-4 flex items-center justify-between shrink-0" }, /* @__PURE__ */ React51.createElement("span", { className: "text-
|
|
5427
|
+
/* @__PURE__ */ React51.createElement("div", { className: "flex-1 min-w-0 text-left" }, /* @__PURE__ */ React51.createElement("h5", { className: `text-xs truncate ${notif.isRead ? "text-stone-500" : "text-black"}` }, notif.title), /* @__PURE__ */ React51.createElement("p", { className: "text-xs text-stone-400 truncate mt-0.5" }, notif.message), /* @__PURE__ */ React51.createElement("span", { className: "text-xs text-stone-400 tracking-widest mt-2 block" }, formatNotifDate(notif.createdAt)))
|
|
5428
|
+
)))), !selectedNotif && /* @__PURE__ */ React51.createElement("div", { className: "p-4 flex items-center justify-between shrink-0" }, /* @__PURE__ */ React51.createElement("span", { className: "text-xs text-stone-400 tracking-widest" }, "Page ", notificationPage, " of ", notificationTotalPages === 0 ? 1 : notificationTotalPages), /* @__PURE__ */ React51.createElement("div", { className: "flex gap-1" }, /* @__PURE__ */ React51.createElement(
|
|
5400
5429
|
"button",
|
|
5401
5430
|
{
|
|
5402
5431
|
disabled: notificationPage <= 1 || isNotifsLoading,
|
|
5403
5432
|
onClick: () => onNotificationPageChange?.(notificationPage - 1),
|
|
5404
|
-
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-
|
|
5433
|
+
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors"
|
|
5405
5434
|
},
|
|
5406
5435
|
/* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: ArrowLeft01Icon17, size: 12 })
|
|
5407
5436
|
), /* @__PURE__ */ React51.createElement(
|
|
@@ -5409,303 +5438,30 @@ var UniversalHome2 = ({
|
|
|
5409
5438
|
{
|
|
5410
5439
|
disabled: notificationPage >= notificationTotalPages || notificationTotalPages === 0 || isNotifsLoading,
|
|
5411
5440
|
onClick: () => onNotificationPageChange?.(notificationPage + 1),
|
|
5412
|
-
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-
|
|
5441
|
+
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors"
|
|
5413
5442
|
},
|
|
5414
5443
|
/* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: ArrowRight01Icon13, size: 12 })
|
|
5415
5444
|
))))));
|
|
5416
5445
|
};
|
|
5417
5446
|
|
|
5418
|
-
// src/components/OpenBidHome.tsx
|
|
5419
|
-
import React53, { useState as useState39, useRef as useRef14, useEffect as useEffect21 } from "react";
|
|
5420
|
-
import { HugeiconsIcon as HugeiconsIcon40 } from "@hugeicons/react";
|
|
5421
|
-
import {
|
|
5422
|
-
Loading03Icon as Loading03Icon25,
|
|
5423
|
-
Search01Icon as Search01Icon7,
|
|
5424
|
-
ArrowRight01Icon as ArrowRight01Icon14,
|
|
5425
|
-
ArrowLeft01Icon as ArrowLeft01Icon18,
|
|
5426
|
-
StarIcon,
|
|
5427
|
-
Link01Icon,
|
|
5428
|
-
ListSettingIcon as ListSettingIcon3
|
|
5429
|
-
} from "@hugeicons/core-free-icons";
|
|
5430
|
-
|
|
5431
|
-
// src/components/OptionWithIcon.tsx
|
|
5432
|
-
import React52, { useState as useState38 } from "react";
|
|
5433
|
-
import { HugeiconsIcon as HugeiconsIcon39 } from "@hugeicons/react";
|
|
5434
|
-
import { CancelCircleIcon as CancelCircleIcon12, Search01Icon as Search01Icon6 } from "@hugeicons/core-free-icons";
|
|
5435
|
-
var OptionWithIcon = ({
|
|
5436
|
-
isOpen,
|
|
5437
|
-
onClose,
|
|
5438
|
-
title,
|
|
5439
|
-
options,
|
|
5440
|
-
selectedOption,
|
|
5441
|
-
onSelect,
|
|
5442
|
-
showSearch = false
|
|
5443
|
-
}) => {
|
|
5444
|
-
const [searchQuery, setSearchQuery] = useState38("");
|
|
5445
|
-
if (!isOpen) return null;
|
|
5446
|
-
const filteredOptions = options.filter(
|
|
5447
|
-
(opt) => opt.label.toLowerCase().includes(searchQuery.toLowerCase())
|
|
5448
|
-
);
|
|
5449
|
-
return /* @__PURE__ */ React52.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React52.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: onClose }), /* @__PURE__ */ React52.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[80vh]" }, /* @__PURE__ */ React52.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React52.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, title), /* @__PURE__ */ React52.createElement("button", { onClick: onClose, className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: CancelCircleIcon12, size: 18 }))), showSearch && /* @__PURE__ */ React52.createElement("div", { className: "p-4 shrink-0 " }, /* @__PURE__ */ React52.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React52.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: Search01Icon6, size: 16, className: "text-neutral-400" })), /* @__PURE__ */ React52.createElement(
|
|
5450
|
-
"input",
|
|
5451
|
-
{
|
|
5452
|
-
type: "text",
|
|
5453
|
-
placeholder: "Search...",
|
|
5454
|
-
value: searchQuery,
|
|
5455
|
-
onChange: (e) => setSearchQuery(e.target.value),
|
|
5456
|
-
className: "w-full pl-10 pr-4 py-2.5 bg-neutral-100 rounded-full text-[12px] text-black placeholder-neutral-400 outline-none focus:bg-neutral-200 transition-colors"
|
|
5457
|
-
}
|
|
5458
|
-
))), /* @__PURE__ */ React52.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2" }, filteredOptions.length === 0 ? /* @__PURE__ */ React52.createElement("div", { className: "p-6 text-center text-[12px] text-neutral-400" }, "No options found.") : filteredOptions.map((opt) => {
|
|
5459
|
-
const isSelected = selectedOption.label === opt.label;
|
|
5460
|
-
return /* @__PURE__ */ React52.createElement(
|
|
5461
|
-
"button",
|
|
5462
|
-
{
|
|
5463
|
-
key: opt.label,
|
|
5464
|
-
onClick: () => {
|
|
5465
|
-
onSelect(opt);
|
|
5466
|
-
onClose();
|
|
5467
|
-
},
|
|
5468
|
-
className: `w-full flex items-center gap-3 p-4 text-[12px] tracking-tight rounded-full transition-colors outline-none ${isSelected ? "text-[#068afe] bg-[#068afe]/10" : "text-neutral-600 hover:bg-neutral-50/50"}`
|
|
5469
|
-
},
|
|
5470
|
-
opt.icon && /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: opt.icon, size: 16, className: isSelected ? "text-[#068afe]" : "text-neutral-400" }),
|
|
5471
|
-
/* @__PURE__ */ React52.createElement("span", null, opt.label.charAt(0).toUpperCase() + opt.label.slice(1).toLowerCase())
|
|
5472
|
-
);
|
|
5473
|
-
}))));
|
|
5474
|
-
};
|
|
5475
|
-
|
|
5476
|
-
// src/components/OpenBidHome.tsx
|
|
5477
|
-
var CATEGORIES = [
|
|
5478
|
-
{ label: "Leaderboards & Attention", icon: StarIcon },
|
|
5479
|
-
{ label: "SEO & AI Visibility", icon: Search01Icon7 },
|
|
5480
|
-
{ label: "AI Agents & Infrastructure", icon: Link01Icon },
|
|
5481
|
-
{ label: "Marketing & Advertising", icon: StarIcon },
|
|
5482
|
-
{ label: "Developer Tools", icon: ListSettingIcon3 },
|
|
5483
|
-
{ label: "Crypto, Web3 & Investing", icon: StarIcon }
|
|
5484
|
-
];
|
|
5485
|
-
var SiteAvatar = ({ src, sizeClass = "w-9 h-9" }) => {
|
|
5486
|
-
const [loaded, setLoaded] = useState39(false);
|
|
5487
|
-
const [error, setError] = useState39(false);
|
|
5488
|
-
return /* @__PURE__ */ React53.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React53.createElement("div", { className: "w-full h-full flex items-center justify-center overflow-hidden" }, !loaded && !error && src && /* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: Loading03Icon25, className: "animate-spin text-neutral-400 absolute", size: 14 }), error || !src ? /* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: StarIcon, className: "text-neutral-300", size: 18 }) : /* @__PURE__ */ React53.createElement(
|
|
5489
|
-
"img",
|
|
5490
|
-
{
|
|
5491
|
-
src,
|
|
5492
|
-
alt: "Site icon",
|
|
5493
|
-
className: `w-full h-full object-cover transition-opacity duration-300 ${loaded ? "opacity-100" : "opacity-0"}`,
|
|
5494
|
-
onLoad: () => setLoaded(true),
|
|
5495
|
-
onError: () => setError(true)
|
|
5496
|
-
}
|
|
5497
|
-
)));
|
|
5498
|
-
};
|
|
5499
|
-
var AnimatedCounter = ({ value }) => {
|
|
5500
|
-
const [count, setCount] = useState39(0);
|
|
5501
|
-
useEffect21(() => {
|
|
5502
|
-
let startTimestamp = 0;
|
|
5503
|
-
const duration = 2e3;
|
|
5504
|
-
let animationFrameId;
|
|
5505
|
-
const step = (timestamp) => {
|
|
5506
|
-
if (!startTimestamp) startTimestamp = timestamp;
|
|
5507
|
-
const progress = Math.min((timestamp - startTimestamp) / duration, 1);
|
|
5508
|
-
const easeProgress = progress === 1 ? 1 : 1 - Math.pow(2, -10 * progress);
|
|
5509
|
-
setCount(Math.floor(easeProgress * value));
|
|
5510
|
-
if (progress < 1) {
|
|
5511
|
-
animationFrameId = window.requestAnimationFrame(step);
|
|
5512
|
-
}
|
|
5513
|
-
};
|
|
5514
|
-
animationFrameId = window.requestAnimationFrame(step);
|
|
5515
|
-
return () => window.cancelAnimationFrame(animationFrameId);
|
|
5516
|
-
}, [value]);
|
|
5517
|
-
return /* @__PURE__ */ React53.createElement(React53.Fragment, null, count.toLocaleString());
|
|
5518
|
-
};
|
|
5519
|
-
var SkeletonRow = () => /* @__PURE__ */ React53.createElement("div", { className: "flex items-center gap-3 p-3 md:p-4 rounded-2xl mb-2" }, /* @__PURE__ */ React53.createElement("div", { className: "w-10 h-10 md:w-14 md:h-14 rounded-xl bg-neutral-200 animate-pulse shrink-0" }), /* @__PURE__ */ React53.createElement("div", { className: "flex-1 flex flex-col gap-3" }, /* @__PURE__ */ React53.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React53.createElement("div", { className: "h-4 bg-neutral-200 rounded w-1/3 animate-pulse" }), /* @__PURE__ */ React53.createElement("div", { className: "h-4 bg-neutral-200 rounded w-16 animate-pulse" })), /* @__PURE__ */ React53.createElement("div", { className: "h-3 bg-neutral-200 rounded w-2/3 animate-pulse" })));
|
|
5520
|
-
function OpenBidHome({
|
|
5521
|
-
data,
|
|
5522
|
-
latestActivity,
|
|
5523
|
-
isLoading,
|
|
5524
|
-
currentPage,
|
|
5525
|
-
totalPages,
|
|
5526
|
-
totalItems,
|
|
5527
|
-
onPageChange,
|
|
5528
|
-
totalProcessedAmount,
|
|
5529
|
-
inputFaviconSrc,
|
|
5530
|
-
onIdentityChange,
|
|
5531
|
-
onOutbidSubmit,
|
|
5532
|
-
isSubmitting,
|
|
5533
|
-
onlineCount = 0,
|
|
5534
|
-
visitorCount = 0
|
|
5535
|
-
}) {
|
|
5536
|
-
const topRef = useRef14(null);
|
|
5537
|
-
const [bidAmount, setBidAmount] = useState39(1);
|
|
5538
|
-
const [identity, setIdentity] = useState39("");
|
|
5539
|
-
const hasInitializedBid = useRef14(false);
|
|
5540
|
-
const [selectedCategory, setSelectedCategory] = useState39(CATEGORIES[0]);
|
|
5541
|
-
const [isCategoryModalOpen, setIsCategoryModalOpen] = useState39(false);
|
|
5542
|
-
const [isActivityExpanded, setIsActivityExpanded] = useState39(false);
|
|
5543
|
-
useEffect21(() => {
|
|
5544
|
-
if (data.length > 0 && !hasInitializedBid.current) {
|
|
5545
|
-
setBidAmount(data[0].amount + 1);
|
|
5546
|
-
hasInitializedBid.current = true;
|
|
5547
|
-
}
|
|
5548
|
-
}, [data]);
|
|
5549
|
-
const getProjectedRank = (amount) => {
|
|
5550
|
-
if (!data || data.length === 0) return 1;
|
|
5551
|
-
for (let i = 0; i < data.length; i++) {
|
|
5552
|
-
if (amount > data[i].amount) {
|
|
5553
|
-
return data[i].rank;
|
|
5554
|
-
}
|
|
5555
|
-
}
|
|
5556
|
-
return data[data.length - 1].rank + 1;
|
|
5557
|
-
};
|
|
5558
|
-
const projectedRank = getProjectedRank(bidAmount);
|
|
5559
|
-
const handleBidChange = (delta) => {
|
|
5560
|
-
setBidAmount((prev) => Math.max(1, prev + delta));
|
|
5561
|
-
};
|
|
5562
|
-
const handleClaimRankClick = (requiredAmount) => {
|
|
5563
|
-
setBidAmount(requiredAmount);
|
|
5564
|
-
topRef.current?.scrollIntoView({ behavior: "smooth" });
|
|
5565
|
-
const input = document.getElementById("identity-input");
|
|
5566
|
-
if (input) input.focus();
|
|
5567
|
-
};
|
|
5568
|
-
const handleSubmit = (e) => {
|
|
5569
|
-
e.preventDefault();
|
|
5570
|
-
onOutbidSubmit(identity, bidAmount, selectedCategory.label);
|
|
5571
|
-
};
|
|
5572
|
-
const handleIdentityChange = (e) => {
|
|
5573
|
-
const val = e.target.value;
|
|
5574
|
-
setIdentity(val);
|
|
5575
|
-
onIdentityChange(val);
|
|
5576
|
-
};
|
|
5577
|
-
return /* @__PURE__ */ React53.createElement("div", { className: "w-full max-w-4xl mx-auto flex flex-col px-4 pt-12 pb-24 animate-in fade-in duration-300" }, /* @__PURE__ */ React53.createElement("header", { className: "mb-12 px-2 text-center", ref: topRef }, /* @__PURE__ */ React53.createElement("div", { className: "inline-block max-w-full bg-white rounded-full px-4 py-2 text-xs text-neutral-500 transition-colors hover:text-black cursor-pointer leading-relaxed text-balance" }, /* @__PURE__ */ React53.createElement("span", { className: "inline-flex items-center gap-1.5 text-emerald-600 align-text-bottom whitespace-nowrap" }, /* @__PURE__ */ React53.createElement("span", { className: "relative flex h-2 w-2 shrink-0" }, /* @__PURE__ */ React53.createElement("span", { className: "animate-ping absolute inline-flex h-full w-full rounded-full bg-emerald-400 opacity-75" }), /* @__PURE__ */ React53.createElement("span", { className: "relative inline-flex rounded-full h-2 w-2 bg-emerald-500" })), /* @__PURE__ */ React53.createElement("span", null, onlineCount.toLocaleString(), " online")), /* @__PURE__ */ React53.createElement("span", { className: "mx-1.5" }, "\xB7"), /* @__PURE__ */ React53.createElement("span", null, visitorCount.toLocaleString(), " visitors since launch"), /* @__PURE__ */ React53.createElement("span", { className: "mx-1.5" }, "\xB7"), /* @__PURE__ */ React53.createElement("span", { className: "text-black underline decoration-neutral-300 hover:decoration-black transition-colors whitespace-nowrap" }, "Live stats"))), /* @__PURE__ */ React53.createElement("section", { className: "flex flex-col items-center mb-16" }, /* @__PURE__ */ React53.createElement("h2", { className: "flex flex-wrap items-center justify-center gap-x-3 text-center text-3xl md:text-5xl tracking-tight text-black mb-3" }, /* @__PURE__ */ React53.createElement("span", null, "Claim #", projectedRank, " for"), /* @__PURE__ */ React53.createElement("span", { className: "inline-flex items-center gap-3 bg-neutral-100 rounded-full p-1.5 border border-neutral-200" }, /* @__PURE__ */ React53.createElement("button", { onClick: () => handleBidChange(-1), type: "button", className: "w-8 h-8 md:w-10 md:h-10 flex items-center justify-center rounded-full bg-white text-black hover:bg-neutral-50 transition-colors outline-none text-lg" }, "\u2212"), /* @__PURE__ */ React53.createElement("div", { className: "flex items-center tracking-tight px-2 w-24 justify-center" }, /* @__PURE__ */ React53.createElement("span", { className: "text-[#068afe] mr-0.5" }, "$"), /* @__PURE__ */ React53.createElement(
|
|
5578
|
-
"input",
|
|
5579
|
-
{
|
|
5580
|
-
type: "number",
|
|
5581
|
-
value: bidAmount,
|
|
5582
|
-
onChange: (e) => setBidAmount(Math.max(1, Number(e.target.value))),
|
|
5583
|
-
className: "w-full bg-transparent p-0 outline-none text-center tabular-nums text-[#068afe] "
|
|
5584
|
-
}
|
|
5585
|
-
)), /* @__PURE__ */ React53.createElement("button", { onClick: () => handleBidChange(1), type: "button", className: "w-8 h-8 md:w-10 md:h-10 flex items-center justify-center rounded-full bg-white text-black hover:bg-neutral-50 transition-colors outline-none text-lg" }, "+"))), /* @__PURE__ */ React53.createElement("p", { className: "text-center text-sm text-neutral-500 max-w-md" }, /* @__PURE__ */ React53.createElement("span", { className: "text-[#068afe]" }, "New spots start at $1."), " Paying less than the #1 price puts you on the board at whatever rank your bid secures."), /* @__PURE__ */ React53.createElement("form", { onSubmit: handleSubmit, className: "mt-8 flex flex-col md:flex-row items-stretch md:items-center gap-3 w-full max-w-3xl bg-white p-2 rounded-2xl md:rounded-full" }, /* @__PURE__ */ React53.createElement("div", { className: "relative flex-1 min-w-0" }, /* @__PURE__ */ React53.createElement("div", { className: "absolute inset-y-0 left-0 pl-3 md:pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React53.createElement("div", { className: "w-7 h-7 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden" }, inputFaviconSrc ? /* @__PURE__ */ React53.createElement("img", { src: inputFaviconSrc, alt: "", className: "w-full h-full object-cover" }) : /* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: Link01Icon, size: 14, className: "text-neutral-400" }))), /* @__PURE__ */ React53.createElement(
|
|
5586
|
-
"input",
|
|
5587
|
-
{
|
|
5588
|
-
id: "identity-input",
|
|
5589
|
-
type: "text",
|
|
5590
|
-
placeholder: "Your product URL or @handle",
|
|
5591
|
-
value: identity,
|
|
5592
|
-
onChange: handleIdentityChange,
|
|
5593
|
-
required: true,
|
|
5594
|
-
className: "w-full pl-12 md:pl-14 pr-4 h-12 bg-transparent text-sm text-black placeholder-neutral-400 outline-none transition-colors"
|
|
5595
|
-
}
|
|
5596
|
-
)), /* @__PURE__ */ React53.createElement("div", { className: "h-px w-full md:h-8 md:w-px bg-neutral-200 hidden md:block" }), /* @__PURE__ */ React53.createElement("div", { className: "min-w-0 md:w-64 shrink-0" }, /* @__PURE__ */ React53.createElement(
|
|
5597
|
-
"button",
|
|
5598
|
-
{
|
|
5599
|
-
type: "button",
|
|
5600
|
-
onClick: () => setIsCategoryModalOpen(true),
|
|
5601
|
-
className: "flex items-center justify-between w-full gap-2 h-12 px-4 bg-transparent outline-none text-sm text-black hover:text-black"
|
|
5602
|
-
},
|
|
5603
|
-
/* @__PURE__ */ React53.createElement("div", { className: "flex items-center gap-2 truncate" }, selectedCategory.icon && /* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: selectedCategory.icon, size: 16, className: "text-[#068afe] shrink-0" }), /* @__PURE__ */ React53.createElement("span", { className: "truncate" }, selectedCategory.label)),
|
|
5604
|
-
/* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: ListSettingIcon3, size: 16, className: "text-neutral-400 shrink-0" })
|
|
5605
|
-
)), /* @__PURE__ */ React53.createElement(
|
|
5606
|
-
ThreeDActionButton,
|
|
5607
|
-
{
|
|
5608
|
-
type: "submit",
|
|
5609
|
-
isLoading: isSubmitting,
|
|
5610
|
-
disabled: !identity || isSubmitting,
|
|
5611
|
-
className: "h-12 px-8 min-w-30 w-full md:w-auto md:rounded-full"
|
|
5612
|
-
},
|
|
5613
|
-
"Place Bid"
|
|
5614
|
-
)), /* @__PURE__ */ React53.createElement("p", { className: "mt-4 text-xs text-neutral-400" }, "Already on the list? Enter the same URL to increase your bid.")), /* @__PURE__ */ React53.createElement("div", { className: "mb-6 relative" }, /* @__PURE__ */ React53.createElement("div", { className: "flex overflow-x-auto gap-2 pb-2 custom-scrollbar items-center" }, /* @__PURE__ */ React53.createElement("button", { className: "flex items-center gap-1.5 px-4 py-1.5 rounded-full border border-black bg-black text-white text-xs shrink-0 whitespace-nowrap transition-colors outline-none" }, "All"), CATEGORIES.map((cat) => /* @__PURE__ */ React53.createElement("button", { key: cat.label, className: "flex items-center gap-1.5 px-4 py-2 rounded-full bg-white text-black hover:bg-neutral-50 text-xs shrink-0 whitespace-nowrap transition-colors outline-none" }, cat.icon && /* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: cat.icon, size: 14, className: "text-neutral-400" }), cat.label))), /* @__PURE__ */ React53.createElement("div", { className: "absolute inset-y-0 right-0 w-12 bg-linear-to-l from-neutral-100 to-transparent pointer-events-none" })), /* @__PURE__ */ React53.createElement("div", { className: "flex flex-col relative w-full" }, isLoading ? /* @__PURE__ */ React53.createElement(React53.Fragment, null, Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ React53.createElement(SkeletonRow, { key: `skel-${i}` }))) : data.length === 0 ? /* @__PURE__ */ React53.createElement("div", { className: "text-center py-12 text-sm text-neutral-500" }, "No data") : data.map((item, index) => {
|
|
5615
|
-
const requiredBid = item.amount + 1;
|
|
5616
|
-
const isRank1 = item.rank === 1;
|
|
5617
|
-
const isRank2 = item.rank === 2;
|
|
5618
|
-
const isRank3 = item.rank === 3;
|
|
5619
|
-
const showActivity = item.rank === 4 || data.length < 4 && index === data.length - 1;
|
|
5620
|
-
let cardClasses = "";
|
|
5621
|
-
let numClasses = "";
|
|
5622
|
-
if (isRank1) {
|
|
5623
|
-
cardClasses = "bg-[#068afe]/20 rounded-2xl md:px-4 px-3 py-2 md:py-3 my-1.5 md:my-3";
|
|
5624
|
-
numClasses = "bg-[#068afe] text-white";
|
|
5625
|
-
} else if (isRank2) {
|
|
5626
|
-
cardClasses = "bg-[#068afe]/10 rounded-2xl md:px-4 px-3 py-2 md:py-3 my-1.5 md:my-3";
|
|
5627
|
-
numClasses = "bg-[#068afe] text-white";
|
|
5628
|
-
} else if (isRank3) {
|
|
5629
|
-
cardClasses = "bg-[#068afe]/5 rounded-2xl md:px-4 px-3 py-2 md:py-3 my-1.5 md:my-3";
|
|
5630
|
-
numClasses = "bg-[#068afe] text-white";
|
|
5631
|
-
} else {
|
|
5632
|
-
cardClasses = "border-t border-neutral-200 bg-transparent px-3 md:px-4 py-3 md:py-4 rounded-none";
|
|
5633
|
-
numClasses = "text-neutral-400 bg-transparent";
|
|
5634
|
-
}
|
|
5635
|
-
return /* @__PURE__ */ React53.createElement(React53.Fragment, { key: item.id }, showActivity && /* @__PURE__ */ React53.createElement("div", { className: "my-6 md:my-8 bg-white rounded-2xl p-4 md:p-5 relative" }, /* @__PURE__ */ React53.createElement("h2", { className: "text-sm mb-3 flex items-center gap-2" }, /* @__PURE__ */ React53.createElement("span", { className: "relative flex h-2 w-2" }, /* @__PURE__ */ React53.createElement("span", { className: "animate-ping absolute inline-flex h-full w-full rounded-full bg-[#068afe] opacity-75" }), /* @__PURE__ */ React53.createElement("span", { className: "relative inline-flex rounded-full h-2 w-2 bg-[#068afe]" })), "Latest activity"), latestActivity.length === 0 ? /* @__PURE__ */ React53.createElement("div", { className: "text-center py-6 text-sm text-neutral-400" }, "No data") : /* @__PURE__ */ React53.createElement("div", { className: `relative ${!isActivityExpanded ? "max-h-18 md:max-h-22 overflow-hidden md:overflow-visible" : ""}` }, /* @__PURE__ */ React53.createElement("div", { className: "flex flex-col md:grid md:grid-cols-5 md:gap-2" }, latestActivity.map((act, idx) => /* @__PURE__ */ React53.createElement("div", { key: act.id, className: `flex flex-row items-center gap-3 py-2 md:p-3 md:rounded-2xl md:bg-neutral-50 md:hover:bg-neutral-100 transition-colors ${idx !== 0 ? "border-t border-neutral-100 md:border-0" : ""}` }, /* @__PURE__ */ React53.createElement(SiteAvatar, { src: act.favicon, sizeClass: "w-7 h-7 shrink-0" }), /* @__PURE__ */ React53.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React53.createElement("p", { className: "text-xs text-black truncate" }, act.name), /* @__PURE__ */ React53.createElement("p", { className: "text-[10px] text-neutral-500 mt-0.5" }, "at #", act.rank, " \xB7 $", act.amount), /* @__PURE__ */ React53.createElement("p", { className: "text-[9px] text-neutral-400 mt-0.5" }, act.time))))), !isActivityExpanded && /* @__PURE__ */ React53.createElement("div", { className: "absolute inset-x-0 bottom-0 h-16 bg-linear-to-t from-white via-white/90 to-transparent pointer-events-none md:hidden flex items-end justify-center pb-1" }, /* @__PURE__ */ React53.createElement(
|
|
5636
|
-
"button",
|
|
5637
|
-
{
|
|
5638
|
-
onClick: () => setIsActivityExpanded(true),
|
|
5639
|
-
className: "pointer-events-auto px-4 py-1.5 bg-white border border-neutral-200 rounded-full text-[11px] outline-none"
|
|
5640
|
-
},
|
|
5641
|
-
"Show more"
|
|
5642
|
-
))), isActivityExpanded && latestActivity.length > 0 && /* @__PURE__ */ React53.createElement("div", { className: "mt-4 flex justify-center md:hidden" }, /* @__PURE__ */ React53.createElement(
|
|
5643
|
-
"button",
|
|
5644
|
-
{
|
|
5645
|
-
onClick: () => setIsActivityExpanded(false),
|
|
5646
|
-
className: "px-4 py-1.5 bg-white border border-neutral-200 rounded-full text-[11px] outline-none"
|
|
5647
|
-
},
|
|
5648
|
-
"Show less"
|
|
5649
|
-
))), /* @__PURE__ */ React53.createElement("div", { className: `group relative flex items-center justify-between transition-colors duration-300 ${cardClasses}` }, /* @__PURE__ */ React53.createElement("a", { href: item.url, target: "_blank", rel: "noopener noreferrer", className: "absolute inset-0 z-0 outline-none" }), /* @__PURE__ */ React53.createElement("div", { className: "flex items-center gap-3 md:gap-4 flex-1 min-w-0 z-10 pointer-events-none group-hover:text-[#068afe]" }, /* @__PURE__ */ React53.createElement("div", { className: "flex flex-col md:flex-row items-center gap-2 md:gap-3 shrink-0" }, /* @__PURE__ */ React53.createElement("span", { className: `inline-flex items-center justify-center tabular-nums min-w-7 md:min-w-10 px-2 py-0.5 md:py-1 rounded-full text-[11px] md:text-xs ${numClasses}` }, "#", item.rank), /* @__PURE__ */ React53.createElement(SiteAvatar, { src: item.favicon })), /* @__PURE__ */ React53.createElement("div", { className: "flex flex-col min-w-0 flex-1 transition-opacity duration-300" }, /* @__PURE__ */ React53.createElement("div", { className: "flex items-baseline gap-2 mb-0.5" }, /* @__PURE__ */ React53.createElement("p", { className: "text-black group-hover:text-[#068afe] text-sm truncate tracking-tight" }, item.name), /* @__PURE__ */ React53.createElement("p", { className: "text-[#068afe] text-[12px] shrink-0 tabular-nums" }, "$", item.amount.toLocaleString())), /* @__PURE__ */ React53.createElement("p", { className: "text-neutral-500 text-xs line-clamp-1 md:line-clamp-2 leading-relaxed" }, item.desc), /* @__PURE__ */ React53.createElement("div", { className: "flex items-center gap-2 mt-1.5 text-[10px] md:text-[11px] text-neutral-400 " }, /* @__PURE__ */ React53.createElement("span", null, item.time), /* @__PURE__ */ React53.createElement("span", { className: "flex items-center gap-1 text-black" }, /* @__PURE__ */ React53.createElement("span", { className: "relative flex h-1.5 w-1.5" }, /* @__PURE__ */ React53.createElement("span", { className: "animate-ping absolute inline-flex h-full w-full rounded-full bg-[#068afe] opacity-75" }), /* @__PURE__ */ React53.createElement("span", { className: "relative inline-flex rounded-full h-1.5 w-1.5 bg-[#068afe]" })), item.clicks, " clicks")))), /* @__PURE__ */ React53.createElement("div", { className: "absolute left-1/2 -translate-x-1/2 top-0 -translate-y-1/2 z-20 opacity-0 group-hover:opacity-100 focus-within:opacity-100 transition-opacity duration-200" }, /* @__PURE__ */ React53.createElement(
|
|
5650
|
-
"button",
|
|
5651
|
-
{
|
|
5652
|
-
onClick: (e) => {
|
|
5653
|
-
e.stopPropagation();
|
|
5654
|
-
handleClaimRankClick(requiredBid);
|
|
5655
|
-
},
|
|
5656
|
-
className: "px-3 py-0.5 bg-[#068afe] text-white text-[11px] md:text-xs whitespace-nowrap rounded-full outline-none pointer-events-auto hover:bg-[#0575d9] transition-colors"
|
|
5657
|
-
},
|
|
5658
|
-
"claim this rank for $",
|
|
5659
|
-
requiredBid
|
|
5660
|
-
))), item.rank === 10 && /* @__PURE__ */ React53.createElement("div", { className: "flex items-center gap-3 py-6 px-4" }, /* @__PURE__ */ React53.createElement("div", { className: "h-0.5 flex-1 bg-[#068afe]/20 rounded-full" }), /* @__PURE__ */ React53.createElement("span", { className: "text-xs tracking-widest text-[#068afe] px-3 py-1 bg-[#068afe]/10 border border-[#068afe]/20 rounded-full" }, "Top 10"), /* @__PURE__ */ React53.createElement("div", { className: "h-0.5 flex-1 bg-[#068afe]/20 rounded-full" })), item.rank === 20 && /* @__PURE__ */ React53.createElement("div", { className: "flex items-center gap-3 py-6 px-4" }, /* @__PURE__ */ React53.createElement("div", { className: "h-0.5 flex-1 bg-[#068afe]/20 rounded-full" }), /* @__PURE__ */ React53.createElement("span", { className: "text-xs tracking-widest text-[#068afe] px-3 py-1 bg-[#068afe]/10 border border-[#068afe]/20 rounded-full" }, "Top 20"), /* @__PURE__ */ React53.createElement("div", { className: "h-0.5 flex-1 bg-[#068afe]/20 rounded-full" })));
|
|
5661
|
-
})), !isLoading && data.length > 0 && /* @__PURE__ */ React53.createElement("div", { className: "mt-12 flex flex-col items-center gap-3" }, /* @__PURE__ */ React53.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React53.createElement(
|
|
5662
|
-
"button",
|
|
5663
|
-
{
|
|
5664
|
-
disabled: currentPage <= 1,
|
|
5665
|
-
onClick: () => onPageChange(currentPage - 1),
|
|
5666
|
-
className: "w-10 h-10 flex items-center justify-center rounded-full bg-white text-black hover:bg-neutral-50 disabled:text-neutral-300 disabled:bg-white outline-none transition-colors"
|
|
5667
|
-
},
|
|
5668
|
-
/* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: ArrowLeft01Icon18, size: 16 })
|
|
5669
|
-
), /* @__PURE__ */ React53.createElement("span", { className: "w-10 h-10 flex items-center justify-center rounded-full bg-black text-white text-sm outline-none" }, currentPage), /* @__PURE__ */ React53.createElement(
|
|
5670
|
-
"button",
|
|
5671
|
-
{
|
|
5672
|
-
disabled: currentPage >= totalPages,
|
|
5673
|
-
onClick: () => onPageChange(currentPage + 1),
|
|
5674
|
-
className: "w-10 h-10 flex items-center justify-center rounded-full bg-white text-black hover:bg-neutral-50 disabled:text-neutral-300 disabled:bg-white outline-none transition-colors"
|
|
5675
|
-
},
|
|
5676
|
-
/* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: ArrowRight01Icon14, size: 16 })
|
|
5677
|
-
)), /* @__PURE__ */ React53.createElement("p", { className: "text-[11px] text-neutral-400 tracking-widest mt-1" }, Math.min((currentPage - 1) * 50 + 1, totalItems), " - ", Math.min(currentPage * 50, totalItems), " of ", totalItems)), /* @__PURE__ */ React53.createElement("section", { className: "mt-8 flex flex-col items-center" }, /* @__PURE__ */ React53.createElement("p", { className: "mb-4 text-xs tracking-widest text-neutral-400" }), /* @__PURE__ */ React53.createElement("div", { className: "bg-white rounded-full px-10 py-3 flex items-baseline justify-center tracking-tighter text-4xl text-black" }, /* @__PURE__ */ React53.createElement("span", { className: "text-[#068afe] mr-2" }, "$"), /* @__PURE__ */ React53.createElement(AnimatedCounter, { value: totalProcessedAmount })), /* @__PURE__ */ React53.createElement("p", { className: "mt-4 text-xs tracking-widest text-neutral-400" }, "Total Processed")), /* @__PURE__ */ React53.createElement(
|
|
5678
|
-
OptionWithIcon,
|
|
5679
|
-
{
|
|
5680
|
-
isOpen: isCategoryModalOpen,
|
|
5681
|
-
onClose: () => setIsCategoryModalOpen(false),
|
|
5682
|
-
title: "Select Category",
|
|
5683
|
-
options: CATEGORIES,
|
|
5684
|
-
selectedOption: selectedCategory,
|
|
5685
|
-
onSelect: (val) => setSelectedCategory(val),
|
|
5686
|
-
showSearch: true
|
|
5687
|
-
}
|
|
5688
|
-
));
|
|
5689
|
-
}
|
|
5690
|
-
|
|
5691
5447
|
// src/components/UniversalSettings.tsx
|
|
5692
|
-
import
|
|
5448
|
+
import React52, { useState as useState38, useEffect as useEffect21, useRef as useRef14 } from "react";
|
|
5693
5449
|
import toast14 from "react-hot-toast";
|
|
5694
|
-
import { HugeiconsIcon as
|
|
5450
|
+
import { HugeiconsIcon as HugeiconsIcon39 } from "@hugeicons/react";
|
|
5695
5451
|
import {
|
|
5696
|
-
ArrowLeft01Icon as
|
|
5697
|
-
ArrowRight01Icon as
|
|
5698
|
-
Loading03Icon as
|
|
5699
|
-
Search01Icon as
|
|
5452
|
+
ArrowLeft01Icon as ArrowLeft01Icon18,
|
|
5453
|
+
ArrowRight01Icon as ArrowRight01Icon14,
|
|
5454
|
+
Loading03Icon as Loading03Icon25,
|
|
5455
|
+
Search01Icon as Search01Icon6,
|
|
5700
5456
|
SearchList02Icon as SearchList02Icon3,
|
|
5701
|
-
ListSettingIcon as
|
|
5457
|
+
ListSettingIcon as ListSettingIcon3,
|
|
5702
5458
|
CircleLock02Icon as CircleLock02Icon3,
|
|
5703
5459
|
Coins01Icon,
|
|
5704
5460
|
PlusSignIcon as PlusSignIcon3
|
|
5705
5461
|
} from "@hugeicons/core-free-icons";
|
|
5706
5462
|
var MemberAvatar3 = ({ src, status, sizeClass = "w-10 h-10" }) => {
|
|
5707
|
-
const [loaded, setLoaded] =
|
|
5708
|
-
const [error, setError] =
|
|
5463
|
+
const [loaded, setLoaded] = useState38(false);
|
|
5464
|
+
const [error, setError] = useState38(false);
|
|
5709
5465
|
const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
|
|
5710
5466
|
const finalSrc = error || !src ? defaultAvatar : src;
|
|
5711
5467
|
const getStatusColor = () => {
|
|
@@ -5717,15 +5473,15 @@ var MemberAvatar3 = ({ src, status, sizeClass = "w-10 h-10" }) => {
|
|
|
5717
5473
|
case "OFFLINE":
|
|
5718
5474
|
return "bg-rose-500";
|
|
5719
5475
|
case "AWAY":
|
|
5720
|
-
return "bg-
|
|
5476
|
+
return "bg-stone-400";
|
|
5721
5477
|
default:
|
|
5722
|
-
return "bg-
|
|
5478
|
+
return "bg-stone-200";
|
|
5723
5479
|
}
|
|
5724
5480
|
};
|
|
5725
|
-
return /* @__PURE__ */
|
|
5481
|
+
return /* @__PURE__ */ React52.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React52.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: Loading03Icon25, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ React52.createElement("img", { src: finalSrc, alt: "Member", className: `w-full h-full object-cover transition-opacity duration-300 ${loaded || error ? "opacity-100" : "opacity-0"}`, onLoad: () => setLoaded(true), onError: () => setError(true) })), /* @__PURE__ */ React52.createElement("div", { className: `absolute -bottom-1 -right-1 w-3.5 h-3.5 rounded-full border-2 border-white z-10 ${getStatusColor()}` }));
|
|
5726
5482
|
};
|
|
5727
|
-
var PageSpinner8 = () => /* @__PURE__ */
|
|
5728
|
-
var InputSpinner3 = () => /* @__PURE__ */
|
|
5483
|
+
var PageSpinner8 = () => /* @__PURE__ */ React52.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: Loading03Icon25, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
5484
|
+
var InputSpinner3 = () => /* @__PURE__ */ React52.createElement("svg", { className: "animate-spin h-4 w-4 text-stone-400", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, /* @__PURE__ */ React52.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ React52.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" }));
|
|
5729
5485
|
var UniversalSettings = ({
|
|
5730
5486
|
accountType,
|
|
5731
5487
|
userRole,
|
|
@@ -5763,37 +5519,37 @@ var UniversalSettings = ({
|
|
|
5763
5519
|
if (typeof window !== "undefined") window.history.back();
|
|
5764
5520
|
});
|
|
5765
5521
|
const isOrg = accountType === "ORGANIZATION";
|
|
5766
|
-
const canManage = userRole === "ADMIN" || userRole === "MANAGER"
|
|
5767
|
-
const [activeTab, setActiveTab] =
|
|
5768
|
-
const [expandedId, setExpandedId] =
|
|
5769
|
-
const [memberToRemove, setMemberToRemove] =
|
|
5770
|
-
const [isRemoving, setIsRemoving] =
|
|
5771
|
-
const [isInviteMode, setIsInviteMode] =
|
|
5772
|
-
const [inviteEmail, setInviteEmail] =
|
|
5773
|
-
const [isInviting, setIsInviting] =
|
|
5774
|
-
const [localSearchQuery, setLocalSearchQuery] =
|
|
5775
|
-
const [isTyping, setIsTyping] =
|
|
5776
|
-
const isFirstSearchMount =
|
|
5777
|
-
const [isStatusModalOpen, setIsStatusModalOpen] =
|
|
5778
|
-
const [isRoleModalOpen, setIsRoleModalOpen] =
|
|
5779
|
-
const [roleEditTarget, setRoleEditTarget] =
|
|
5780
|
-
const [isUpdatingRole, setIsUpdatingRole] =
|
|
5781
|
-
const [orgName, setOrgName] =
|
|
5782
|
-
const [orgSlug, setOrgSlug] =
|
|
5783
|
-
const [firstName, setFirstName] =
|
|
5784
|
-
const [lastName, setLastName] =
|
|
5785
|
-
const [isCheckingSlug, setIsCheckingSlug] =
|
|
5786
|
-
const [slugAvailable, setSlugAvailable] =
|
|
5787
|
-
const [isSavingOrg, setIsSavingOrg] =
|
|
5788
|
-
const [isSavingProfile, setIsSavingProfile] =
|
|
5789
|
-
|
|
5522
|
+
const canManage = userRole === "ADMIN" || userRole === "MANAGER";
|
|
5523
|
+
const [activeTab, setActiveTab] = useState38(isOrg ? "MEMBERS" : "ACCOUNT");
|
|
5524
|
+
const [expandedId, setExpandedId] = useState38(null);
|
|
5525
|
+
const [memberToRemove, setMemberToRemove] = useState38(null);
|
|
5526
|
+
const [isRemoving, setIsRemoving] = useState38(false);
|
|
5527
|
+
const [isInviteMode, setIsInviteMode] = useState38(false);
|
|
5528
|
+
const [inviteEmail, setInviteEmail] = useState38("");
|
|
5529
|
+
const [isInviting, setIsInviting] = useState38(false);
|
|
5530
|
+
const [localSearchQuery, setLocalSearchQuery] = useState38(membersSearchQuery);
|
|
5531
|
+
const [isTyping, setIsTyping] = useState38(false);
|
|
5532
|
+
const isFirstSearchMount = useRef14(true);
|
|
5533
|
+
const [isStatusModalOpen, setIsStatusModalOpen] = useState38(false);
|
|
5534
|
+
const [isRoleModalOpen, setIsRoleModalOpen] = useState38(false);
|
|
5535
|
+
const [roleEditTarget, setRoleEditTarget] = useState38(null);
|
|
5536
|
+
const [isUpdatingRole, setIsUpdatingRole] = useState38(false);
|
|
5537
|
+
const [orgName, setOrgName] = useState38(initialOrgName);
|
|
5538
|
+
const [orgSlug, setOrgSlug] = useState38(initialOrgSlug);
|
|
5539
|
+
const [firstName, setFirstName] = useState38("");
|
|
5540
|
+
const [lastName, setLastName] = useState38("");
|
|
5541
|
+
const [isCheckingSlug, setIsCheckingSlug] = useState38(false);
|
|
5542
|
+
const [slugAvailable, setSlugAvailable] = useState38(null);
|
|
5543
|
+
const [isSavingOrg, setIsSavingOrg] = useState38(false);
|
|
5544
|
+
const [isSavingProfile, setIsSavingProfile] = useState38(false);
|
|
5545
|
+
useEffect21(() => {
|
|
5790
5546
|
setOrgName(initialOrgName || "");
|
|
5791
5547
|
setOrgSlug(initialOrgSlug || "");
|
|
5792
5548
|
const parts = (initialFullName || "").split(" ");
|
|
5793
5549
|
setFirstName(parts[0] || "");
|
|
5794
5550
|
setLastName(parts.slice(1).join(" ") || "");
|
|
5795
5551
|
}, [initialOrgName, initialOrgSlug, initialFullName]);
|
|
5796
|
-
|
|
5552
|
+
useEffect21(() => {
|
|
5797
5553
|
if (activeTab !== "MEMBERS") return;
|
|
5798
5554
|
if (isFirstSearchMount.current) {
|
|
5799
5555
|
isFirstSearchMount.current = false;
|
|
@@ -5850,7 +5606,7 @@ var UniversalSettings = ({
|
|
|
5850
5606
|
}
|
|
5851
5607
|
};
|
|
5852
5608
|
const activeExpandedMember = expandedId ? members.find((m) => m.id === expandedId) : null;
|
|
5853
|
-
|
|
5609
|
+
useEffect21(() => {
|
|
5854
5610
|
if (!isOrg || !orgSlug || orgSlug === initialOrgSlug) {
|
|
5855
5611
|
setSlugAvailable(null);
|
|
5856
5612
|
setIsCheckingSlug(false);
|
|
@@ -5910,11 +5666,11 @@ var UniversalSettings = ({
|
|
|
5910
5666
|
const isOrgSaveDisabled = isSavingOrg || !canManage || isCheckingSlug || !hasOrgChanges || orgName.length < 3 || orgSlug.length < 3 || orgSlug !== initialOrgSlug && slugAvailable === false;
|
|
5911
5667
|
const hasProfileChanges = `${firstName} ${lastName}`.trim() !== initialFullName;
|
|
5912
5668
|
const isProfileSaveDisabled = isSavingProfile || !hasProfileChanges || firstName.length < 2 || lastName.length < 2;
|
|
5913
|
-
return /* @__PURE__ */
|
|
5669
|
+
return /* @__PURE__ */ React52.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React52.createElement(ManagedToaster, null), /* @__PURE__ */ React52.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React52.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-[#d97757] hover:text-[#d97757] transition-colors text-sm outline-none" }, /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: ArrowLeft01Icon18, size: 16 }), " Back")), /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col gap-1 mb-8 px-1" }, /* @__PURE__ */ React52.createElement("h1", { className: "text-black text-xl tracking-tight" }, "System Settings"), /* @__PURE__ */ React52.createElement("p", { className: "text-xs text-stone-500" }, "Manage your workspace identity, team configurations, and AI billing parameters.")), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-6 mb-6 overflow-x-auto custom-scrollbar px-1" }, isOrg && /* @__PURE__ */ React52.createElement("button", { onClick: () => {
|
|
5914
5670
|
setActiveTab("MEMBERS");
|
|
5915
5671
|
setExpandedId(null);
|
|
5916
5672
|
setIsInviteMode(false);
|
|
5917
|
-
}, className: `pb-3 text-
|
|
5673
|
+
}, className: `pb-3 text-sm tracking-wide outline-none transition-colors border-b-2 whitespace-nowrap ${activeTab === "MEMBERS" ? "border-black text-black" : "border-transparent text-stone-500 hover:text-black"}` }, "Members"), isOrg && /* @__PURE__ */ React52.createElement("button", { onClick: () => setActiveTab("ORGANIZATION"), className: `pb-3 text-sm tracking-wide outline-none transition-colors border-b-2 whitespace-nowrap ${activeTab === "ORGANIZATION" ? "border-black text-black" : "border-transparent text-stone-500 hover:text-black"}` }, "Organization"), /* @__PURE__ */ React52.createElement("button", { onClick: () => setActiveTab("ACCOUNT"), className: `pb-3 text-sm tracking-wide outline-none transition-colors border-b-2 whitespace-nowrap ${activeTab === "ACCOUNT" ? "border-black text-black" : "border-transparent text-stone-500 hover:text-black"}` }, "Profile")), activeTab === "MEMBERS" && isOrg && /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React52.createElement(
|
|
5918
5674
|
ConfirmationDialog,
|
|
5919
5675
|
{
|
|
5920
5676
|
isOpen: !!memberToRemove,
|
|
@@ -5927,32 +5683,32 @@ var UniversalSettings = ({
|
|
|
5927
5683
|
onClose: () => setMemberToRemove(null),
|
|
5928
5684
|
onConfirm: handleConfirmRemove
|
|
5929
5685
|
}
|
|
5930
|
-
), !isInviteMode && !activeExpandedMember && /* @__PURE__ */
|
|
5686
|
+
), !isInviteMode && !activeExpandedMember && /* @__PURE__ */ React52.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full px-1" }, /* @__PURE__ */ React52.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ React52.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: Search01Icon6, size: 16, className: "text-stone-400" })), /* @__PURE__ */ React52.createElement("input", { type: "text", placeholder: "Search members...", value: localSearchQuery, onChange: (e) => setLocalSearchQuery(e.target.value), className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-sm text-black placeholder-stone-400 outline-none transition-colors focus:border-black" })), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ React52.createElement("button", { onClick: () => setIsStatusModalOpen(true), className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: SearchList02Icon3, size: 16 })), /* @__PURE__ */ React52.createElement("button", { onClick: () => setIsRoleModalOpen(true), className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: ListSettingIcon3, size: 16 })))), /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, activeExpandedMember ? /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col animate-in fade-in zoom-in-95 duration-300 w-full" }, /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col gap-1 mb-8" }, /* @__PURE__ */ React52.createElement("h2", { className: "text-black text-xl tracking-tight" }, "Member Profile"), /* @__PURE__ */ React52.createElement("p", { className: "text-xs text-stone-500" }, "View and manage this member's access privileges.")), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-4 mb-8" }, /* @__PURE__ */ React52.createElement(MemberAvatar3, { src: activeExpandedMember.avatarUrl, status: activeExpandedMember.status, sizeClass: "w-14 h-14" }), /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React52.createElement("span", { className: "text-sm text-black tracking-tight truncate" }, activeExpandedMember.fullName), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-2 mt-0.5" }, /* @__PURE__ */ React52.createElement("span", { className: "text-xs text-stone-500 capitalize" }, activeExpandedMember.role.toLowerCase()), canManage && !activeExpandedMember.isRootAdmin && (isUpdatingRole ? /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: Loading03Icon25, size: 12, className: "animate-spin text-stone-400 ml-1" }) : /* @__PURE__ */ React52.createElement("button", { onClick: () => setRoleEditTarget(activeExpandedMember), className: "text-xs text-[#d97757] hover:underline outline-none" }, "Edit"))))), /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col sm:flex-row gap-3 pt-6 " }, canManage && !activeExpandedMember.isRootAdmin && /* @__PURE__ */ React52.createElement(
|
|
5931
5687
|
"button",
|
|
5932
5688
|
{
|
|
5933
5689
|
onClick: () => setMemberToRemove(activeExpandedMember),
|
|
5934
5690
|
disabled: isUpdatingRole,
|
|
5935
|
-
className: "w-full sm:flex-1 py-2.5 bg-white border border-rose-200 text-rose-600 hover:bg-rose-50 rounded-full text-
|
|
5691
|
+
className: "w-full sm:flex-1 py-2.5 bg-white border border-rose-200 text-rose-600 hover:bg-rose-50 rounded-full text-xs tracking-wide transition-colors outline-none disabled:opacity-50"
|
|
5936
5692
|
},
|
|
5937
5693
|
"Remove Access"
|
|
5938
|
-
), /* @__PURE__ */
|
|
5694
|
+
), /* @__PURE__ */ React52.createElement("button", { onClick: () => setExpandedId(null), disabled: isUpdatingRole, className: "w-full sm:flex-1 py-2.5 bg-white border border-stone-200 text-black hover:bg-stone-100 rounded-full text-xs tracking-wide transition-colors outline-none disabled:opacity-50" }, "Close Profile"))) : /* @__PURE__ */ React52.createElement(React52.Fragment, null, /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React52.createElement("div", { className: "flex flex-row items-center justify-between gap-4" }, /* @__PURE__ */ React52.createElement("h2", { className: "text-black text-xl tracking-tight" }, isInviteMode ? "Add Member" : "Team Directory"), !isInviteMode && canManage && /* @__PURE__ */ React52.createElement("button", { onClick: () => setIsInviteMode(true), className: "shrink-0 px-4 py-1.5 border border-stone-200 text-black text-xs tracking-wide rounded-full hover:bg-stone-50 transition-colors outline-none" }, "Invite Team")), !isInviteMode && /* @__PURE__ */ React52.createElement("p", { className: "text-xs text-stone-500" }, "Manage members and access controls across your organization.")), /* @__PURE__ */ React52.createElement("div", { className: "w-full overflow-hidden" }, isInviteMode ? /* @__PURE__ */ React52.createElement("form", { onSubmit: handleInviteSubmit, className: "flex flex-col gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ React52.createElement("div", { className: "space-y-1.5 mt-2" }, /* @__PURE__ */ React52.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Email Address"), /* @__PURE__ */ React52.createElement("input", { type: "email", value: inviteEmail, onChange: (e) => setInviteEmail(cleanEmailId(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-stone-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "name@company.com" })), /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React52.createElement(ThreeDActionButton, { type: "submit", disabled: inviteEmail.length < 5 || isInviting, isLoading: isInviting, className: "w-full" }, "Send Invitation"), /* @__PURE__ */ React52.createElement("button", { type: "button", onClick: () => {
|
|
5939
5695
|
setIsInviteMode(false);
|
|
5940
5696
|
setInviteEmail("");
|
|
5941
|
-
}, disabled: isInviting, className: "w-full flex items-center justify-center py-2.5 rounded-full border border-
|
|
5697
|
+
}, disabled: isInviting, className: "w-full flex items-center justify-center py-2.5 rounded-full border border-stone-200 text-black hover:bg-stone-50 transition-colors outline-none text-xs tracking-wide" }, "Cancel"))) : isMembersLoading || isTyping ? /* @__PURE__ */ React52.createElement(PageSpinner8, null) : /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col min-w-0 animate-in fade-in duration-300" }, /* @__PURE__ */ React52.createElement("div", null, members.length === 0 ? /* @__PURE__ */ React52.createElement("p", { className: "text-xs text-stone-400 py-6 text-center" }, "No members found") : members.map((member) => /* @__PURE__ */ React52.createElement("div", { key: member.id, onClick: () => setExpandedId(member.id), className: "flex items-center justify-between py-3 hover:bg-stone-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl" }, /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React52.createElement(MemberAvatar3, { src: member.avatarUrl, status: member.status }), /* @__PURE__ */ React52.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5" }, /* @__PURE__ */ React52.createElement("p", { className: "text-sm text-black truncate" }, member.fullName), /* @__PURE__ */ React52.createElement("p", { className: "text-xs text-stone-500 capitalize truncate" }, member.role.toLowerCase())))))), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ React52.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em]" }, "Page ", membersCurrentPage, " of ", membersTotalPages === 0 ? 1 : membersTotalPages), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React52.createElement("button", { onClick: () => onMembersPageChange(membersCurrentPage - 1), disabled: membersCurrentPage <= 1 || isMembersLoading, className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none" }, /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: ArrowLeft01Icon18, size: 14 })), /* @__PURE__ */ React52.createElement("button", { onClick: () => onMembersPageChange(membersCurrentPage + 1), disabled: membersCurrentPage >= membersTotalPages || isMembersLoading || membersTotalPages === 0, className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none" }, /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: ArrowRight01Icon14, size: 14 })))))))), /* @__PURE__ */ React52.createElement(ReusableOptions, { isOpen: isStatusModalOpen, onClose: () => setIsStatusModalOpen(false), title: "Status Filter", options: ["ALL", "ACTIVE", "BUSY", "OFFLINE", "AWAY"], selectedOption: activeStatusFilter, onSelect: (status) => onStatusFilterChange(status) }), /* @__PURE__ */ React52.createElement(ReusableOptions, { isOpen: isRoleModalOpen, onClose: () => setIsRoleModalOpen(false), title: "Role Filter", options: ["ALL", "ADMIN", "MANAGER", "MEMBER", "GUEST"], selectedOption: activeRoleFilter, onSelect: (role) => onRoleFilterChange(role) }), /* @__PURE__ */ React52.createElement(ReusableOptions, { isOpen: !!roleEditTarget, onClose: () => setRoleEditTarget(null), title: "Modify Access Role", options: ["ADMIN", "MANAGER", "MEMBER"], selectedOption: roleEditTarget?.role || "", onSelect: handleRoleUpdate })), activeTab === "ORGANIZATION" && isOrg && /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col gap-8 animate-in rounded-2xl p-6 bg-white fade-in duration-300" }, /* @__PURE__ */ React52.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ React52.createElement("div", null, /* @__PURE__ */ React52.createElement("h2", { className: "text-black text-xl mb-1 tracking-tight" }, "Workspace Details"), /* @__PURE__ */ React52.createElement("p", { className: "text-xs text-stone-500" }, "Manage your organizational identity and handles.")), !canManage && /* @__PURE__ */ React52.createElement("span", { className: "p-2 w-9 h-9 bg-stone-100 text-stone-400 rounded-full shrink-0" }, /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: CircleLock02Icon3, size: 18, className: "text-current" }))), /* @__PURE__ */ React52.createElement("form", { className: "flex flex-col gap-8 w-full max-w-5xl", onSubmit: handleSaveOrganization, autoComplete: "off" }, /* @__PURE__ */ React52.createElement(TextInput, { label: "Workspace Name", value: orgName, onChange: handleOrgNameChange, disabled: !canManage || isSavingOrg, placeholder: "Acme Corporation", maxLength: 50 }), /* @__PURE__ */ React52.createElement("div", { className: "space-y-1.5 relative w-full" }, /* @__PURE__ */ React52.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Workspace Handle"), /* @__PURE__ */ React52.createElement("div", { className: "flex items-center relative w-full border-b border-stone-200 focus-within:border-black transition-all duration-300 overflow-hidden" }, /* @__PURE__ */ React52.createElement("input", { type: "text", value: orgSlug, disabled: !canManage || isSavingOrg, onChange: (e) => handleOrgSlugChange(e.target.value), spellCheck: "false", autoComplete: "off", className: "w-full pr-10 pl-0 py-3 text-sm bg-transparent text-black outline-none disabled:opacity-50 disabled:cursor-not-allowed", placeholder: "workspace-handle" }), /* @__PURE__ */ React52.createElement("div", { className: "absolute right-2 top-1/2 -translate-y-1/2" }, isCheckingSlug && /* @__PURE__ */ React52.createElement(InputSpinner3, null), !isCheckingSlug && canManage && orgSlug !== initialOrgSlug && orgSlug.length >= 3 && slugAvailable === false && /* @__PURE__ */ React52.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-red-100" }, /* @__PURE__ */ React52.createElement("svg", { className: "w-2 h-2 text-red-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ React52.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" }))), !isCheckingSlug && canManage && orgSlug !== initialOrgSlug && orgSlug.length >= 3 && slugAvailable === true && /* @__PURE__ */ React52.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-green-100" }, /* @__PURE__ */ React52.createElement("svg", { className: "w-2 h-2 text-green-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ React52.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M16.707 5.293a1 1 0 00-1.414 0L8 12.586 4.707 9.293a1 1 0 10-1.414 1.414l4 4a1 1 0 001.414 0l8-8a1 1 0 000-1.414z" })))))), /* @__PURE__ */ React52.createElement("div", { className: "pt-8 mt-2 flex items-center gap-4" }, /* @__PURE__ */ React52.createElement(ThreeDActionButton, { type: "submit", disabled: isOrgSaveDisabled, isLoading: isSavingOrg, className: "min-w-32" }, "Save Changes"), hasOrgChanges && !isSavingOrg && canManage && /* @__PURE__ */ React52.createElement("button", { type: "button", onClick: () => {
|
|
5942
5698
|
setOrgName(initialOrgName || "");
|
|
5943
5699
|
setOrgSlug(initialOrgSlug || "");
|
|
5944
|
-
}, className: "text-
|
|
5700
|
+
}, className: "text-xs tracking-widest text-stone-400 hover:text-black transition-colors outline-none" }, "Cancel")))), activeTab === "ACCOUNT" && /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in duration-300" }, /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col gap-8 rounded-2xl p-6 bg-white w-full" }, /* @__PURE__ */ React52.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ React52.createElement("div", null, /* @__PURE__ */ React52.createElement("h2", { className: "text-black text-xl mb-1 tracking-tight" }, "Personal Identity"), /* @__PURE__ */ React52.createElement("p", { className: "text-xs text-stone-500" }, "Update your system display name and contact email."))), /* @__PURE__ */ React52.createElement("form", { className: "flex flex-col gap-6 w-full max-w-5xl", onSubmit: handleSaveProfile, autoComplete: "off" }, /* @__PURE__ */ React52.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-6" }, /* @__PURE__ */ React52.createElement(TextInput, { label: "First Name", value: firstName, onChange: (v) => setFirstName(v.replace(/[^a-zA-Z\s-]/g, "").substring(0, 50)), disabled: isSavingProfile, placeholder: "First name", maxLength: 50 }), /* @__PURE__ */ React52.createElement(TextInput, { label: "Last Name", value: lastName, onChange: (v) => setLastName(v.replace(/[^a-zA-Z\s-]/g, "").substring(0, 50)), disabled: isSavingProfile, placeholder: "Last name", maxLength: 50 })), /* @__PURE__ */ React52.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ React52.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Email Address"), /* @__PURE__ */ React52.createElement("input", { type: "email", value: initialEmail, disabled: true, className: "w-full pb-3 pt-3 text-sm bg-transparent text-stone-400 border-b border-stone-200 outline-none cursor-not-allowed" })), /* @__PURE__ */ React52.createElement("div", { className: "pt-4 flex items-center gap-4" }, /* @__PURE__ */ React52.createElement(ThreeDActionButton, { type: "submit", disabled: isProfileSaveDisabled, isLoading: isSavingProfile, className: "min-w-32" }, "Update Identity")))), /* @__PURE__ */ React52.createElement("div", { className: "bg-white rounded-2xl p-6 w-full flex flex-col sm:flex-row sm:items-center justify-between gap-6 border border-stone-100" }, /* @__PURE__ */ React52.createElement("div", { className: "flex flex-col items-start max-w-sm" }, /* @__PURE__ */ React52.createElement("p", { className: "text-xs text-stone-400 tracking-[0.2em] mb-2 uppercase" }, "AI Credits Balance"), isBillingLoading ? /* @__PURE__ */ React52.createElement("div", { className: "h-8 w-32 bg-stone-100 animate-pulse rounded mt-1" }) : /* @__PURE__ */ React52.createElement("div", { className: "flex items-center gap-2 mt-1" }, /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: Coins01Icon, size: 28, className: "text-[#d97757]" }), /* @__PURE__ */ React52.createElement("span", { className: "text-3xl text-black tracking-tight" }, aiCredits)), /* @__PURE__ */ React52.createElement("p", { className: "text-xs text-stone-500 mt-4 leading-relaxed" }, "AI credits are consumed when generating intelligent summaries, transcriptions, and automated huddle insights.")), /* @__PURE__ */ React52.createElement("button", { onClick: onTopUp, className: "w-12 h-12 rounded-full border border-stone-200 flex items-center justify-center text-black hover:bg-stone-50 transition-colors outline-none shrink-0", "aria-label": "Top Up Credits" }, /* @__PURE__ */ React52.createElement(HugeiconsIcon39, { icon: PlusSignIcon3, size: 20 })))));
|
|
5945
5701
|
};
|
|
5946
5702
|
|
|
5947
5703
|
// src/components/UniversalCreateHuddle.tsx
|
|
5948
|
-
import
|
|
5704
|
+
import React53, { useState as useState39, useEffect as useEffect22, useRef as useRef15 } from "react";
|
|
5949
5705
|
import toast15 from "react-hot-toast";
|
|
5950
|
-
import { HugeiconsIcon as
|
|
5706
|
+
import { HugeiconsIcon as HugeiconsIcon40 } from "@hugeicons/react";
|
|
5951
5707
|
import {
|
|
5952
|
-
ArrowLeft01Icon as
|
|
5953
|
-
ArrowRight01Icon as
|
|
5954
|
-
Loading03Icon as
|
|
5955
|
-
Search01Icon as
|
|
5708
|
+
ArrowLeft01Icon as ArrowLeft01Icon19,
|
|
5709
|
+
ArrowRight01Icon as ArrowRight01Icon15,
|
|
5710
|
+
Loading03Icon as Loading03Icon26,
|
|
5711
|
+
Search01Icon as Search01Icon7,
|
|
5956
5712
|
Calendar01Icon as Calendar01Icon2,
|
|
5957
5713
|
Clock01Icon as Clock01Icon2,
|
|
5958
5714
|
Globe02Icon as Globe02Icon2,
|
|
@@ -5960,10 +5716,10 @@ import {
|
|
|
5960
5716
|
CircleLock02Icon as CircleLock02Icon4
|
|
5961
5717
|
} from "@hugeicons/core-free-icons";
|
|
5962
5718
|
var MemberAvatar4 = ({ src, sizeClass = "w-10 h-10" }) => {
|
|
5963
|
-
const [loaded, setLoaded] =
|
|
5964
|
-
const [error, setError] =
|
|
5719
|
+
const [loaded, setLoaded] = useState39(false);
|
|
5720
|
+
const [error, setError] = useState39(false);
|
|
5965
5721
|
const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
|
|
5966
|
-
return /* @__PURE__ */
|
|
5722
|
+
return /* @__PURE__ */ React53.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React53.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: Loading03Icon26, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ React53.createElement(
|
|
5967
5723
|
"img",
|
|
5968
5724
|
{
|
|
5969
5725
|
src: error || !src ? defaultAvatar : src,
|
|
@@ -6003,29 +5759,29 @@ var UniversalCreateHuddle = ({
|
|
|
6003
5759
|
onMembersSearchChange,
|
|
6004
5760
|
onCreateSubmit
|
|
6005
5761
|
}) => {
|
|
6006
|
-
const canManage = userRole === "ADMIN" || userRole === "MANAGER"
|
|
6007
|
-
const [huddleDate, setHuddleDate] =
|
|
5762
|
+
const canManage = userRole === "ADMIN" || userRole === "MANAGER";
|
|
5763
|
+
const [huddleDate, setHuddleDate] = useState39(() => {
|
|
6008
5764
|
const d = /* @__PURE__ */ new Date();
|
|
6009
5765
|
d.setHours(d.getHours() + 1, 0, 0, 0);
|
|
6010
5766
|
return d;
|
|
6011
5767
|
});
|
|
6012
|
-
const [title, setTitle] =
|
|
6013
|
-
const [isPrivate, setIsPrivate] =
|
|
6014
|
-
const [timezone, setTimezone] =
|
|
6015
|
-
|
|
5768
|
+
const [title, setTitle] = useState39("");
|
|
5769
|
+
const [isPrivate, setIsPrivate] = useState39(false);
|
|
5770
|
+
const [timezone, setTimezone] = useState39("UTC");
|
|
5771
|
+
useEffect22(() => {
|
|
6016
5772
|
try {
|
|
6017
5773
|
setTimezone(Intl.DateTimeFormat().resolvedOptions().timeZone);
|
|
6018
5774
|
} catch (e) {
|
|
6019
5775
|
}
|
|
6020
5776
|
}, []);
|
|
6021
|
-
const [calendarMode, setCalendarMode] =
|
|
6022
|
-
const [showTimezoneModal, setShowTimezoneModal] =
|
|
6023
|
-
const [showMembersModal, setShowMembersModal] =
|
|
6024
|
-
const [selectedParticipants, setSelectedParticipants] =
|
|
6025
|
-
const [isSubmitting, setIsSubmitting] =
|
|
6026
|
-
const [localSearchQuery, setLocalSearchQuery] =
|
|
6027
|
-
const [isTyping, setIsTyping] =
|
|
6028
|
-
const typingTimer =
|
|
5777
|
+
const [calendarMode, setCalendarMode] = useState39(null);
|
|
5778
|
+
const [showTimezoneModal, setShowTimezoneModal] = useState39(false);
|
|
5779
|
+
const [showMembersModal, setShowMembersModal] = useState39(false);
|
|
5780
|
+
const [selectedParticipants, setSelectedParticipants] = useState39(/* @__PURE__ */ new Set());
|
|
5781
|
+
const [isSubmitting, setIsSubmitting] = useState39(false);
|
|
5782
|
+
const [localSearchQuery, setLocalSearchQuery] = useState39(membersSearchQuery);
|
|
5783
|
+
const [isTyping, setIsTyping] = useState39(false);
|
|
5784
|
+
const typingTimer = useRef15(null);
|
|
6029
5785
|
const handleSearchInput = (e) => {
|
|
6030
5786
|
const val = e.target.value;
|
|
6031
5787
|
setLocalSearchQuery(val);
|
|
@@ -6063,7 +5819,7 @@ var UniversalCreateHuddle = ({
|
|
|
6063
5819
|
setIsSubmitting(false);
|
|
6064
5820
|
}
|
|
6065
5821
|
};
|
|
6066
|
-
return /* @__PURE__ */
|
|
5822
|
+
return /* @__PURE__ */ React53.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ React53.createElement(ManagedToaster, null), /* @__PURE__ */ React53.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React53.createElement("a", { href: onBackHref, className: "flex items-center gap-2 text-[#d97757] hover:text-[#d97757] transition-colors text-sm outline-none" }, /* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: ArrowLeft01Icon19, size: 16 }), " Back")), /* @__PURE__ */ React53.createElement("div", { className: "flex flex-col gap-1 mb-8 px-1" }, /* @__PURE__ */ React53.createElement("h1", { className: "text-black text-xl tracking-tight" }, "Create Huddle"), /* @__PURE__ */ React53.createElement("p", { className: "text-xs text-stone-500" }, "Schedule a new workspace huddle and manage participant access.")), /* @__PURE__ */ React53.createElement("div", { className: "flex flex-col gap-8 animate-in rounded-2xl p-6 bg-white fade-in duration-300" }, /* @__PURE__ */ React53.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSubmit, autoComplete: "off" }, !canManage && /* @__PURE__ */ React53.createElement("div", { className: "flex items-start gap-3 p-4 bg-stone-50 rounded-xl" }, /* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: CircleLock02Icon4, size: 20, className: "text-stone-500 shrink-0 mt-0.5" }), /* @__PURE__ */ React53.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React53.createElement("span", { className: "text-sm text-black tracking-tight" }, "Access Restricted"), /* @__PURE__ */ React53.createElement("span", { className: "text-xs text-stone-500 mt-1 leading-relaxed" }, "You do not have sufficient permissions to access this page. Contact organization admin or manager."))), /* @__PURE__ */ React53.createElement(
|
|
6067
5823
|
TextInput,
|
|
6068
5824
|
{
|
|
6069
5825
|
label: "Huddle Subject",
|
|
@@ -6073,49 +5829,49 @@ var UniversalCreateHuddle = ({
|
|
|
6073
5829
|
placeholder: "e.g. Q4 Engineering Sync",
|
|
6074
5830
|
maxLength: 80
|
|
6075
5831
|
}
|
|
6076
|
-
), /* @__PURE__ */
|
|
5832
|
+
), /* @__PURE__ */ React53.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-3 gap-6" }, /* @__PURE__ */ React53.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ React53.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Date"), /* @__PURE__ */ React53.createElement(
|
|
6077
5833
|
"div",
|
|
6078
5834
|
{
|
|
6079
5835
|
onClick: () => canManage && !isSubmitting && setCalendarMode("DATE"),
|
|
6080
|
-
className: `flex items-center relative w-full border-b border-
|
|
5836
|
+
className: `flex items-center relative w-full border-b border-stone-200 transition-all duration-300 pb-3 pt-3 ${!canManage || isSubmitting ? "opacity-50 pointer-events-none" : "hover:border-black cursor-pointer"}`
|
|
6081
5837
|
},
|
|
6082
|
-
/* @__PURE__ */
|
|
6083
|
-
/* @__PURE__ */
|
|
6084
|
-
)), /* @__PURE__ */
|
|
5838
|
+
/* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: Calendar01Icon2, size: 16, className: "text-stone-400 absolute left-0" }),
|
|
5839
|
+
/* @__PURE__ */ React53.createElement("span", { className: "w-full pl-8 text-sm text-black truncate block" }, huddleDate.toLocaleDateString("en-GB", { day: "2-digit", month: "short", year: "numeric" }))
|
|
5840
|
+
)), /* @__PURE__ */ React53.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ React53.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Time"), /* @__PURE__ */ React53.createElement(
|
|
6085
5841
|
"div",
|
|
6086
5842
|
{
|
|
6087
5843
|
onClick: () => canManage && !isSubmitting && setCalendarMode("TIME"),
|
|
6088
|
-
className: `flex items-center relative w-full border-b border-
|
|
5844
|
+
className: `flex items-center relative w-full border-b border-stone-200 transition-all duration-300 pb-3 pt-3 ${!canManage || isSubmitting ? "opacity-50 pointer-events-none" : "hover:border-black cursor-pointer"}`
|
|
6089
5845
|
},
|
|
6090
|
-
/* @__PURE__ */
|
|
6091
|
-
/* @__PURE__ */
|
|
6092
|
-
)), /* @__PURE__ */
|
|
5846
|
+
/* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: Clock01Icon2, size: 16, className: "text-stone-400 absolute left-0" }),
|
|
5847
|
+
/* @__PURE__ */ React53.createElement("span", { className: "w-full pl-8 text-sm text-black truncate block" }, huddleDate.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }))
|
|
5848
|
+
)), /* @__PURE__ */ React53.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ React53.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Timezone"), /* @__PURE__ */ React53.createElement(
|
|
6093
5849
|
"div",
|
|
6094
5850
|
{
|
|
6095
5851
|
onClick: () => canManage && !isSubmitting && setShowTimezoneModal(true),
|
|
6096
|
-
className: `flex items-center relative w-full border-b border-
|
|
5852
|
+
className: `flex items-center relative w-full border-b border-stone-200 transition-all duration-300 pb-3 pt-3 ${!canManage || isSubmitting ? "opacity-50 pointer-events-none" : "hover:border-black cursor-pointer"}`
|
|
6097
5853
|
},
|
|
6098
|
-
/* @__PURE__ */
|
|
6099
|
-
/* @__PURE__ */
|
|
6100
|
-
))), /* @__PURE__ */
|
|
5854
|
+
/* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: Globe02Icon2, size: 16, className: "text-stone-400 absolute left-0" }),
|
|
5855
|
+
/* @__PURE__ */ React53.createElement("span", { className: "w-full pl-8 text-sm text-black truncate block" }, timezone)
|
|
5856
|
+
))), /* @__PURE__ */ React53.createElement("div", { className: `flex items-center justify-between py-2 mt-2 ${!canManage ? "opacity-50 pointer-events-none" : ""}` }, /* @__PURE__ */ React53.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React53.createElement("span", { className: "text-sm text-black tracking-tight" }, "Private Huddle"), /* @__PURE__ */ React53.createElement("span", { className: "text-xs text-stone-500" }, "Only invited members can join.")), /* @__PURE__ */ React53.createElement(
|
|
6101
5857
|
"button",
|
|
6102
5858
|
{
|
|
6103
5859
|
type: "button",
|
|
6104
5860
|
onClick: () => setIsPrivate(!isPrivate),
|
|
6105
5861
|
disabled: !canManage || isSubmitting,
|
|
6106
|
-
className: `relative w-11 h-6 rounded-full transition-colors outline-none shrink-0 ${isPrivate ? "bg-[#
|
|
5862
|
+
className: `relative w-11 h-6 rounded-full transition-colors outline-none shrink-0 ${isPrivate ? "bg-[#d97757]" : "bg-stone-200"}`
|
|
6107
5863
|
},
|
|
6108
|
-
/* @__PURE__ */
|
|
6109
|
-
)), isPrivate && /* @__PURE__ */
|
|
5864
|
+
/* @__PURE__ */ React53.createElement("div", { className: `absolute top-1 left-1 bg-white w-4 h-4 rounded-full transition-transform ${isPrivate ? "translate-x-5" : "translate-x-0"}` })
|
|
5865
|
+
)), isPrivate && /* @__PURE__ */ React53.createElement("div", { className: `flex items-center justify-between animate-in fade-in zoom-in-95 duration-200 bg-stone-50 p-4 rounded-xl ${!canManage ? "opacity-50" : ""}` }, /* @__PURE__ */ React53.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React53.createElement("span", { className: "text-xs text-black tracking-tight" }, "Participants"), /* @__PURE__ */ React53.createElement("span", { className: "text-xs text-[#d97757] " }, selectedParticipants.size === 0 ? "0 added" : selectedParticipants.size >= 1e3 ? `${(selectedParticipants.size / 1e3).toFixed(1)}k+ added` : `${selectedParticipants.size} added`)), /* @__PURE__ */ React53.createElement(
|
|
6110
5866
|
"button",
|
|
6111
5867
|
{
|
|
6112
5868
|
type: "button",
|
|
6113
5869
|
onClick: () => setShowMembersModal(true),
|
|
6114
5870
|
disabled: !canManage || isSubmitting,
|
|
6115
|
-
className: "px-4 py-2 border border-
|
|
5871
|
+
className: "px-4 py-2 border border-stone-200 text-black text-xs tracking-wide rounded-full hover:bg-white transition-colors outline-none bg-transparent disabled:cursor-not-allowed"
|
|
6116
5872
|
},
|
|
6117
5873
|
"Manage Access"
|
|
6118
|
-
)), canManage && /* @__PURE__ */
|
|
5874
|
+
)), canManage && /* @__PURE__ */ React53.createElement("div", { className: "pt-6" }, /* @__PURE__ */ React53.createElement(
|
|
6119
5875
|
ThreeDActionButton,
|
|
6120
5876
|
{
|
|
6121
5877
|
type: "submit",
|
|
@@ -6124,7 +5880,7 @@ var UniversalCreateHuddle = ({
|
|
|
6124
5880
|
className: "w-full sm:w-auto min-w-40"
|
|
6125
5881
|
},
|
|
6126
5882
|
"Schedule Huddle"
|
|
6127
|
-
)))), canManage && /* @__PURE__ */
|
|
5883
|
+
)))), canManage && /* @__PURE__ */ React53.createElement(React53.Fragment, null, /* @__PURE__ */ React53.createElement(
|
|
6128
5884
|
CalendarPicker,
|
|
6129
5885
|
{
|
|
6130
5886
|
isOpen: calendarMode !== null,
|
|
@@ -6133,7 +5889,7 @@ var UniversalCreateHuddle = ({
|
|
|
6133
5889
|
defaultMode: calendarMode || "DATE",
|
|
6134
5890
|
onConfirm: (d) => setHuddleDate(d)
|
|
6135
5891
|
}
|
|
6136
|
-
), /* @__PURE__ */
|
|
5892
|
+
), /* @__PURE__ */ React53.createElement(
|
|
6137
5893
|
ReusableOptions,
|
|
6138
5894
|
{
|
|
6139
5895
|
isOpen: showTimezoneModal,
|
|
@@ -6144,43 +5900,43 @@ var UniversalCreateHuddle = ({
|
|
|
6144
5900
|
onSelect: (tz) => setTimezone(tz),
|
|
6145
5901
|
showSearch: true
|
|
6146
5902
|
}
|
|
6147
|
-
)), showMembersModal && canManage && /* @__PURE__ */
|
|
5903
|
+
)), showMembersModal && canManage && /* @__PURE__ */ React53.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React53.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowMembersModal(false) }), /* @__PURE__ */ React53.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 h-[80vh]" }, /* @__PURE__ */ React53.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React53.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Select Participants"), /* @__PURE__ */ React53.createElement("button", { onClick: () => setShowMembersModal(false), className: "text-[#d97757] hover:text-[#d97757] transition-colors outline-none text-sm " }, "Done")), /* @__PURE__ */ React53.createElement("div", { className: "p-4 shrink-0 " }, /* @__PURE__ */ React53.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React53.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: Search01Icon7, size: 16, className: "text-stone-400" })), /* @__PURE__ */ React53.createElement(
|
|
6148
5904
|
"input",
|
|
6149
5905
|
{
|
|
6150
5906
|
type: "text",
|
|
6151
5907
|
placeholder: "Search team...",
|
|
6152
5908
|
value: localSearchQuery,
|
|
6153
5909
|
onChange: handleSearchInput,
|
|
6154
|
-
className: "w-full pl-10 pr-4 py-2.5 bg-
|
|
5910
|
+
className: "w-full pl-10 pr-4 py-2.5 bg-stone-100 rounded-full text-sm text-black placeholder-stone-400 outline-none focus:bg-stone-200 transition-colors"
|
|
6155
5911
|
}
|
|
6156
|
-
))), /* @__PURE__ */
|
|
5912
|
+
))), /* @__PURE__ */ React53.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2 relative" }, isMembersLoading || isTyping ? /* @__PURE__ */ React53.createElement("div", { className: "absolute inset-0 flex items-center justify-center" }, /* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: Loading03Icon26, size: 28, className: "animate-spin text-black" })) : members.length === 0 ? /* @__PURE__ */ React53.createElement("div", { className: "p-8 text-center text-xs text-stone-400" }, "No members found.") : members.map((member) => {
|
|
6157
5913
|
const isChecked = selectedParticipants.has(member.userId);
|
|
6158
|
-
return /* @__PURE__ */
|
|
5914
|
+
return /* @__PURE__ */ React53.createElement(
|
|
6159
5915
|
"div",
|
|
6160
5916
|
{
|
|
6161
5917
|
key: member.id,
|
|
6162
5918
|
onClick: () => toggleParticipant(member.userId),
|
|
6163
|
-
className: "flex items-center justify-between p-3 rounded-xl cursor-pointer hover:bg-
|
|
5919
|
+
className: "flex items-center justify-between p-3 rounded-xl cursor-pointer hover:bg-stone-50 transition-colors select-none"
|
|
6164
5920
|
},
|
|
6165
|
-
/* @__PURE__ */
|
|
6166
|
-
/* @__PURE__ */
|
|
5921
|
+
/* @__PURE__ */ React53.createElement("div", { className: "flex items-center gap-3 min-w-0 flex-1" }, /* @__PURE__ */ React53.createElement(MemberAvatar4, { src: member.avatarUrl, sizeClass: "w-9 h-9" }), /* @__PURE__ */ React53.createElement("div", { className: "flex flex-col min-w-0 flex-1" }, /* @__PURE__ */ React53.createElement("span", { className: "text-sm text-black truncate" }, member.fullName), /* @__PURE__ */ React53.createElement("span", { className: "text-xs text-stone-400 capitalize truncate" }, member.role.toLowerCase()))),
|
|
5922
|
+
/* @__PURE__ */ React53.createElement("div", { className: "shrink-0 pl-3" }, /* @__PURE__ */ React53.createElement("div", { className: `w-5 h-5 rounded-full flex items-center justify-center transition-colors ${isChecked ? "bg-[#d97757]" : "border border-stone-300 bg-white"}` }, isChecked && /* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: Tick02Icon3, size: 14, className: "text-white" })))
|
|
6167
5923
|
);
|
|
6168
|
-
})), /* @__PURE__ */
|
|
5924
|
+
})), /* @__PURE__ */ React53.createElement("div", { className: "p-4 flex items-center justify-between shrink-0 bg-white" }, /* @__PURE__ */ React53.createElement("span", { className: "text-xs text-stone-400 tracking-widest" }, "Page ", membersCurrentPage, " of ", membersTotalPages === 0 ? 1 : membersTotalPages), /* @__PURE__ */ React53.createElement("div", { className: "flex gap-1" }, /* @__PURE__ */ React53.createElement(
|
|
6169
5925
|
"button",
|
|
6170
5926
|
{
|
|
6171
5927
|
disabled: membersCurrentPage <= 1 || isMembersLoading,
|
|
6172
5928
|
onClick: () => onMembersPageChange(membersCurrentPage - 1),
|
|
6173
|
-
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-
|
|
5929
|
+
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors"
|
|
6174
5930
|
},
|
|
6175
|
-
/* @__PURE__ */
|
|
6176
|
-
), /* @__PURE__ */
|
|
5931
|
+
/* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: ArrowLeft01Icon19, size: 12 })
|
|
5932
|
+
), /* @__PURE__ */ React53.createElement(
|
|
6177
5933
|
"button",
|
|
6178
5934
|
{
|
|
6179
5935
|
disabled: membersCurrentPage >= membersTotalPages || membersTotalPages === 0 || isMembersLoading,
|
|
6180
5936
|
onClick: () => onMembersPageChange(membersCurrentPage + 1),
|
|
6181
|
-
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-
|
|
5937
|
+
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors"
|
|
6182
5938
|
},
|
|
6183
|
-
/* @__PURE__ */
|
|
5939
|
+
/* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: ArrowRight01Icon15, size: 12 })
|
|
6184
5940
|
))))));
|
|
6185
5941
|
};
|
|
6186
5942
|
export {
|
|
@@ -6206,7 +5962,6 @@ export {
|
|
|
6206
5962
|
MedicalFeatureStatsBlock,
|
|
6207
5963
|
MobileNav,
|
|
6208
5964
|
NumberInput,
|
|
6209
|
-
OpenBidHome,
|
|
6210
5965
|
PageSpinner,
|
|
6211
5966
|
PinDialerBottomSheet,
|
|
6212
5967
|
PipleAuth,
|