@retinalabsllc/zairusjs 9.0.3 → 9.0.5
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 +231 -1
- package/dist/index.d.ts +231 -1
- package/dist/index.js +1621 -268
- package/dist/index.mjs +1649 -264
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -49,13 +49,23 @@ __export(index_exports, {
|
|
|
49
49
|
ManagedProjectsBlock: () => ManagedProjectsBlock,
|
|
50
50
|
ManagedToaster: () => ManagedToaster,
|
|
51
51
|
MedicalFeatureStatsBlock: () => MedicalFeatureStatsBlock,
|
|
52
|
+
MobileNav: () => MobileNav,
|
|
52
53
|
NumberInput: () => NumberInput,
|
|
53
54
|
PageSpinner: () => PageSpinner,
|
|
55
|
+
PipleAuth: () => PipleAuth,
|
|
54
56
|
PlatformFeatures: () => PlatformFeatures,
|
|
55
57
|
PortfolioHero: () => PortfolioHero,
|
|
56
58
|
TextInput: () => TextInput,
|
|
57
59
|
ThreeDActionButton: () => ThreeDActionButton,
|
|
58
60
|
ThreeDButton: () => ThreeDButton,
|
|
61
|
+
UniversalCardPage: () => UniversalCardPage,
|
|
62
|
+
UniversalErrorView: () => UniversalErrorView,
|
|
63
|
+
UniversalHomeView: () => UniversalHomeView,
|
|
64
|
+
UniversalOrganizationPage: () => UniversalOrganizationPage,
|
|
65
|
+
UniversalProfilePage: () => UniversalProfilePage,
|
|
66
|
+
UniversalProfileSettings: () => UniversalProfileSettings,
|
|
67
|
+
UniversalTransactionPage: () => UniversalTransactionPage,
|
|
68
|
+
UniversalWalletPage: () => UniversalWalletPage,
|
|
59
69
|
WaitlistDialog: () => WaitlistDialog
|
|
60
70
|
});
|
|
61
71
|
module.exports = __toCommonJS(index_exports);
|
|
@@ -353,10 +363,260 @@ var Header = ({
|
|
|
353
363
|
);
|
|
354
364
|
};
|
|
355
365
|
|
|
356
|
-
// src/components/
|
|
366
|
+
// src/components/PipleAuth.tsx
|
|
357
367
|
var import_react6 = __toESM(require("react"));
|
|
368
|
+
var import_navigation2 = require("next/navigation");
|
|
369
|
+
var import_react_hot_toast = __toESM(require("react-hot-toast"));
|
|
370
|
+
var import_react_google_recaptcha_v3 = require("react-google-recaptcha-v3");
|
|
371
|
+
var InputSpinner = () => /* @__PURE__ */ import_react6.default.createElement("svg", { className: "animate-spin h-4 w-4 text-neutral-400", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, /* @__PURE__ */ import_react6.default.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ import_react6.default.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" }));
|
|
372
|
+
function AuthFormInner({
|
|
373
|
+
companyName,
|
|
374
|
+
workspaceLabel = "Workspace",
|
|
375
|
+
termsUrl = "https://aeona.finance/terms-of-service",
|
|
376
|
+
privacyUrl = "https://aeona.finance/privacy-policy",
|
|
377
|
+
requireNames = true,
|
|
378
|
+
requireOrganization = true,
|
|
379
|
+
useRecaptcha = false,
|
|
380
|
+
defaultRedirectPath = "/app",
|
|
381
|
+
onAuthRequest,
|
|
382
|
+
onVerifyOtp
|
|
383
|
+
}) {
|
|
384
|
+
const searchParams = (0, import_navigation2.useSearchParams)();
|
|
385
|
+
const redirectUrl = searchParams.get("redirect") || defaultRedirectPath;
|
|
386
|
+
const captchaContext = useRecaptcha ? (0, import_react_google_recaptcha_v3.useGoogleReCaptcha)() : null;
|
|
387
|
+
const [mode, setMode] = (0, import_react6.useState)("LOGIN");
|
|
388
|
+
const [step, setStep] = (0, import_react6.useState)("INPUT");
|
|
389
|
+
const getInitialSignupStep = () => {
|
|
390
|
+
if (requireNames) return "NAME";
|
|
391
|
+
if (requireOrganization) return "ORGANIZATION";
|
|
392
|
+
return "EMAIL_ID";
|
|
393
|
+
};
|
|
394
|
+
const [signupStep, setSignupStep] = (0, import_react6.useState)(getInitialSignupStep());
|
|
395
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react6.useState)(false);
|
|
396
|
+
const [countdown, setCountdown] = (0, import_react6.useState)(0);
|
|
397
|
+
const [emailId, setEmailId] = (0, import_react6.useState)("");
|
|
398
|
+
const [firstName, setFirstName] = (0, import_react6.useState)("");
|
|
399
|
+
const [lastName, setLastName] = (0, import_react6.useState)("");
|
|
400
|
+
const [orgName, setOrgName] = (0, import_react6.useState)("");
|
|
401
|
+
const [agreedToTerms, setAgreedToTerms] = (0, import_react6.useState)(false);
|
|
402
|
+
const [otp, setOtp] = (0, import_react6.useState)(["", "", "", "", "", ""]);
|
|
403
|
+
const inputRefs = (0, import_react6.useRef)([]);
|
|
404
|
+
const cleanAlpha = (val) => val.replace(/[^a-zA-Z\s-]/g, "");
|
|
405
|
+
const cleanOrgName = (val) => val.replace(/[^a-zA-Z0-9\s]/g, "").substring(0, 50);
|
|
406
|
+
const cleanEmailId = (val) => val.toLowerCase().replace(/[^a-z0-9@._-]/g, "");
|
|
407
|
+
(0, import_react6.useEffect)(() => {
|
|
408
|
+
if (countdown > 0) {
|
|
409
|
+
const timer = setTimeout(() => setCountdown(countdown - 1), 1e3);
|
|
410
|
+
return () => clearTimeout(timer);
|
|
411
|
+
}
|
|
412
|
+
}, [countdown]);
|
|
413
|
+
const handleOtpChange = (index, value) => {
|
|
414
|
+
const cleanValue = value.replace(/[^0-9]/g, "");
|
|
415
|
+
if (!cleanValue && value !== "") return;
|
|
416
|
+
const newOtp = [...otp];
|
|
417
|
+
newOtp[index] = cleanValue.slice(-1);
|
|
418
|
+
setOtp(newOtp);
|
|
419
|
+
if (cleanValue && index < 5) {
|
|
420
|
+
inputRefs.current[index + 1]?.focus();
|
|
421
|
+
}
|
|
422
|
+
};
|
|
423
|
+
const handlePaste = (e) => {
|
|
424
|
+
e.preventDefault();
|
|
425
|
+
const pastedData = e.clipboardData.getData("text/plain");
|
|
426
|
+
const numbersOnly = pastedData.replace(/[^0-9]/g, "");
|
|
427
|
+
if (!numbersOnly) return;
|
|
428
|
+
const newOtp = [...otp];
|
|
429
|
+
const length = Math.min(numbersOnly.length, 6);
|
|
430
|
+
for (let i = 0; i < length; i++) {
|
|
431
|
+
newOtp[i] = numbersOnly[i];
|
|
432
|
+
}
|
|
433
|
+
setOtp(newOtp);
|
|
434
|
+
if (length < 6) {
|
|
435
|
+
inputRefs.current[length]?.focus();
|
|
436
|
+
} else {
|
|
437
|
+
inputRefs.current[5]?.focus();
|
|
438
|
+
verifyOtpCode(newOtp.join(""));
|
|
439
|
+
}
|
|
440
|
+
};
|
|
441
|
+
const handleAuthRequestSubmit = async (e) => {
|
|
442
|
+
if (e) e.preventDefault();
|
|
443
|
+
if (mode === "SIGNUP" && !agreedToTerms) {
|
|
444
|
+
import_react_hot_toast.default.error("You must agree to the Terms and Privacy Policy.");
|
|
445
|
+
return;
|
|
446
|
+
}
|
|
447
|
+
if (isSubmitting || countdown > 0) return;
|
|
448
|
+
setIsSubmitting(true);
|
|
449
|
+
try {
|
|
450
|
+
let recaptchaToken = void 0;
|
|
451
|
+
if (useRecaptcha && captchaContext?.executeRecaptcha) {
|
|
452
|
+
recaptchaToken = await captchaContext.executeRecaptcha("auth_request");
|
|
453
|
+
}
|
|
454
|
+
const res = await onAuthRequest({
|
|
455
|
+
email: emailId,
|
|
456
|
+
firstName: mode === "SIGNUP" && requireNames ? firstName : void 0,
|
|
457
|
+
lastName: mode === "SIGNUP" && requireNames ? lastName : void 0,
|
|
458
|
+
organizationName: mode === "SIGNUP" && requireOrganization ? orgName : void 0,
|
|
459
|
+
mode,
|
|
460
|
+
recaptchaToken
|
|
461
|
+
});
|
|
462
|
+
if (res.success) {
|
|
463
|
+
import_react_hot_toast.default.success("Verification code sent");
|
|
464
|
+
setStep("OTP");
|
|
465
|
+
setCountdown(60);
|
|
466
|
+
} else {
|
|
467
|
+
import_react_hot_toast.default.error(res.error || "Authentication failed.");
|
|
468
|
+
}
|
|
469
|
+
} catch {
|
|
470
|
+
import_react_hot_toast.default.error("Service unavailable. Try again later.");
|
|
471
|
+
} finally {
|
|
472
|
+
setIsSubmitting(false);
|
|
473
|
+
}
|
|
474
|
+
};
|
|
475
|
+
const verifyOtpCode = async (codeToVerify) => {
|
|
476
|
+
if (codeToVerify.length !== 6 || isSubmitting) return;
|
|
477
|
+
setIsSubmitting(true);
|
|
478
|
+
try {
|
|
479
|
+
const res = await onVerifyOtp({ email: emailId, code: codeToVerify });
|
|
480
|
+
if (res.success) {
|
|
481
|
+
window.location.href = res.redirect || redirectUrl;
|
|
482
|
+
} else {
|
|
483
|
+
import_react_hot_toast.default.error(res.error || "Invalid code.");
|
|
484
|
+
setOtp(["", "", "", "", "", ""]);
|
|
485
|
+
inputRefs.current[0]?.focus();
|
|
486
|
+
}
|
|
487
|
+
} catch {
|
|
488
|
+
import_react_hot_toast.default.error("Verification failed.");
|
|
489
|
+
} finally {
|
|
490
|
+
setIsSubmitting(false);
|
|
491
|
+
}
|
|
492
|
+
};
|
|
493
|
+
const handleNextSignupStep = () => {
|
|
494
|
+
if (signupStep === "NAME") {
|
|
495
|
+
if (requireOrganization) setSignupStep("ORGANIZATION");
|
|
496
|
+
else setSignupStep("EMAIL_ID");
|
|
497
|
+
} else if (signupStep === "ORGANIZATION") {
|
|
498
|
+
setSignupStep("EMAIL_ID");
|
|
499
|
+
}
|
|
500
|
+
};
|
|
501
|
+
const isContinueDisabled = () => {
|
|
502
|
+
if (isSubmitting) return true;
|
|
503
|
+
if (mode === "LOGIN") return emailId.length < 3;
|
|
504
|
+
if (mode === "SIGNUP") {
|
|
505
|
+
if (signupStep === "NAME") return firstName.trim() === "" || lastName.trim() === "";
|
|
506
|
+
if (signupStep === "ORGANIZATION") return orgName.trim().length < 3;
|
|
507
|
+
if (signupStep === "EMAIL_ID") return emailId.length < 3 || !agreedToTerms;
|
|
508
|
+
}
|
|
509
|
+
return false;
|
|
510
|
+
};
|
|
511
|
+
return /* @__PURE__ */ import_react6.default.createElement("div", { className: "w-full max-w-md mx-auto flex flex-col items-center gap-4 relative z-10 animate-in fade-in duration-300" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "p-8 md:p-12" }, step === "INPUT" && /* @__PURE__ */ import_react6.default.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "mb-12 text-center mt-2" }, /* @__PURE__ */ import_react6.default.createElement("h2", { className: " text-xl text-black mb-2 tracking-tight " }, mode === "LOGIN" ? `${companyName} ${workspaceLabel}` : "Create Account"), /* @__PURE__ */ import_react6.default.createElement("div", { className: "text-[13px] text-neutral-500" }, mode === "LOGIN" ? /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, "Don't have an account? ", /* @__PURE__ */ import_react6.default.createElement("button", { type: "button", onClick: () => {
|
|
512
|
+
setMode("SIGNUP");
|
|
513
|
+
setSignupStep(getInitialSignupStep());
|
|
514
|
+
}, className: "text-black transition-colors ml-1" }, "Sign up")) : /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, "Already have an account? ", /* @__PURE__ */ import_react6.default.createElement("button", { type: "button", onClick: () => setMode("LOGIN"), className: "text-black transition-colors ml-1" }, "Log in")))), /* @__PURE__ */ import_react6.default.createElement("form", { className: "space-y-6", autoComplete: "off", onSubmit: (e) => {
|
|
515
|
+
e.preventDefault();
|
|
516
|
+
if (mode === "SIGNUP" && signupStep === "NAME") handleNextSignupStep();
|
|
517
|
+
else if (mode === "SIGNUP" && signupStep === "ORGANIZATION") handleNextSignupStep();
|
|
518
|
+
else handleAuthRequestSubmit();
|
|
519
|
+
} }, mode === "SIGNUP" && signupStep === "NAME" && requireNames && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "First Name"), /* @__PURE__ */ import_react6.default.createElement(
|
|
520
|
+
"input",
|
|
521
|
+
{
|
|
522
|
+
type: "text",
|
|
523
|
+
value: firstName,
|
|
524
|
+
onChange: (e) => setFirstName(cleanAlpha(e.target.value)),
|
|
525
|
+
required: true,
|
|
526
|
+
autoFocus: true,
|
|
527
|
+
className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-100 text-black outline-none focus:border-black transition-all duration-300",
|
|
528
|
+
placeholder: "First name"
|
|
529
|
+
}
|
|
530
|
+
)), /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Last Name"), /* @__PURE__ */ import_react6.default.createElement(
|
|
531
|
+
"input",
|
|
532
|
+
{
|
|
533
|
+
type: "text",
|
|
534
|
+
value: lastName,
|
|
535
|
+
onChange: (e) => setLastName(cleanAlpha(e.target.value)),
|
|
536
|
+
required: true,
|
|
537
|
+
className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-100 text-black outline-none focus:border-black transition-all duration-300",
|
|
538
|
+
placeholder: "Last name"
|
|
539
|
+
}
|
|
540
|
+
))), mode === "SIGNUP" && signupStep === "ORGANIZATION" && requireOrganization && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Organization Name"), /* @__PURE__ */ import_react6.default.createElement(
|
|
541
|
+
"input",
|
|
542
|
+
{
|
|
543
|
+
type: "text",
|
|
544
|
+
value: orgName,
|
|
545
|
+
onChange: (e) => setOrgName(cleanOrgName(e.target.value)),
|
|
546
|
+
required: true,
|
|
547
|
+
autoFocus: true,
|
|
548
|
+
className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-100 text-black outline-none focus:border-black transition-all duration-300",
|
|
549
|
+
placeholder: "Acme Corporation"
|
|
550
|
+
}
|
|
551
|
+
))), (mode === "LOGIN" || mode === "SIGNUP" && signupStep === "EMAIL_ID") && /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react6.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Email ID"), /* @__PURE__ */ import_react6.default.createElement(
|
|
552
|
+
"input",
|
|
553
|
+
{
|
|
554
|
+
type: "email",
|
|
555
|
+
value: emailId,
|
|
556
|
+
onChange: (e) => setEmailId(cleanEmailId(e.target.value)),
|
|
557
|
+
required: true,
|
|
558
|
+
autoFocus: true,
|
|
559
|
+
className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-100 text-black outline-none focus:border-black transition-all duration-300",
|
|
560
|
+
placeholder: "name@company.com"
|
|
561
|
+
}
|
|
562
|
+
)), mode === "SIGNUP" && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex items-start gap-3 mt-4" }, /* @__PURE__ */ import_react6.default.createElement(
|
|
563
|
+
"input",
|
|
564
|
+
{
|
|
565
|
+
type: "checkbox",
|
|
566
|
+
id: "zairus-terms",
|
|
567
|
+
checked: agreedToTerms,
|
|
568
|
+
onChange: (e) => setAgreedToTerms(e.target.checked),
|
|
569
|
+
className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer",
|
|
570
|
+
required: true
|
|
571
|
+
}
|
|
572
|
+
), /* @__PURE__ */ import_react6.default.createElement("label", { htmlFor: "zairus-terms", className: "text-[11px] text-neutral-500 cursor-pointer leading-snug" }, "I agree to ", companyName, "'s ", /* @__PURE__ */ import_react6.default.createElement("a", { href: termsUrl, target: "_blank", rel: "noreferrer", className: "text-black underline " }, "Terms of Service"), " and ", /* @__PURE__ */ import_react6.default.createElement("a", { href: privacyUrl, target: "_blank", rel: "noreferrer", className: "text-black underline " }, "Privacy Policy"), "."))), /* @__PURE__ */ import_react6.default.createElement(
|
|
573
|
+
ThreeDActionButton,
|
|
574
|
+
{
|
|
575
|
+
type: "submit",
|
|
576
|
+
disabled: isContinueDisabled(),
|
|
577
|
+
isLoading: isSubmitting,
|
|
578
|
+
className: "w-full mt-10"
|
|
579
|
+
},
|
|
580
|
+
"Continue"
|
|
581
|
+
))), step === "OTP" && /* @__PURE__ */ import_react6.default.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "text-center mb-10 mt-2" }, /* @__PURE__ */ import_react6.default.createElement("h2", { className: " text-xl text-black mb-2 tracking-tight " }, "Security Check"), /* @__PURE__ */ import_react6.default.createElement("p", { className: "text-[13px] text-neutral-500" }, "Enter the code sent to ", /* @__PURE__ */ import_react6.default.createElement("br", null), /* @__PURE__ */ import_react6.default.createElement("span", { className: "text-black " }, emailId))), /* @__PURE__ */ import_react6.default.createElement("form", { className: "space-y-10", autoComplete: "off", onSubmit: (e) => {
|
|
582
|
+
e.preventDefault();
|
|
583
|
+
verifyOtpCode(otp.join(""));
|
|
584
|
+
} }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex justify-between gap-2", onPaste: handlePaste }, otp.map((digit, index) => /* @__PURE__ */ import_react6.default.createElement(
|
|
585
|
+
"input",
|
|
586
|
+
{
|
|
587
|
+
key: index,
|
|
588
|
+
ref: (el) => {
|
|
589
|
+
inputRefs.current[index] = el;
|
|
590
|
+
},
|
|
591
|
+
type: "text",
|
|
592
|
+
inputMode: "numeric",
|
|
593
|
+
maxLength: 1,
|
|
594
|
+
value: digit,
|
|
595
|
+
onChange: (e) => handleOtpChange(index, e.target.value),
|
|
596
|
+
className: "w-8 h-8 text-center text-lg bg-transparent border-b-2 border-neutral-100 text-black outline-none focus:border-black transition-all duration-300"
|
|
597
|
+
}
|
|
598
|
+
))), /* @__PURE__ */ import_react6.default.createElement(
|
|
599
|
+
ThreeDActionButton,
|
|
600
|
+
{
|
|
601
|
+
type: "submit",
|
|
602
|
+
disabled: otp.join("").length < 6,
|
|
603
|
+
isLoading: isSubmitting,
|
|
604
|
+
className: "w-full"
|
|
605
|
+
},
|
|
606
|
+
"Verify Code"
|
|
607
|
+
))))));
|
|
608
|
+
}
|
|
609
|
+
var PipleAuth = (props) => {
|
|
610
|
+
if (props.useRecaptcha && props.recaptchaSiteKey) {
|
|
611
|
+
return /* @__PURE__ */ import_react6.default.createElement(import_react_google_recaptcha_v3.GoogleReCaptchaProvider, { reCaptchaKey: props.recaptchaSiteKey }, /* @__PURE__ */ import_react6.default.createElement(import_react6.Suspense, { fallback: /* @__PURE__ */ import_react6.default.createElement("div", { className: "h-64 flex items-center justify-center" }, /* @__PURE__ */ import_react6.default.createElement(InputSpinner, null)) }, /* @__PURE__ */ import_react6.default.createElement(AuthFormInner, { ...props })));
|
|
612
|
+
}
|
|
613
|
+
return /* @__PURE__ */ import_react6.default.createElement(import_react6.Suspense, { fallback: /* @__PURE__ */ import_react6.default.createElement("div", { className: "h-64 flex items-center justify-center" }, /* @__PURE__ */ import_react6.default.createElement(InputSpinner, null)) }, /* @__PURE__ */ import_react6.default.createElement(AuthFormInner, { ...props }));
|
|
614
|
+
};
|
|
615
|
+
|
|
616
|
+
// src/components/Footer.tsx
|
|
617
|
+
var import_react7 = __toESM(require("react"));
|
|
358
618
|
var import_link3 = __toESM(require("next/link"));
|
|
359
|
-
var
|
|
619
|
+
var import_react8 = require("@hugeicons/react");
|
|
360
620
|
var Footer = ({
|
|
361
621
|
description,
|
|
362
622
|
columns,
|
|
@@ -364,20 +624,20 @@ var Footer = ({
|
|
|
364
624
|
copyrightText,
|
|
365
625
|
topSection
|
|
366
626
|
}) => {
|
|
367
|
-
const [openCol, setOpenCol] = (0,
|
|
627
|
+
const [openCol, setOpenCol] = (0, import_react7.useState)(null);
|
|
368
628
|
const toggleColumn = (idx) => {
|
|
369
629
|
setOpenCol(openCol === idx ? null : idx);
|
|
370
630
|
};
|
|
371
|
-
return /* @__PURE__ */
|
|
631
|
+
return /* @__PURE__ */ import_react7.default.createElement("div", { className: "" }, topSection && topSection, /* @__PURE__ */ import_react7.default.createElement("footer", { className: "relative px-6 overflow-hidden flex flex-col" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative w-full max-w-7xl mx-auto z-20 flex flex-col" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative py-12 md:py-16" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start gap-12 lg:gap-16 mb-12 text-left" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "w-full lg:max-w-sm flex flex-col items-start justify-between shrink-0" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex items-center gap-4 mb-4" }, /* @__PURE__ */ import_react7.default.createElement("img", { src: "https://retinalabs.company/assets/images/ndpr.avif", alt: "NDPR", className: "w-28 h-auto object-contain filter grayscale opacity-80" }), /* @__PURE__ */ import_react7.default.createElement("img", { src: "https://retinalabs.company/assets/images/gdpr.avif", alt: "GDPR", className: "w-12 h-12 object-contain filter grayscale opacity-80" })), /* @__PURE__ */ import_react7.default.createElement("div", null, /* @__PURE__ */ import_react7.default.createElement("p", { className: "text-[11px] text-neutral-600 leading-relaxed pr-4" }, description))), /* @__PURE__ */ import_react7.default.createElement("div", { className: "w-full lg:flex-1 lg:max-w-2xl" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "hidden md:grid grid-cols-2 gap-x-16 lg:gap-x-24 gap-y-12" }, columns.map((col, idx) => /* @__PURE__ */ import_react7.default.createElement("div", { key: idx, className: "flex flex-col" }, /* @__PURE__ */ import_react7.default.createElement("h4", { className: "text-[11px] tracking-[0.2em] text-black mb-6 " }, col.title), /* @__PURE__ */ import_react7.default.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500" }, col.links.map((link, lIdx) => /* @__PURE__ */ import_react7.default.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ import_react7.default.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors block truncate" }, link.label) : /* @__PURE__ */ import_react7.default.createElement(import_link3.default, { href: link.href, className: "hover:text-black transition-colors block truncate" }, link.label))))))), /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex flex-col md:hidden w-full border-t border-neutral-100 mt-4" }, columns.map((col, idx) => {
|
|
372
632
|
const isOpen = openCol === idx;
|
|
373
|
-
return /* @__PURE__ */
|
|
633
|
+
return /* @__PURE__ */ import_react7.default.createElement("div", { key: idx, className: "border-b border-neutral-100" }, /* @__PURE__ */ import_react7.default.createElement(
|
|
374
634
|
"button",
|
|
375
635
|
{
|
|
376
636
|
onClick: () => toggleColumn(idx),
|
|
377
637
|
className: "w-full flex items-center justify-between py-5 text-left outline-none"
|
|
378
638
|
},
|
|
379
|
-
/* @__PURE__ */
|
|
380
|
-
/* @__PURE__ */
|
|
639
|
+
/* @__PURE__ */ import_react7.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-black " }, col.title),
|
|
640
|
+
/* @__PURE__ */ import_react7.default.createElement(
|
|
381
641
|
"svg",
|
|
382
642
|
{
|
|
383
643
|
className: `w-4 h-4 text-neutral-400 transition-transform duration-300 ${isOpen ? "rotate-180" : ""}`,
|
|
@@ -385,10 +645,10 @@ var Footer = ({
|
|
|
385
645
|
viewBox: "0 0 24 24",
|
|
386
646
|
stroke: "currentColor"
|
|
387
647
|
},
|
|
388
|
-
/* @__PURE__ */
|
|
648
|
+
/* @__PURE__ */ import_react7.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M19 9l-7 7-7-7" })
|
|
389
649
|
)
|
|
390
|
-
), /* @__PURE__ */
|
|
391
|
-
})))), /* @__PURE__ */
|
|
650
|
+
), /* @__PURE__ */ import_react7.default.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__ */ import_react7.default.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ import_react7.default.createElement("ul", { className: "space-y-4 text-[13px] text-neutral-500 pt-2" }, col.links.map((link, lIdx) => /* @__PURE__ */ import_react7.default.createElement("li", { key: lIdx }, link.isExternal ? /* @__PURE__ */ import_react7.default.createElement("a", { href: link.href, target: "_blank", rel: "noopener noreferrer", className: "hover:text-black transition-colors" }, link.label) : /* @__PURE__ */ import_react7.default.createElement(import_link3.default, { href: link.href, className: "hover:text-black transition-colors" }, link.label)))))));
|
|
651
|
+
})))), /* @__PURE__ */ import_react7.default.createElement("div", { className: "pt-8 mt-4 flex flex-col-reverse md:flex-row justify-between items-start md:items-center gap-6 relative z-20" }, /* @__PURE__ */ import_react7.default.createElement("p", { className: "text-[11px] text-neutral-400 tracking-widest text-left" }, copyrightText), socialLinks && socialLinks.length > 0 && /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex items-center gap-6" }, socialLinks.map((social, idx) => /* @__PURE__ */ import_react7.default.createElement(
|
|
392
652
|
"a",
|
|
393
653
|
{
|
|
394
654
|
key: idx,
|
|
@@ -398,21 +658,86 @@ var Footer = ({
|
|
|
398
658
|
className: "text-neutral-400 hover:text-black transition-colors",
|
|
399
659
|
"aria-label": social.name
|
|
400
660
|
},
|
|
401
|
-
/* @__PURE__ */
|
|
661
|
+
/* @__PURE__ */ import_react7.default.createElement(import_react8.HugeiconsIcon, { icon: social.icon, size: 20 })
|
|
402
662
|
))))))));
|
|
403
663
|
};
|
|
404
664
|
|
|
405
|
-
// src/components/
|
|
406
|
-
var
|
|
665
|
+
// src/components/MobileNav.tsx
|
|
666
|
+
var import_react9 = __toESM(require("react"));
|
|
407
667
|
var import_link4 = __toESM(require("next/link"));
|
|
408
|
-
var
|
|
668
|
+
var import_navigation3 = require("next/navigation");
|
|
669
|
+
var import_react10 = require("@hugeicons/react");
|
|
670
|
+
var MobileNav = ({ items }) => {
|
|
671
|
+
const pathname = (0, import_navigation3.usePathname)();
|
|
672
|
+
if (!items || items.length === 0) return null;
|
|
673
|
+
return /* @__PURE__ */ import_react9.default.createElement("div", { className: "fixed bottom-6 inset-x-0 z-100 flex justify-center pointer-events-none px-3 animate-in slide-in-from-bottom-8 fade-in duration-500" }, /* @__PURE__ */ import_react9.default.createElement("nav", { className: "pointer-events-auto w-full max-w-sm bg-white/80 backdrop-blur-xl shadow-[0_8px_30px_rgb(0,0,0,0.08)] rounded-full px-6 py-2.5 flex items-center justify-between" }, items.map((item) => {
|
|
674
|
+
const isActive = item.href === "/" ? pathname === "/" : pathname?.startsWith(item.href);
|
|
675
|
+
return /* @__PURE__ */ import_react9.default.createElement(
|
|
676
|
+
import_link4.default,
|
|
677
|
+
{
|
|
678
|
+
key: item.label,
|
|
679
|
+
href: item.href,
|
|
680
|
+
className: "flex flex-col items-center justify-center gap-1 min-w-14 transition-transform active:scale-95 outline-none"
|
|
681
|
+
},
|
|
682
|
+
/* @__PURE__ */ import_react9.default.createElement("div", { className: `transition-colors duration-300 ${isActive ? "text-black" : "text-neutral-400 hover:text-neutral-600"}` }, /* @__PURE__ */ import_react9.default.createElement(
|
|
683
|
+
import_react10.HugeiconsIcon,
|
|
684
|
+
{
|
|
685
|
+
icon: item.icon,
|
|
686
|
+
size: 20
|
|
687
|
+
}
|
|
688
|
+
)),
|
|
689
|
+
/* @__PURE__ */ import_react9.default.createElement(
|
|
690
|
+
"span",
|
|
691
|
+
{
|
|
692
|
+
className: `text-[9px] tracking-wide transition-colors duration-300 font-medium ${isActive ? "text-black" : "text-neutral-400"}`
|
|
693
|
+
},
|
|
694
|
+
item.label
|
|
695
|
+
)
|
|
696
|
+
);
|
|
697
|
+
})));
|
|
698
|
+
};
|
|
409
699
|
|
|
410
|
-
// src/components/
|
|
411
|
-
var
|
|
412
|
-
var
|
|
700
|
+
// src/components/UniversalOrganizationPage.tsx
|
|
701
|
+
var import_react15 = __toESM(require("react"));
|
|
702
|
+
var import_react_hot_toast3 = __toESM(require("react-hot-toast"));
|
|
703
|
+
|
|
704
|
+
// src/components/ManagedToaster.tsx
|
|
705
|
+
var import_react11 = __toESM(require("react"));
|
|
706
|
+
var import_react_hot_toast2 = require("react-hot-toast");
|
|
707
|
+
var ManagedToaster = () => {
|
|
708
|
+
return /* @__PURE__ */ import_react11.default.createElement(
|
|
709
|
+
import_react_hot_toast2.Toaster,
|
|
710
|
+
{
|
|
711
|
+
position: "top-right",
|
|
712
|
+
toastOptions: {
|
|
713
|
+
style: {
|
|
714
|
+
background: "#171717",
|
|
715
|
+
color: "#fafafa",
|
|
716
|
+
fontSize: "11px",
|
|
717
|
+
padding: "8px 12px",
|
|
718
|
+
borderRadius: "8px",
|
|
719
|
+
minWidth: "fit-content",
|
|
720
|
+
boxShadow: "0 4px 6px -1px rgba(0, 0, 0, 0.5)"
|
|
721
|
+
},
|
|
722
|
+
success: {
|
|
723
|
+
iconTheme: {
|
|
724
|
+
primary: "#fafafa",
|
|
725
|
+
secondary: "#171717"
|
|
726
|
+
}
|
|
727
|
+
},
|
|
728
|
+
error: {
|
|
729
|
+
iconTheme: {
|
|
730
|
+
primary: "#fafafa",
|
|
731
|
+
secondary: "#171717"
|
|
732
|
+
}
|
|
733
|
+
}
|
|
734
|
+
}
|
|
735
|
+
}
|
|
736
|
+
);
|
|
737
|
+
};
|
|
413
738
|
|
|
414
739
|
// src/components/ReusableInputs.tsx
|
|
415
|
-
var
|
|
740
|
+
var import_react12 = __toESM(require("react"));
|
|
416
741
|
var TextInput = ({
|
|
417
742
|
label,
|
|
418
743
|
value,
|
|
@@ -423,7 +748,7 @@ var TextInput = ({
|
|
|
423
748
|
readOnly,
|
|
424
749
|
type = "text",
|
|
425
750
|
onClick
|
|
426
|
-
}) => /* @__PURE__ */
|
|
751
|
+
}) => /* @__PURE__ */ import_react12.default.createElement("div", { className: "space-y-2 flex-1 w-full", onClick }, label && /* @__PURE__ */ import_react12.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, label), /* @__PURE__ */ import_react12.default.createElement(
|
|
427
752
|
"input",
|
|
428
753
|
{
|
|
429
754
|
type,
|
|
@@ -444,7 +769,7 @@ var NumberInput = ({
|
|
|
444
769
|
placeholder,
|
|
445
770
|
maxLength,
|
|
446
771
|
disabled
|
|
447
|
-
}) => /* @__PURE__ */
|
|
772
|
+
}) => /* @__PURE__ */ import_react12.default.createElement("div", { className: "space-y-2 flex-1 w-full" }, label && /* @__PURE__ */ import_react12.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, label), /* @__PURE__ */ import_react12.default.createElement(
|
|
448
773
|
"input",
|
|
449
774
|
{
|
|
450
775
|
type: "text",
|
|
@@ -461,15 +786,1090 @@ var NumberInput = ({
|
|
|
461
786
|
}
|
|
462
787
|
));
|
|
463
788
|
|
|
789
|
+
// src/components/Banner.tsx
|
|
790
|
+
var import_react13 = __toESM(require("react"));
|
|
791
|
+
var import_react14 = require("@hugeicons/react");
|
|
792
|
+
var import_core_free_icons2 = require("@hugeicons/core-free-icons");
|
|
793
|
+
var Banner = ({
|
|
794
|
+
title,
|
|
795
|
+
message,
|
|
796
|
+
type,
|
|
797
|
+
icon,
|
|
798
|
+
isDismissible = true,
|
|
799
|
+
onDismiss,
|
|
800
|
+
action
|
|
801
|
+
}) => {
|
|
802
|
+
const [isVisible, setIsVisible] = (0, import_react13.useState)(true);
|
|
803
|
+
if (!isVisible) return null;
|
|
804
|
+
const handleDismiss = () => {
|
|
805
|
+
setIsVisible(false);
|
|
806
|
+
if (onDismiss) onDismiss();
|
|
807
|
+
};
|
|
808
|
+
const config = {
|
|
809
|
+
success: {
|
|
810
|
+
bg: "bg-emerald-50",
|
|
811
|
+
iconColor: "text-emerald-600",
|
|
812
|
+
titleColor: "text-emerald-900",
|
|
813
|
+
msgColor: "text-emerald-700",
|
|
814
|
+
defaultIcon: import_core_free_icons2.CheckmarkBadge01Icon,
|
|
815
|
+
closeHover: "hover:bg-emerald-100 text-emerald-500"
|
|
816
|
+
},
|
|
817
|
+
warning: {
|
|
818
|
+
bg: "bg-amber-50",
|
|
819
|
+
iconColor: "text-amber-600",
|
|
820
|
+
titleColor: "text-amber-900",
|
|
821
|
+
msgColor: "text-amber-700",
|
|
822
|
+
defaultIcon: import_core_free_icons2.InformationCircleIcon,
|
|
823
|
+
closeHover: "hover:bg-amber-100 text-amber-500"
|
|
824
|
+
},
|
|
825
|
+
alert: {
|
|
826
|
+
bg: "bg-red-50",
|
|
827
|
+
iconColor: "text-red-600",
|
|
828
|
+
titleColor: "text-red-900",
|
|
829
|
+
msgColor: "text-red-700",
|
|
830
|
+
defaultIcon: import_core_free_icons2.Alert02Icon,
|
|
831
|
+
closeHover: "hover:bg-red-100 text-red-500"
|
|
832
|
+
}
|
|
833
|
+
};
|
|
834
|
+
const currentConfig = config[type];
|
|
835
|
+
const IconToUse = icon || currentConfig.defaultIcon;
|
|
836
|
+
return /* @__PURE__ */ import_react13.default.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__ */ import_react13.default.createElement("div", { className: "flex-1 flex flex-col min-w-0" }, /* @__PURE__ */ import_react13.default.createElement("h4", { className: `text-sm tracking-tight mb-1 ${currentConfig.titleColor}` }, title), /* @__PURE__ */ import_react13.default.createElement("p", { className: `text-xs leading-relaxed ${currentConfig.msgColor}` }, message), action && /* @__PURE__ */ import_react13.default.createElement("div", { className: "mt-3" }, action)), isDismissible && /* @__PURE__ */ import_react13.default.createElement(
|
|
837
|
+
"button",
|
|
838
|
+
{
|
|
839
|
+
onClick: handleDismiss,
|
|
840
|
+
className: `absolute top-3 right-3 p-1.5 rounded-full transition-colors outline-none shrink-0 ${currentConfig.closeHover}`,
|
|
841
|
+
"aria-label": "Dismiss banner"
|
|
842
|
+
},
|
|
843
|
+
/* @__PURE__ */ import_react13.default.createElement(import_react14.HugeiconsIcon, { icon: import_core_free_icons2.Cancel01Icon, size: 16 })
|
|
844
|
+
));
|
|
845
|
+
};
|
|
846
|
+
|
|
847
|
+
// src/components/UniversalOrganizationPage.tsx
|
|
848
|
+
var import_react16 = require("@hugeicons/react");
|
|
849
|
+
var import_core_free_icons3 = require("@hugeicons/core-free-icons");
|
|
850
|
+
var InputSpinner2 = () => /* @__PURE__ */ import_react15.default.createElement("svg", { className: "animate-spin h-4 w-4 text-neutral-400", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, /* @__PURE__ */ import_react15.default.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ import_react15.default.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" }));
|
|
851
|
+
var UniversalOrganizationPage = ({
|
|
852
|
+
initialOrgName,
|
|
853
|
+
initialSlug,
|
|
854
|
+
initialUsername,
|
|
855
|
+
orgId,
|
|
856
|
+
isReadOnly = false,
|
|
857
|
+
slugPrefixUrl = ".aeona.eth",
|
|
858
|
+
bannerProps,
|
|
859
|
+
onSaveConfiguration,
|
|
860
|
+
onCheckSlugAvailability
|
|
861
|
+
}) => {
|
|
862
|
+
const resolvedInitialUsername = initialUsername || initialSlug;
|
|
863
|
+
const [web3Name, setWeb3Name] = (0, import_react15.useState)(initialOrgName);
|
|
864
|
+
const [username, setUsername] = (0, import_react15.useState)(resolvedInitialUsername);
|
|
865
|
+
const [slug, setSlug] = (0, import_react15.useState)(initialSlug);
|
|
866
|
+
const [isCheckingSlug, setIsCheckingSlug] = (0, import_react15.useState)(false);
|
|
867
|
+
const [slugAvailable, setSlugAvailable] = (0, import_react15.useState)(null);
|
|
868
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react15.useState)(false);
|
|
869
|
+
(0, import_react15.useEffect)(() => {
|
|
870
|
+
setWeb3Name(initialOrgName || "");
|
|
871
|
+
setSlug(initialSlug || "");
|
|
872
|
+
setUsername(initialUsername || initialSlug || "");
|
|
873
|
+
}, [initialOrgName, initialSlug, initialUsername]);
|
|
874
|
+
const handleWeb3NameChange = (val) => {
|
|
875
|
+
setWeb3Name(val.replace(/[^a-zA-Z0-9\s-]/g, "").substring(0, 50));
|
|
876
|
+
};
|
|
877
|
+
const handleUsernameChange = (val) => {
|
|
878
|
+
setUsername(val.toLowerCase().replace(/[^a-z0-9-]/g, "").substring(0, 30));
|
|
879
|
+
};
|
|
880
|
+
const handleSlugChange = (val) => {
|
|
881
|
+
setSlug(val.toLowerCase().replace(/[^a-z0-9-]/g, "").replace(/-+/g, "-").substring(0, 50));
|
|
882
|
+
};
|
|
883
|
+
(0, import_react15.useEffect)(() => {
|
|
884
|
+
if (!slug || slug === initialSlug) {
|
|
885
|
+
setSlugAvailable(null);
|
|
886
|
+
setIsCheckingSlug(false);
|
|
887
|
+
return;
|
|
888
|
+
}
|
|
889
|
+
if (slug.length < 3) {
|
|
890
|
+
setSlugAvailable(false);
|
|
891
|
+
setIsCheckingSlug(false);
|
|
892
|
+
return;
|
|
893
|
+
}
|
|
894
|
+
setIsCheckingSlug(true);
|
|
895
|
+
setSlugAvailable(null);
|
|
896
|
+
const checkTimer = setTimeout(async () => {
|
|
897
|
+
try {
|
|
898
|
+
const res = await onCheckSlugAvailability(slug);
|
|
899
|
+
setSlugAvailable(res.available);
|
|
900
|
+
} catch (error) {
|
|
901
|
+
setSlugAvailable(null);
|
|
902
|
+
} finally {
|
|
903
|
+
setIsCheckingSlug(false);
|
|
904
|
+
}
|
|
905
|
+
}, 1500);
|
|
906
|
+
return () => clearTimeout(checkTimer);
|
|
907
|
+
}, [slug, initialSlug, onCheckSlugAvailability]);
|
|
908
|
+
const handleSave = async (e) => {
|
|
909
|
+
e.preventDefault();
|
|
910
|
+
if (isSubmitting || isCheckingSlug || isReadOnly) return;
|
|
911
|
+
if (slug !== initialSlug && slugAvailable === false) {
|
|
912
|
+
import_react_hot_toast3.default.error("Please select an available profile address handles.");
|
|
913
|
+
return;
|
|
914
|
+
}
|
|
915
|
+
setIsSubmitting(true);
|
|
916
|
+
try {
|
|
917
|
+
const payload = {
|
|
918
|
+
organizationId: orgId,
|
|
919
|
+
organizationName: web3Name !== initialOrgName ? web3Name : void 0,
|
|
920
|
+
slug: slug !== initialSlug ? slug : void 0,
|
|
921
|
+
username: username !== resolvedInitialUsername ? username : void 0
|
|
922
|
+
};
|
|
923
|
+
const responseData = await onSaveConfiguration(payload);
|
|
924
|
+
if (responseData.success) {
|
|
925
|
+
import_react_hot_toast3.default.success("Web3 profile identity updated successfully.");
|
|
926
|
+
setTimeout(() => window.location.reload(), 1e3);
|
|
927
|
+
} else {
|
|
928
|
+
import_react_hot_toast3.default.error(responseData.error || "Failed to update your identity profile.");
|
|
929
|
+
setIsSubmitting(false);
|
|
930
|
+
}
|
|
931
|
+
} catch (error) {
|
|
932
|
+
import_react_hot_toast3.default.error("Service unavailable. Try again later.");
|
|
933
|
+
setIsSubmitting(false);
|
|
934
|
+
}
|
|
935
|
+
};
|
|
936
|
+
const hasChanges = web3Name !== initialOrgName || slug !== initialSlug || username !== resolvedInitialUsername;
|
|
937
|
+
const isSaveDisabled = isSubmitting || isReadOnly || isCheckingSlug || !hasChanges || web3Name.length < 3 || slug.length < 3 || username.length < 3 || slug !== initialSlug && slugAvailable === false;
|
|
938
|
+
return /* @__PURE__ */ import_react15.default.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-5xl rounded-2xl p-6 bg-white fade-in duration-300" }, /* @__PURE__ */ import_react15.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react15.default.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, "Public Profile"), /* @__PURE__ */ import_react15.default.createElement("p", { className: "text-xs text-neutral-500" }, "Manage your financial payment handle identifiers and global public cryptographic signature identity details.")), isReadOnly && /* @__PURE__ */ import_react15.default.createElement("span", { className: "p-2 w-9 h-9 bg-neutral-100 text-neutral-400 rounded-full shrink-0" }, /* @__PURE__ */ import_react15.default.createElement(import_react16.HugeiconsIcon, { icon: import_core_free_icons3.CircleLock02Icon, size: 18, className: "text-current" }))), bannerProps && /* @__PURE__ */ import_react15.default.createElement(Banner, { ...bannerProps }), /* @__PURE__ */ import_react15.default.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ import_react15.default.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ import_react15.default.createElement(
|
|
939
|
+
TextInput,
|
|
940
|
+
{
|
|
941
|
+
label: "Display Name",
|
|
942
|
+
value: web3Name,
|
|
943
|
+
onChange: handleWeb3NameChange,
|
|
944
|
+
disabled: isReadOnly || isSubmitting,
|
|
945
|
+
placeholder: "Sovereign User",
|
|
946
|
+
maxLength: 50
|
|
947
|
+
}
|
|
948
|
+
), /* @__PURE__ */ import_react15.default.createElement(
|
|
949
|
+
TextInput,
|
|
950
|
+
{
|
|
951
|
+
label: "Digital Identity",
|
|
952
|
+
value: username,
|
|
953
|
+
onChange: handleUsernameChange,
|
|
954
|
+
disabled: isReadOnly || isSubmitting,
|
|
955
|
+
placeholder: "sovereignuser",
|
|
956
|
+
maxLength: 30
|
|
957
|
+
}
|
|
958
|
+
), /* @__PURE__ */ import_react15.default.createElement("div", { className: "space-y-1.5 relative w-full" }, /* @__PURE__ */ import_react15.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block" }, "Wallet Username"), /* @__PURE__ */ import_react15.default.createElement("div", { className: "flex items-center relative w-full border-b border-neutral-100 focus-within:border-black transition-all duration-300" }, /* @__PURE__ */ import_react15.default.createElement(
|
|
959
|
+
"input",
|
|
960
|
+
{
|
|
961
|
+
type: "text",
|
|
962
|
+
value: slug,
|
|
963
|
+
disabled: isReadOnly || isSubmitting,
|
|
964
|
+
onChange: (e) => handleSlugChange(e.target.value),
|
|
965
|
+
spellCheck: "false",
|
|
966
|
+
autoComplete: "off",
|
|
967
|
+
className: "w-full px-2 py-3 text-sm bg-transparent text-black outline-none disabled:opacity-50 disabled:cursor-not-allowed",
|
|
968
|
+
placeholder: "sovereign-user-handle"
|
|
969
|
+
}
|
|
970
|
+
), /* @__PURE__ */ import_react15.default.createElement("span", { className: "text-neutral-400 text-sm py-3 pr-8 shrink-0 whitespace-nowrap" }, slugPrefixUrl), /* @__PURE__ */ import_react15.default.createElement("div", { className: "absolute right-2 top-1/2 -translate-y-1/2" }, isCheckingSlug && /* @__PURE__ */ import_react15.default.createElement(InputSpinner2, null), !isCheckingSlug && !isReadOnly && slug !== initialSlug && slug.length >= 3 && slugAvailable === false && /* @__PURE__ */ import_react15.default.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-red-100" }, /* @__PURE__ */ import_react15.default.createElement("svg", { className: "w-2 h-2 text-red-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-green-100" }, /* @__PURE__ */ import_react15.default.createElement("svg", { className: "w-2 h-2 text-green-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ import_react15.default.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__ */ import_react15.default.createElement("div", { className: "pt-8 mt-2 flex items-center gap-4" }, /* @__PURE__ */ import_react15.default.createElement(
|
|
971
|
+
ThreeDActionButton,
|
|
972
|
+
{
|
|
973
|
+
type: "submit",
|
|
974
|
+
disabled: isSaveDisabled,
|
|
975
|
+
isLoading: isSubmitting,
|
|
976
|
+
className: "min-w-32"
|
|
977
|
+
},
|
|
978
|
+
"Save Changes"
|
|
979
|
+
), hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */ import_react15.default.createElement(
|
|
980
|
+
"button",
|
|
981
|
+
{
|
|
982
|
+
type: "button",
|
|
983
|
+
onClick: () => {
|
|
984
|
+
setWeb3Name(initialOrgName);
|
|
985
|
+
setSlug(initialSlug);
|
|
986
|
+
setUsername(resolvedInitialUsername);
|
|
987
|
+
},
|
|
988
|
+
className: "text-[11px] tracking-widest text-neutral-400 hover:text-black transition-colors outline-none"
|
|
989
|
+
},
|
|
990
|
+
"Cancel"
|
|
991
|
+
)))));
|
|
992
|
+
};
|
|
993
|
+
|
|
994
|
+
// src/components/UniversalProfileSettings.tsx
|
|
995
|
+
var import_react17 = __toESM(require("react"));
|
|
996
|
+
var import_react_hot_toast4 = __toESM(require("react-hot-toast"));
|
|
997
|
+
var import_react18 = require("@hugeicons/react");
|
|
998
|
+
var import_core_free_icons4 = require("@hugeicons/core-free-icons");
|
|
999
|
+
var UniversalProfileSettings = ({
|
|
1000
|
+
initialFirstName,
|
|
1001
|
+
initialLastName,
|
|
1002
|
+
email,
|
|
1003
|
+
accountStatus = "GOOD",
|
|
1004
|
+
memberSince,
|
|
1005
|
+
isReadOnly = false,
|
|
1006
|
+
bannerProps,
|
|
1007
|
+
hasPin = false,
|
|
1008
|
+
isPinLoading = false,
|
|
1009
|
+
onSavePin,
|
|
1010
|
+
onSaveProfile
|
|
1011
|
+
}) => {
|
|
1012
|
+
const [firstName, setFirstName] = (0, import_react17.useState)(initialFirstName);
|
|
1013
|
+
const [lastName, setLastName] = (0, import_react17.useState)(initialLastName);
|
|
1014
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react17.useState)(false);
|
|
1015
|
+
const [isPinModalOpen, setIsPinModalOpen] = (0, import_react17.useState)(false);
|
|
1016
|
+
const [oldPin, setOldPin] = (0, import_react17.useState)("");
|
|
1017
|
+
const [newPin, setNewPin] = (0, import_react17.useState)("");
|
|
1018
|
+
const [confirmPin, setConfirmPin] = (0, import_react17.useState)("");
|
|
1019
|
+
const [isPinSubmitting, setIsPinSubmitting] = (0, import_react17.useState)(false);
|
|
1020
|
+
(0, import_react17.useEffect)(() => {
|
|
1021
|
+
setFirstName(initialFirstName || "");
|
|
1022
|
+
setLastName(initialLastName || "");
|
|
1023
|
+
}, [initialFirstName, initialLastName]);
|
|
1024
|
+
const handleFirstNameChange = (val) => {
|
|
1025
|
+
setFirstName(val.replace(/[^a-zA-Z\s-]/g, "").substring(0, 50));
|
|
1026
|
+
};
|
|
1027
|
+
const handleLastNameChange = (val) => {
|
|
1028
|
+
setLastName(val.replace(/[^a-zA-Z\s-]/g, "").substring(0, 50));
|
|
1029
|
+
};
|
|
1030
|
+
const handleSave = async (e) => {
|
|
1031
|
+
e.preventDefault();
|
|
1032
|
+
if (isSubmitting || isReadOnly) return;
|
|
1033
|
+
setIsSubmitting(true);
|
|
1034
|
+
try {
|
|
1035
|
+
const res = await onSaveProfile({ firstName, lastName });
|
|
1036
|
+
if (res.success) {
|
|
1037
|
+
import_react_hot_toast4.default.success("Profile updated successfully.");
|
|
1038
|
+
setTimeout(() => window.location.reload(), 1e3);
|
|
1039
|
+
} else {
|
|
1040
|
+
import_react_hot_toast4.default.error(res.error || "Uh oh! Something went wrong.");
|
|
1041
|
+
setIsSubmitting(false);
|
|
1042
|
+
}
|
|
1043
|
+
} catch (error) {
|
|
1044
|
+
import_react_hot_toast4.default.error("Uh oh! Something went wrong.");
|
|
1045
|
+
setIsSubmitting(false);
|
|
1046
|
+
}
|
|
1047
|
+
};
|
|
1048
|
+
const closePinModal = () => {
|
|
1049
|
+
if (isPinSubmitting) return;
|
|
1050
|
+
setIsPinModalOpen(false);
|
|
1051
|
+
setOldPin("");
|
|
1052
|
+
setNewPin("");
|
|
1053
|
+
setConfirmPin("");
|
|
1054
|
+
};
|
|
1055
|
+
const handlePinInput = (val, setter) => {
|
|
1056
|
+
setter(val.replace(/\D/g, "").substring(0, 4));
|
|
1057
|
+
};
|
|
1058
|
+
const handlePinSubmit = async (e) => {
|
|
1059
|
+
e.preventDefault();
|
|
1060
|
+
if (!onSavePin) return;
|
|
1061
|
+
if (hasPin && oldPin.length !== 4) return import_react_hot_toast4.default.error("Old PIN must be exactly 4 digits.");
|
|
1062
|
+
if (newPin.length !== 4) return import_react_hot_toast4.default.error("New PIN must be exactly 4 digits.");
|
|
1063
|
+
if (newPin !== confirmPin) return import_react_hot_toast4.default.error("New PINs do not match.");
|
|
1064
|
+
setIsPinSubmitting(true);
|
|
1065
|
+
try {
|
|
1066
|
+
const action = hasPin ? "change_pin" : "create_pin";
|
|
1067
|
+
const res = await onSavePin({
|
|
1068
|
+
action,
|
|
1069
|
+
oldPin: hasPin ? oldPin : void 0,
|
|
1070
|
+
newPin
|
|
1071
|
+
});
|
|
1072
|
+
if (res.success) {
|
|
1073
|
+
import_react_hot_toast4.default.success(res.message || "PIN updated successfully.");
|
|
1074
|
+
closePinModal();
|
|
1075
|
+
} else {
|
|
1076
|
+
import_react_hot_toast4.default.error(res.error || "Failed to update PIN.");
|
|
1077
|
+
}
|
|
1078
|
+
} catch (error) {
|
|
1079
|
+
import_react_hot_toast4.default.error("Uh oh! Something went wrong.");
|
|
1080
|
+
} finally {
|
|
1081
|
+
setIsPinSubmitting(false);
|
|
1082
|
+
}
|
|
1083
|
+
};
|
|
1084
|
+
const hasChanges = firstName !== initialFirstName || lastName !== initialLastName;
|
|
1085
|
+
const isSaveDisabled = isSubmitting || isReadOnly || !hasChanges || firstName.trim().length === 0 || lastName.trim().length === 0;
|
|
1086
|
+
return /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex flex-col max-w-5xl rounded-2xl p-6 bg-white gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ import_react17.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ import_react17.default.createElement("h1", { className: "text-black text-xl mb-1 truncate tracking-tight" }, "Personal Settings"), /* @__PURE__ */ import_react17.default.createElement("p", { className: "text-xs text-neutral-500 truncate" }, "Manage your personal account profile.")), isReadOnly && /* @__PURE__ */ import_react17.default.createElement("span", { className: "p-2 w-9 h-9 bg-neutral-100 text-neutral-400 rounded-full shrink-0" }, /* @__PURE__ */ import_react17.default.createElement(import_react18.HugeiconsIcon, { icon: import_core_free_icons4.CircleLock02Icon, size: 18, className: "text-current" }))), bannerProps && /* @__PURE__ */ import_react17.default.createElement(Banner, { ...bannerProps }), /* @__PURE__ */ import_react17.default.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ import_react17.default.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex flex-col sm:flex-row gap-6" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react17.default.createElement(
|
|
1087
|
+
TextInput,
|
|
1088
|
+
{
|
|
1089
|
+
label: "First Name",
|
|
1090
|
+
value: firstName,
|
|
1091
|
+
onChange: handleFirstNameChange,
|
|
1092
|
+
disabled: isReadOnly || isSubmitting,
|
|
1093
|
+
placeholder: "System"
|
|
1094
|
+
}
|
|
1095
|
+
)), /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react17.default.createElement(
|
|
1096
|
+
TextInput,
|
|
1097
|
+
{
|
|
1098
|
+
label: "Last Name",
|
|
1099
|
+
value: lastName,
|
|
1100
|
+
onChange: handleLastNameChange,
|
|
1101
|
+
disabled: isReadOnly || isSubmitting,
|
|
1102
|
+
placeholder: "Admin"
|
|
1103
|
+
}
|
|
1104
|
+
))), /* @__PURE__ */ import_react17.default.createElement("div", { className: "space-y-2 min-w-0" }, /* @__PURE__ */ import_react17.default.createElement(
|
|
1105
|
+
TextInput,
|
|
1106
|
+
{
|
|
1107
|
+
label: "Email ID",
|
|
1108
|
+
value: email,
|
|
1109
|
+
onChange: () => {
|
|
1110
|
+
},
|
|
1111
|
+
disabled: true
|
|
1112
|
+
}
|
|
1113
|
+
), /* @__PURE__ */ import_react17.default.createElement("p", { className: "text-[11px] text-neutral-500 mt-1 truncate" }, "To change your email address, please contact support.")), /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between pt-8 mt-2 gap-6 sm:gap-4" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex items-center gap-6 min-w-0" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ import_react17.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block truncate" }, "Account Status"), /* @__PURE__ */ import_react17.default.createElement("span", { className: "text-xs text-black block truncate" }, accountStatus)), /* @__PURE__ */ import_react17.default.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ import_react17.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block truncate" }, "Member Since"), /* @__PURE__ */ import_react17.default.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__ */ import_react17.default.createElement("div", { className: "min-w-0 pl-4" }, /* @__PURE__ */ import_react17.default.createElement(
|
|
1114
|
+
"button",
|
|
1115
|
+
{
|
|
1116
|
+
type: "button",
|
|
1117
|
+
onClick: () => setIsPinModalOpen(true),
|
|
1118
|
+
"aria-label": "PIN Settings",
|
|
1119
|
+
className: "w-9 h-9 flex items-center justify-center border border-neutral-200 rounded-full text-black hover:bg-neutral-50 transition-colors outline-none"
|
|
1120
|
+
},
|
|
1121
|
+
/* @__PURE__ */ import_react17.default.createElement(import_react18.HugeiconsIcon, { icon: import_core_free_icons4.LockKeyIcon, size: 17, className: "text-black" })
|
|
1122
|
+
))), /* @__PURE__ */ import_react17.default.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__ */ import_react17.default.createElement(
|
|
1123
|
+
"button",
|
|
1124
|
+
{
|
|
1125
|
+
type: "button",
|
|
1126
|
+
onClick: () => {
|
|
1127
|
+
setFirstName(initialFirstName);
|
|
1128
|
+
setLastName(initialLastName);
|
|
1129
|
+
},
|
|
1130
|
+
className: "text-[11px] tracking-widest text-neutral-400 hover:text-black transition-colors w-full sm:w-auto py-2 sm:py-0 outline-none"
|
|
1131
|
+
},
|
|
1132
|
+
"Cancel"
|
|
1133
|
+
), /* @__PURE__ */ import_react17.default.createElement(
|
|
1134
|
+
ThreeDActionButton,
|
|
1135
|
+
{
|
|
1136
|
+
type: "submit",
|
|
1137
|
+
disabled: isSaveDisabled,
|
|
1138
|
+
isLoading: isSubmitting,
|
|
1139
|
+
className: "min-w-32 w-full sm:w-auto"
|
|
1140
|
+
},
|
|
1141
|
+
"Save Changes"
|
|
1142
|
+
))))), isPinModalOpen && /* @__PURE__ */ import_react17.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: closePinModal }), /* @__PURE__ */ import_react17.default.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__ */ import_react17.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react17.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, hasPin ? "Change PIN" : "Create PIN"), /* @__PURE__ */ import_react17.default.createElement("button", { onClick: closePinModal, disabled: isPinSubmitting, className: "text-neutral-400 hover:text-black transition-colors outline-none disabled:opacity-50" }, /* @__PURE__ */ import_react17.default.createElement(import_react18.HugeiconsIcon, { icon: import_core_free_icons4.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react17.default.createElement("div", { className: "p-6" }, isPinLoading ? /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex flex-col items-center justify-center py-10" }, /* @__PURE__ */ import_react17.default.createElement(import_react18.HugeiconsIcon, { icon: import_core_free_icons4.Loading03Icon, size: 28, className: "animate-spin text-neutral-400 mb-4" })) : /* @__PURE__ */ import_react17.default.createElement("form", { onSubmit: handlePinSubmit, className: "flex flex-col gap-6" }, hasPin && /* @__PURE__ */ import_react17.default.createElement(
|
|
1143
|
+
TextInput,
|
|
1144
|
+
{
|
|
1145
|
+
type: "password",
|
|
1146
|
+
label: "Old PIN",
|
|
1147
|
+
maxLength: 4,
|
|
1148
|
+
disabled: isPinSubmitting,
|
|
1149
|
+
value: oldPin,
|
|
1150
|
+
onChange: (val) => handlePinInput(val, setOldPin),
|
|
1151
|
+
placeholder: "\u2022\u2022\u2022\u2022"
|
|
1152
|
+
}
|
|
1153
|
+
), /* @__PURE__ */ import_react17.default.createElement(
|
|
1154
|
+
TextInput,
|
|
1155
|
+
{
|
|
1156
|
+
type: "password",
|
|
1157
|
+
label: hasPin ? "New PIN" : "Enter 4-Digit PIN",
|
|
1158
|
+
maxLength: 4,
|
|
1159
|
+
disabled: isPinSubmitting,
|
|
1160
|
+
value: newPin,
|
|
1161
|
+
onChange: (val) => handlePinInput(val, setNewPin),
|
|
1162
|
+
placeholder: "\u2022\u2022\u2022\u2022"
|
|
1163
|
+
}
|
|
1164
|
+
), /* @__PURE__ */ import_react17.default.createElement(
|
|
1165
|
+
TextInput,
|
|
1166
|
+
{
|
|
1167
|
+
type: "password",
|
|
1168
|
+
label: "Retype New PIN",
|
|
1169
|
+
maxLength: 4,
|
|
1170
|
+
disabled: isPinSubmitting,
|
|
1171
|
+
value: confirmPin,
|
|
1172
|
+
onChange: (val) => handlePinInput(val, setConfirmPin),
|
|
1173
|
+
placeholder: "\u2022\u2022\u2022\u2022"
|
|
1174
|
+
}
|
|
1175
|
+
), /* @__PURE__ */ import_react17.default.createElement("div", { className: "pt-2" }, /* @__PURE__ */ import_react17.default.createElement(
|
|
1176
|
+
ThreeDActionButton,
|
|
1177
|
+
{
|
|
1178
|
+
type: "submit",
|
|
1179
|
+
disabled: isPinSubmitting || newPin.length !== 4 || confirmPin.length !== 4 || hasPin && oldPin.length !== 4,
|
|
1180
|
+
isLoading: isPinSubmitting,
|
|
1181
|
+
className: "w-full py-3"
|
|
1182
|
+
},
|
|
1183
|
+
hasPin ? "Update PIN" : "Set PIN"
|
|
1184
|
+
)))))));
|
|
1185
|
+
};
|
|
1186
|
+
|
|
1187
|
+
// src/components/UniversalErrorView.tsx
|
|
1188
|
+
var import_react21 = __toESM(require("react"));
|
|
1189
|
+
var import_react22 = require("@hugeicons/react");
|
|
1190
|
+
var import_core_free_icons6 = require("@hugeicons/core-free-icons");
|
|
1191
|
+
|
|
1192
|
+
// src/components/PageSpinner.tsx
|
|
1193
|
+
var import_react19 = __toESM(require("react"));
|
|
1194
|
+
var import_react20 = require("@hugeicons/react");
|
|
1195
|
+
var import_core_free_icons5 = require("@hugeicons/core-free-icons");
|
|
1196
|
+
var PageSpinner = ({
|
|
1197
|
+
className = "",
|
|
1198
|
+
iconClassName = "text-black",
|
|
1199
|
+
size = 32
|
|
1200
|
+
}) => {
|
|
1201
|
+
return (
|
|
1202
|
+
// z-[100] ensures it sits above absolute headers and modals
|
|
1203
|
+
/* @__PURE__ */ import_react19.default.createElement("div", { className: `fixed inset-0 z-100 flex flex-col items-center justify-center w-full h-full pointer-events-none ${className}` }, /* @__PURE__ */ import_react19.default.createElement(
|
|
1204
|
+
import_react20.HugeiconsIcon,
|
|
1205
|
+
{
|
|
1206
|
+
icon: import_core_free_icons5.Loading03Icon,
|
|
1207
|
+
size,
|
|
1208
|
+
className: `animate-spin mb-4 ${iconClassName}`
|
|
1209
|
+
}
|
|
1210
|
+
))
|
|
1211
|
+
);
|
|
1212
|
+
};
|
|
1213
|
+
|
|
1214
|
+
// src/components/UniversalErrorView.tsx
|
|
1215
|
+
var UniversalErrorView = ({
|
|
1216
|
+
isBooting,
|
|
1217
|
+
isLoading,
|
|
1218
|
+
activeData,
|
|
1219
|
+
activeError,
|
|
1220
|
+
envName,
|
|
1221
|
+
onRetry,
|
|
1222
|
+
returnUrl = "/app",
|
|
1223
|
+
returnLabel = "Return to Workspace"
|
|
1224
|
+
}) => {
|
|
1225
|
+
if (isBooting || isLoading && !activeData) {
|
|
1226
|
+
return /* @__PURE__ */ import_react21.default.createElement("div", { className: "flex items-center justify-center h-screen w-full bg-white" }, /* @__PURE__ */ import_react21.default.createElement(PageSpinner, null));
|
|
1227
|
+
}
|
|
1228
|
+
if (!isLoading && (!activeData || activeError)) {
|
|
1229
|
+
const errorString = typeof activeError === "string" ? activeError : JSON.stringify(activeError || "");
|
|
1230
|
+
const errorMsg = errorString.toLowerCase();
|
|
1231
|
+
const isPermissionError = errorMsg.includes("forbidden") || errorMsg.includes("unauthorized") || errorMsg.includes("permission");
|
|
1232
|
+
const isNetworkError = errorMsg.includes("network") || errorMsg.includes("connection") || errorMsg.includes("fetch");
|
|
1233
|
+
const isNotFoundError = errorMsg.includes("not found") || errorMsg.includes("404") || errorMsg.includes("does not exist") || !activeData && !isPermissionError && !isNetworkError;
|
|
1234
|
+
const apiMessage = typeof activeError === "string" && activeError.trim() !== "" ? activeError : null;
|
|
1235
|
+
let title = "Oops Connection Error";
|
|
1236
|
+
let description = apiMessage || `We could not load your request. Please check your connection and try again.`;
|
|
1237
|
+
let IconComponent = import_core_free_icons6.ConfusedIcon;
|
|
1238
|
+
if (isNotFoundError) {
|
|
1239
|
+
title = "Oops its not your fault";
|
|
1240
|
+
description = apiMessage || `We could not reach the ${envName} you just loaded. Our team has been notified.`;
|
|
1241
|
+
} else if (isPermissionError) {
|
|
1242
|
+
title = "Access Restricted";
|
|
1243
|
+
description = apiMessage || `You have insufficient permissions to view this ${envName}. Please contact your administrator.`;
|
|
1244
|
+
}
|
|
1245
|
+
return /* @__PURE__ */ import_react21.default.createElement("div", { className: "flex flex-col items-center justify-center h-screen w-full px-4 animate-in fade-in duration-500" }, /* @__PURE__ */ import_react21.default.createElement("div", { className: "mb-4 flex justify-center" }, /* @__PURE__ */ import_react21.default.createElement(import_react22.HugeiconsIcon, { icon: IconComponent, size: 48, className: "text-neutral-300" })), /* @__PURE__ */ import_react21.default.createElement("h2", { className: "text-lg text-black tracking-tight font-medium" }, title), /* @__PURE__ */ import_react21.default.createElement("p", { className: "text-xs mt-2 mb-8 text-neutral-500 max-w-sm text-center leading-relaxed" }, description), /* @__PURE__ */ import_react21.default.createElement("div", { className: "flex flex-col sm:flex-row items-center gap-3 w-full justify-center sm:w-auto" }, isNotFoundError || isPermissionError ? /* @__PURE__ */ import_react21.default.createElement(
|
|
1246
|
+
"button",
|
|
1247
|
+
{
|
|
1248
|
+
onClick: () => window.location.href = returnUrl,
|
|
1249
|
+
className: "px-6 py-2 text-black border border-neutral-200 hover:bg-neutral-50 rounded-full text-[11px] tracking-widest transition-colors w-full sm:w-auto outline-none font-medium"
|
|
1250
|
+
},
|
|
1251
|
+
returnLabel
|
|
1252
|
+
) : (
|
|
1253
|
+
// Soft errors (Network timeouts) allow them to retry or optionally retreat
|
|
1254
|
+
/* @__PURE__ */ import_react21.default.createElement(import_react21.default.Fragment, null, envName.toLowerCase().includes("application") && /* @__PURE__ */ import_react21.default.createElement(
|
|
1255
|
+
"button",
|
|
1256
|
+
{
|
|
1257
|
+
onClick: () => window.location.href = returnUrl,
|
|
1258
|
+
className: "px-6 py-2 bg-transparent border border-neutral-200 text-neutral-500 hover:text-black hover:bg-neutral-50 rounded-full text-[11px] tracking-widest transition-colors w-full sm:w-auto outline-none font-medium"
|
|
1259
|
+
},
|
|
1260
|
+
"Back Home"
|
|
1261
|
+
), /* @__PURE__ */ import_react21.default.createElement(
|
|
1262
|
+
"button",
|
|
1263
|
+
{
|
|
1264
|
+
onClick: onRetry,
|
|
1265
|
+
className: "px-6 py-2 bg-black text-white hover:bg-neutral-800 rounded-full text-[11px] tracking-widest transition-colors w-full sm:w-auto outline-none capitalize font-medium"
|
|
1266
|
+
},
|
|
1267
|
+
"Refresh ",
|
|
1268
|
+
envName
|
|
1269
|
+
))
|
|
1270
|
+
)));
|
|
1271
|
+
}
|
|
1272
|
+
return null;
|
|
1273
|
+
};
|
|
1274
|
+
|
|
1275
|
+
// src/components/UniversalTransactionPage.tsx
|
|
1276
|
+
var import_react23 = __toESM(require("react"));
|
|
1277
|
+
var import_react24 = require("@hugeicons/react");
|
|
1278
|
+
var import_react_hot_toast5 = __toESM(require("react-hot-toast"));
|
|
1279
|
+
var import_core_free_icons7 = require("@hugeicons/core-free-icons");
|
|
1280
|
+
var PageSpinner2 = () => /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
1281
|
+
var formatDate = (dateInput) => {
|
|
1282
|
+
const d = new Date(dateInput);
|
|
1283
|
+
const day = d.getDate();
|
|
1284
|
+
const month = d.toLocaleString("en-US", { month: "short" });
|
|
1285
|
+
const year = d.getFullYear();
|
|
1286
|
+
return `${day} ${month} ${year}`;
|
|
1287
|
+
};
|
|
1288
|
+
var formatTime = (dateInput) => {
|
|
1289
|
+
return new Date(dateInput).toLocaleTimeString("en-US", { hour: "2-digit", minute: "2-digit" });
|
|
1290
|
+
};
|
|
1291
|
+
var truncateAddress = (address) => {
|
|
1292
|
+
if (!address || address.length < 12) return address;
|
|
1293
|
+
return `${address.substring(0, 6)}...${address.substring(address.length - 4)}`;
|
|
1294
|
+
};
|
|
1295
|
+
var UniversalTransactionPage = ({
|
|
1296
|
+
headerTitle,
|
|
1297
|
+
headerDescription,
|
|
1298
|
+
hideControls = false,
|
|
1299
|
+
hideBalanceAmounts = false,
|
|
1300
|
+
hidePagination = false,
|
|
1301
|
+
transactions,
|
|
1302
|
+
isLoading,
|
|
1303
|
+
currentPage,
|
|
1304
|
+
totalPages,
|
|
1305
|
+
onPageChange,
|
|
1306
|
+
searchQuery,
|
|
1307
|
+
onSearchChange,
|
|
1308
|
+
activeDirectionFilter,
|
|
1309
|
+
onDirectionFilterChange,
|
|
1310
|
+
activeTypeFilter,
|
|
1311
|
+
onTypeFilterChange,
|
|
1312
|
+
onReportTransaction,
|
|
1313
|
+
onGenerateReceipt
|
|
1314
|
+
}) => {
|
|
1315
|
+
const [selectedTransaction, setSelectedTransaction] = (0, import_react23.useState)(null);
|
|
1316
|
+
const [isGeneratingReceipt, setIsGeneratingReceipt] = (0, import_react23.useState)(false);
|
|
1317
|
+
const [localSearchQuery, setLocalSearchQuery] = (0, import_react23.useState)(searchQuery);
|
|
1318
|
+
const [isTyping, setIsTyping] = (0, import_react23.useState)(false);
|
|
1319
|
+
const [isDirectionModalOpen, setIsDirectionModalOpen] = (0, import_react23.useState)(false);
|
|
1320
|
+
const [isTypeModalOpen, setIsTypeModalOpen] = (0, import_react23.useState)(false);
|
|
1321
|
+
const directionDropdownRef = (0, import_react23.useRef)(null);
|
|
1322
|
+
const typeDropdownRef = (0, import_react23.useRef)(null);
|
|
1323
|
+
(0, import_react23.useEffect)(() => {
|
|
1324
|
+
function handleClickOutside(event) {
|
|
1325
|
+
if (directionDropdownRef.current && !directionDropdownRef.current.contains(event.target)) {
|
|
1326
|
+
setIsDirectionModalOpen(false);
|
|
1327
|
+
}
|
|
1328
|
+
if (typeDropdownRef.current && !typeDropdownRef.current.contains(event.target)) {
|
|
1329
|
+
setIsTypeModalOpen(false);
|
|
1330
|
+
}
|
|
1331
|
+
}
|
|
1332
|
+
document.addEventListener("mousedown", handleClickOutside);
|
|
1333
|
+
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
1334
|
+
}, []);
|
|
1335
|
+
(0, import_react23.useEffect)(() => {
|
|
1336
|
+
setIsTyping(true);
|
|
1337
|
+
const handler = setTimeout(() => {
|
|
1338
|
+
onSearchChange(localSearchQuery);
|
|
1339
|
+
setIsTyping(false);
|
|
1340
|
+
}, 600);
|
|
1341
|
+
return () => clearTimeout(handler);
|
|
1342
|
+
}, [localSearchQuery, onSearchChange]);
|
|
1343
|
+
(0, import_react23.useEffect)(() => {
|
|
1344
|
+
if (searchQuery === "" && localSearchQuery !== "") {
|
|
1345
|
+
setLocalSearchQuery("");
|
|
1346
|
+
}
|
|
1347
|
+
}, [searchQuery]);
|
|
1348
|
+
const getDisplayName = (tx) => {
|
|
1349
|
+
if (tx.metadata?.merchantName) return tx.metadata.merchantName;
|
|
1350
|
+
if (tx.metadata?.description) return tx.metadata.description;
|
|
1351
|
+
return tx.type === "CARD_TRANSACTION" ? "Card Transaction" : "Wallet Transaction";
|
|
1352
|
+
};
|
|
1353
|
+
const handleGenerateReceipt = async () => {
|
|
1354
|
+
if (!onGenerateReceipt || !selectedTransaction) return;
|
|
1355
|
+
setIsGeneratingReceipt(true);
|
|
1356
|
+
try {
|
|
1357
|
+
await onGenerateReceipt(selectedTransaction);
|
|
1358
|
+
import_react_hot_toast5.default.success("Receipt generated successfully.");
|
|
1359
|
+
} catch (error) {
|
|
1360
|
+
import_react_hot_toast5.default.error("Failed to generate receipt.");
|
|
1361
|
+
} finally {
|
|
1362
|
+
setIsGeneratingReceipt(false);
|
|
1363
|
+
}
|
|
1364
|
+
};
|
|
1365
|
+
const isListLoading = isLoading || isTyping;
|
|
1366
|
+
return /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex flex-col gap-6 animate-in max-w-5xl fade-in duration-300" }, /* @__PURE__ */ import_react23.default.createElement(ManagedToaster, null), !hideControls && /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex flex-col sm:flex-row items-center justify-between gap-4 w-full" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "relative w-full sm:w-96" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.Search01Icon, size: 16, className: "text-neutral-400" })), /* @__PURE__ */ import_react23.default.createElement(
|
|
1367
|
+
"input",
|
|
1368
|
+
{
|
|
1369
|
+
type: "text",
|
|
1370
|
+
placeholder: "Search reference or amount...",
|
|
1371
|
+
value: localSearchQuery,
|
|
1372
|
+
onChange: (e) => setLocalSearchQuery(e.target.value),
|
|
1373
|
+
className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-[13px] text-black placeholder-neutral-400 outline-none transition-colors focus:border-black"
|
|
1374
|
+
}
|
|
1375
|
+
)), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex items-center gap-3 w-full sm:w-auto overflow-x-auto pb-1 sm:pb-0" }, /* @__PURE__ */ import_react23.default.createElement(
|
|
1376
|
+
"button",
|
|
1377
|
+
{
|
|
1378
|
+
onClick: () => setIsDirectionModalOpen(true),
|
|
1379
|
+
className: "flex items-center gap-2 whitespace-nowrap bg-white px-5 py-2 rounded-full text-[12px] text-neutral-500 hover:text-black transition-colors outline-none"
|
|
1380
|
+
},
|
|
1381
|
+
/* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.SearchList02Icon, size: 12 }),
|
|
1382
|
+
activeDirectionFilter === "ALL" ? "Payment Type" : activeDirectionFilter
|
|
1383
|
+
), /* @__PURE__ */ import_react23.default.createElement(
|
|
1384
|
+
"button",
|
|
1385
|
+
{
|
|
1386
|
+
onClick: () => setIsTypeModalOpen(true),
|
|
1387
|
+
className: "flex items-center gap-2 whitespace-nowrap bg-white px-5 py-2 rounded-full text-[12px] text-neutral-500 hover:text-black transition-colors outline-none"
|
|
1388
|
+
},
|
|
1389
|
+
/* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.ListSettingIcon, size: 14 }),
|
|
1390
|
+
activeTypeFilter === "ALL" ? "All Transactions" : activeTypeFilter.replace("_", " ")
|
|
1391
|
+
))), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ import_react23.default.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), /* @__PURE__ */ import_react23.default.createElement("div", { className: "w-full overflow-hidden" }, isListLoading ? /* @__PURE__ */ import_react23.default.createElement(PageSpinner2, null) : /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react23.default.createElement("div", null, transactions.length === 0 ? /* @__PURE__ */ import_react23.default.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No transactions found") : transactions.map((tx) => /* @__PURE__ */ import_react23.default.createElement(
|
|
1392
|
+
"div",
|
|
1393
|
+
{
|
|
1394
|
+
key: tx.id,
|
|
1395
|
+
onClick: () => setSelectedTransaction(tx),
|
|
1396
|
+
className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
|
|
1397
|
+
},
|
|
1398
|
+
/* @__PURE__ */ import_react23.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: `w-10 h-10 shrink-0 rounded-full flex items-center justify-center bg-neutral-100 text-black` }, /* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: tx.direction === "CREDIT" ? import_core_free_icons7.ArrowDownRight01Icon : import_core_free_icons7.ArrowUpRight01Icon, size: 18 })), /* @__PURE__ */ import_react23.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ import_react23.default.createElement("p", { className: "text-[13px] text-black truncate" }, getDisplayName(tx)), /* @__PURE__ */ import_react23.default.createElement("p", { className: `text-[13px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, tx.direction === "CREDIT" ? "+" : "-", tx.amount, " ", tx.currency))),
|
|
1399
|
+
/* @__PURE__ */ import_react23.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] text-neutral-400" }, formatDate(tx.createdAt)), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] text-neutral-400 capitalize" }, tx.direction.toLowerCase()))
|
|
1400
|
+
))), !hidePagination && /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react23.default.createElement(
|
|
1401
|
+
"button",
|
|
1402
|
+
{
|
|
1403
|
+
onClick: () => onPageChange(currentPage - 1),
|
|
1404
|
+
disabled: currentPage <= 1 || isListLoading,
|
|
1405
|
+
className: "p-2 bg-white border border-neutral-200 rounded-full text-black hover:bg-neutral-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
1406
|
+
},
|
|
1407
|
+
/* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.ArrowLeft01Icon, size: 14 })
|
|
1408
|
+
), /* @__PURE__ */ import_react23.default.createElement(
|
|
1409
|
+
"button",
|
|
1410
|
+
{
|
|
1411
|
+
onClick: () => onPageChange(currentPage + 1),
|
|
1412
|
+
disabled: currentPage >= totalPages || isListLoading || totalPages === 0,
|
|
1413
|
+
className: "p-2 bg-white border border-neutral-200 rounded-full text-black hover:bg-neutral-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
1414
|
+
},
|
|
1415
|
+
/* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.ArrowRight01Icon, size: 14 })
|
|
1416
|
+
)))))), selectedTransaction && /* @__PURE__ */ import_react23.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedTransaction(null) }), /* @__PURE__ */ import_react23.default.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__ */ import_react23.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react23.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Details"), /* @__PURE__ */ import_react23.default.createElement("button", { onClick: () => setSelectedTransaction(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex flex-col items-center justify-center mb-4" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: `w-12 h-12 rounded-full flex items-center justify-center mb-4 bg-neutral-100 text-black` }, /* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: selectedTransaction.direction === "CREDIT" ? import_core_free_icons7.ArrowDownRight01Icon : import_core_free_icons7.ArrowUpRight01Icon, size: 20 })), /* @__PURE__ */ import_react23.default.createElement("h2", { className: `text-2xl text-black mb-2 transition-all duration-300 font-medium ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedTransaction.direction === "CREDIT" ? "+" : "-", selectedTransaction.amount, " ", selectedTransaction.currency), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full bg-neutral-50" }, selectedTransaction.status)), /* @__PURE__ */ import_react23.default.createElement("div", { className: "grid grid-cols-1 gap-y-8 gap-x-4 mb-10 mt-6" }, /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Reference ID"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[13px] text-black break-all" }, selectedTransaction.reference)), /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Date & Time"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[13px] text-black" }, formatDate(selectedTransaction.createdAt), " at ", formatTime(selectedTransaction.createdAt))), /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Transaction Type"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[13px] text-black capitalize" }, selectedTransaction.type.replace("_", " ").toLowerCase())), /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Flow Direction"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[13px] text-black capitalize" }, selectedTransaction.direction.toLowerCase())), selectedTransaction.metadata?.fromAddress && selectedTransaction.metadata?.toAddress && /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Transfer Route"), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex items-center gap-2 text-[13px] text-black" }, /* @__PURE__ */ import_react23.default.createElement("span", { className: "truncate font-medium" }, truncateAddress(String(selectedTransaction.metadata.fromAddress))), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-neutral-400" }, "\u2192"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "truncate font-medium" }, truncateAddress(String(selectedTransaction.metadata.toAddress))))), selectedTransaction.metadata && Object.entries(selectedTransaction.metadata).map(([key, value]) => {
|
|
1417
|
+
if (key === "fromAddress" || key === "toAddress") return null;
|
|
1418
|
+
if (value === null || value === void 0 || typeof value === "object") return null;
|
|
1419
|
+
const formattedKey = key.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase());
|
|
1420
|
+
return /* @__PURE__ */ import_react23.default.createElement("div", { key }, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, formattedKey), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[13px] text-black break-all" }, String(value)));
|
|
1421
|
+
})), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react23.default.createElement(
|
|
1422
|
+
ThreeDActionButton,
|
|
1423
|
+
{
|
|
1424
|
+
onClick: handleGenerateReceipt,
|
|
1425
|
+
isLoading: isGeneratingReceipt,
|
|
1426
|
+
className: "w-full py-3 text-[14px]"
|
|
1427
|
+
},
|
|
1428
|
+
"Generate Receipt"
|
|
1429
|
+
), /* @__PURE__ */ import_react23.default.createElement(
|
|
1430
|
+
"button",
|
|
1431
|
+
{
|
|
1432
|
+
onClick: () => onReportTransaction && onReportTransaction(selectedTransaction),
|
|
1433
|
+
className: "w-full flex items-center font-medium justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none text-[13px] tracking-wide mt-2"
|
|
1434
|
+
},
|
|
1435
|
+
"Report Transaction"
|
|
1436
|
+
), selectedTransaction.type === "WALLET_TRANSACTION" && /* @__PURE__ */ import_react23.default.createElement(
|
|
1437
|
+
"a",
|
|
1438
|
+
{
|
|
1439
|
+
href: `https://basescan.org/tx/${selectedTransaction.reference}`,
|
|
1440
|
+
target: "_blank",
|
|
1441
|
+
rel: "noopener noreferrer",
|
|
1442
|
+
className: "w-full flex items-center font-medium justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none text-[13px] tracking-wide mt-2"
|
|
1443
|
+
},
|
|
1444
|
+
"View in block explorer"
|
|
1445
|
+
))))), isDirectionModalOpen && /* @__PURE__ */ import_react23.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setIsDirectionModalOpen(false) }), /* @__PURE__ */ import_react23.default.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__ */ import_react23.default.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ import_react23.default.createElement("h3", { className: "text-[14px] text-black tracking-tight" }, "Payment Type")), /* @__PURE__ */ import_react23.default.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 gap-1" }, ["ALL", "CREDIT", "DEBIT"].map((option) => /* @__PURE__ */ import_react23.default.createElement(
|
|
1446
|
+
"button",
|
|
1447
|
+
{
|
|
1448
|
+
key: option,
|
|
1449
|
+
onClick: () => {
|
|
1450
|
+
onDirectionFilterChange(option);
|
|
1451
|
+
setIsDirectionModalOpen(false);
|
|
1452
|
+
},
|
|
1453
|
+
className: `text-left px-4 py-3 text-[11px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeDirectionFilter === option ? "bg-neutral-100 text-black font-medium" : "text-neutral-500 hover:bg-neutral-50 hover:text-black"}`
|
|
1454
|
+
},
|
|
1455
|
+
/* @__PURE__ */ import_react23.default.createElement("span", { className: "truncate pr-2" }, option.charAt(0).toUpperCase() + option.slice(1).toLowerCase())
|
|
1456
|
+
))), /* @__PURE__ */ import_react23.default.createElement("div", { className: "w-full flex mt-2 " }, /* @__PURE__ */ import_react23.default.createElement(
|
|
1457
|
+
"button",
|
|
1458
|
+
{
|
|
1459
|
+
onClick: () => setIsDirectionModalOpen(false),
|
|
1460
|
+
className: "w-full py-4 text-[13px] text-neutral-500 hover:text-black transition-colors outline-none font-medium"
|
|
1461
|
+
},
|
|
1462
|
+
"Cancel"
|
|
1463
|
+
)))), isTypeModalOpen && /* @__PURE__ */ import_react23.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setIsTypeModalOpen(false) }), /* @__PURE__ */ import_react23.default.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__ */ import_react23.default.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ import_react23.default.createElement("h3", { className: "text-[14px] text-black tracking-tight" }, "Transactions Type")), /* @__PURE__ */ import_react23.default.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 gap-1" }, [
|
|
1464
|
+
{ label: "All Transactions", value: "ALL" },
|
|
1465
|
+
{ label: "Wallet Transactions", value: "WALLET_TRANSACTION" },
|
|
1466
|
+
{ label: "Card Transactions", value: "CARD_TRANSACTION" }
|
|
1467
|
+
].map((option) => /* @__PURE__ */ import_react23.default.createElement(
|
|
1468
|
+
"button",
|
|
1469
|
+
{
|
|
1470
|
+
key: option.value,
|
|
1471
|
+
onClick: () => {
|
|
1472
|
+
onTypeFilterChange(option.value);
|
|
1473
|
+
setIsTypeModalOpen(false);
|
|
1474
|
+
},
|
|
1475
|
+
className: `text-left px-4 py-3 text-[11px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeTypeFilter === option.value ? "bg-neutral-100 text-black font-medium" : "text-neutral-500 hover:bg-neutral-50 hover:text-black"}`
|
|
1476
|
+
},
|
|
1477
|
+
/* @__PURE__ */ import_react23.default.createElement("span", { className: "truncate pr-2" }, option.label.charAt(0).toUpperCase() + option.label.slice(1).toLowerCase())
|
|
1478
|
+
))), /* @__PURE__ */ import_react23.default.createElement("div", { className: "w-full flex mt-2 " }, /* @__PURE__ */ import_react23.default.createElement(
|
|
1479
|
+
"button",
|
|
1480
|
+
{
|
|
1481
|
+
onClick: () => setIsTypeModalOpen(false),
|
|
1482
|
+
className: "w-full py-4 text-[13px] text-neutral-500 hover:text-black transition-colors outline-none font-medium"
|
|
1483
|
+
},
|
|
1484
|
+
"Cancel"
|
|
1485
|
+
)))));
|
|
1486
|
+
};
|
|
1487
|
+
|
|
1488
|
+
// src/components/UniversalHomeView.tsx
|
|
1489
|
+
var import_react25 = __toESM(require("react"));
|
|
1490
|
+
var import_react26 = require("@hugeicons/react");
|
|
1491
|
+
var import_core_free_icons8 = require("@hugeicons/core-free-icons");
|
|
1492
|
+
var UniversalHomeView = ({
|
|
1493
|
+
balanceLabel = "Your Balance",
|
|
1494
|
+
balanceAmount,
|
|
1495
|
+
balanceCurrency = "$",
|
|
1496
|
+
primaryAction,
|
|
1497
|
+
secondaryAction,
|
|
1498
|
+
transactionsProps
|
|
1499
|
+
}) => {
|
|
1500
|
+
const [displayAmount, setDisplayAmount] = (0, import_react25.useState)("0.00");
|
|
1501
|
+
const [isBalanceHidden, setIsBalanceHidden] = (0, import_react25.useState)(false);
|
|
1502
|
+
(0, import_react25.useEffect)(() => {
|
|
1503
|
+
const target = parseFloat(balanceAmount.replace(/,/g, ""));
|
|
1504
|
+
if (isNaN(target)) {
|
|
1505
|
+
setDisplayAmount(balanceAmount);
|
|
1506
|
+
return;
|
|
1507
|
+
}
|
|
1508
|
+
let startTimestamp = null;
|
|
1509
|
+
const duration = 1e3;
|
|
1510
|
+
const step = (timestamp) => {
|
|
1511
|
+
if (!startTimestamp) startTimestamp = timestamp;
|
|
1512
|
+
const progress = Math.min((timestamp - startTimestamp) / duration, 1);
|
|
1513
|
+
const easeProgress = progress === 1 ? 1 : 1 - Math.pow(2, -10 * progress);
|
|
1514
|
+
const currentCount = easeProgress * target;
|
|
1515
|
+
setDisplayAmount(currentCount.toLocaleString("en-US", {
|
|
1516
|
+
minimumFractionDigits: 2,
|
|
1517
|
+
maximumFractionDigits: 2
|
|
1518
|
+
}));
|
|
1519
|
+
if (progress < 1) {
|
|
1520
|
+
requestAnimationFrame(step);
|
|
1521
|
+
} else {
|
|
1522
|
+
setDisplayAmount(target.toLocaleString("en-US", {
|
|
1523
|
+
minimumFractionDigits: 2,
|
|
1524
|
+
maximumFractionDigits: 2
|
|
1525
|
+
}));
|
|
1526
|
+
}
|
|
1527
|
+
};
|
|
1528
|
+
requestAnimationFrame(step);
|
|
1529
|
+
}, [balanceAmount]);
|
|
1530
|
+
const [intPart, decPart] = displayAmount.includes(".") ? displayAmount.split(".") : [displayAmount, "00"];
|
|
1531
|
+
return /* @__PURE__ */ import_react25.default.createElement("div", { className: "w-full max-w-5xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "relative flex items-start justify-between w-full pt-4 pb-8" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "flex flex-col items-start text-left z-10 w-full" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "flex items-center gap-2 mb-1.5" }, /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-[12px] sm:text-[13px] text-neutral-500" }, balanceLabel), /* @__PURE__ */ import_react25.default.createElement(
|
|
1532
|
+
"button",
|
|
1533
|
+
{
|
|
1534
|
+
onClick: () => setIsBalanceHidden(!isBalanceHidden),
|
|
1535
|
+
className: "text-neutral-400 hover:text-black transition-colors outline-none"
|
|
1536
|
+
},
|
|
1537
|
+
/* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: isBalanceHidden ? import_core_free_icons8.ViewIcon : import_core_free_icons8.ViewOffSlashIcon, size: 14 })
|
|
1538
|
+
)), /* @__PURE__ */ import_react25.default.createElement("h1", { className: `text-3xl sm:text-4xl md:text-5xl text-black tracking-tight mb-5 tabular-nums flex items-baseline transition-all duration-300 ${isBalanceHidden ? "blur-sm opacity-40 select-none" : ""}` }, /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-xl sm:text-2xl text-neutral-400 mr-1" }, balanceCurrency), intPart, /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-xl sm:text-2xl text-neutral-400" }, ".", decPart)), /* @__PURE__ */ import_react25.default.createElement("div", { className: "flex items-center gap-3" }, primaryAction && /* @__PURE__ */ import_react25.default.createElement(
|
|
1539
|
+
ThreeDActionButton,
|
|
1540
|
+
{
|
|
1541
|
+
onClick: primaryAction.onClick,
|
|
1542
|
+
className: "px-6 py-2.5 sm:px-8 sm:py-2.5"
|
|
1543
|
+
},
|
|
1544
|
+
/* @__PURE__ */ import_react25.default.createElement("span", { className: "flex items-center gap-1.5 text-[13px] tracking-wide font-medium" }, primaryAction.label, primaryAction.icon && /* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: primaryAction.icon, size: 16 }))
|
|
1545
|
+
), secondaryAction && /* @__PURE__ */ import_react25.default.createElement(
|
|
1546
|
+
"button",
|
|
1547
|
+
{
|
|
1548
|
+
onClick: secondaryAction.onClick,
|
|
1549
|
+
className: "flex items-center gap-1.5 px-6 py-2.5 sm:px-8 sm:py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none"
|
|
1550
|
+
},
|
|
1551
|
+
/* @__PURE__ */ import_react25.default.createElement("span", { className: "text-[13px] tracking-wide font-medium" }, secondaryAction.label),
|
|
1552
|
+
secondaryAction.icon && /* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: secondaryAction.icon, size: 16 })
|
|
1553
|
+
)))), /* @__PURE__ */ import_react25.default.createElement("div", { className: "w-full mt-2" }, /* @__PURE__ */ import_react25.default.createElement(
|
|
1554
|
+
UniversalTransactionPage,
|
|
1555
|
+
{
|
|
1556
|
+
...transactionsProps,
|
|
1557
|
+
hideControls: true,
|
|
1558
|
+
hideBalanceAmounts: isBalanceHidden,
|
|
1559
|
+
hidePagination: true
|
|
1560
|
+
}
|
|
1561
|
+
)));
|
|
1562
|
+
};
|
|
1563
|
+
|
|
1564
|
+
// src/components/UniversalWalletPage.tsx
|
|
1565
|
+
var import_react27 = __toESM(require("react"));
|
|
1566
|
+
var import_react_hot_toast6 = __toESM(require("react-hot-toast"));
|
|
1567
|
+
var import_react28 = require("@hugeicons/react");
|
|
1568
|
+
var import_core_free_icons9 = require("@hugeicons/core-free-icons");
|
|
1569
|
+
var PageSpinner3 = () => /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
1570
|
+
var WalletLogo = ({ src, alt, sizeClass = "w-10 h-10" }) => {
|
|
1571
|
+
const [isLoaded, setIsLoaded] = (0, import_react27.useState)(false);
|
|
1572
|
+
return /* @__PURE__ */ import_react27.default.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden ${sizeClass}` }, !isLoaded && /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Loading03Icon, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ import_react27.default.createElement(
|
|
1573
|
+
"img",
|
|
1574
|
+
{
|
|
1575
|
+
src,
|
|
1576
|
+
alt,
|
|
1577
|
+
onLoad: () => setIsLoaded(true),
|
|
1578
|
+
className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}`
|
|
1579
|
+
}
|
|
1580
|
+
));
|
|
1581
|
+
};
|
|
1582
|
+
var UniversalWalletPage = ({
|
|
1583
|
+
headerTitle,
|
|
1584
|
+
headerDescription,
|
|
1585
|
+
hideControls = false,
|
|
1586
|
+
hideBalanceAmounts = false,
|
|
1587
|
+
isGeneratingStatement = false,
|
|
1588
|
+
wallets,
|
|
1589
|
+
isLoading = false,
|
|
1590
|
+
renderQrCode,
|
|
1591
|
+
onDownloadPayId,
|
|
1592
|
+
onCopyAddress
|
|
1593
|
+
}) => {
|
|
1594
|
+
const [selectedWallet, setSelectedWallet] = (0, import_react27.useState)(null);
|
|
1595
|
+
const [localSearchQuery, setLocalSearchQuery] = (0, import_react27.useState)("");
|
|
1596
|
+
const filteredWallets = wallets.filter((wallet) => {
|
|
1597
|
+
const q = localSearchQuery.toLowerCase();
|
|
1598
|
+
return wallet.name.toLowerCase().includes(q) || wallet.currency.toLowerCase().includes(q) || wallet.network.toLowerCase().includes(q);
|
|
1599
|
+
});
|
|
1600
|
+
const handleCopy = (wallet) => {
|
|
1601
|
+
if (onCopyAddress) onCopyAddress(wallet);
|
|
1602
|
+
if (typeof navigator !== "undefined" && navigator.clipboard) {
|
|
1603
|
+
navigator.clipboard.writeText(wallet.address).catch(() => {
|
|
1604
|
+
});
|
|
1605
|
+
}
|
|
1606
|
+
import_react_hot_toast6.default.success("Address copied to clipboard");
|
|
1607
|
+
};
|
|
1608
|
+
return /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-6 animate-in max-w-5xl fade-in duration-300" }, /* @__PURE__ */ import_react27.default.createElement(ManagedToaster, null), !hideControls && /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col sm:flex-row items-center justify-between gap-4 w-full" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "relative w-full sm:w-96" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.Search01Icon, size: 16, className: "text-neutral-400" })), /* @__PURE__ */ import_react27.default.createElement(
|
|
1609
|
+
"input",
|
|
1610
|
+
{
|
|
1611
|
+
type: "text",
|
|
1612
|
+
placeholder: "Search wallets by name or network...",
|
|
1613
|
+
value: localSearchQuery,
|
|
1614
|
+
onChange: (e) => setLocalSearchQuery(e.target.value),
|
|
1615
|
+
className: "w-full pl-10 pr-4 py-2 bg-white border border-neutral-200 rounded-full text-[13px] text-black placeholder-neutral-400 outline-none transition-all duration-300 focus:border-black"
|
|
1616
|
+
}
|
|
1617
|
+
))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ import_react27.default.createElement(PageSpinner3, null) : /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react27.default.createElement("div", null, filteredWallets.length === 0 ? /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No wallets found") : filteredWallets.map((wallet) => /* @__PURE__ */ import_react27.default.createElement(
|
|
1618
|
+
"div",
|
|
1619
|
+
{
|
|
1620
|
+
key: wallet.id,
|
|
1621
|
+
onClick: () => setSelectedWallet(wallet),
|
|
1622
|
+
className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
|
|
1623
|
+
},
|
|
1624
|
+
/* @__PURE__ */ import_react27.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react27.default.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), /* @__PURE__ */ import_react27.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ import_react27.default.createElement("p", { className: "text-[13px] text-black truncate font-medium" }, wallet.name), /* @__PURE__ */ import_react27.default.createElement("p", { className: `text-[13px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, wallet.balance, " ", wallet.currency))),
|
|
1625
|
+
/* @__PURE__ */ import_react27.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[10px] tracking-wide text-neutral-600 bg-neutral-100 px-2.5 py-1 rounded-full " }, wallet.network))
|
|
1626
|
+
)))))), selectedWallet && /* @__PURE__ */ import_react27.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedWallet(null) }), /* @__PURE__ */ import_react27.default.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__ */ import_react27.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react27.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Wallet Details"), /* @__PURE__ */ import_react27.default.createElement("button", { onClick: () => setSelectedWallet(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react27.default.createElement(import_react28.HugeiconsIcon, { icon: import_core_free_icons9.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-6" }, /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ import_react27.default.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14 mb-4" }), /* @__PURE__ */ import_react27.default.createElement("h2", { className: `text-2xl text-black mb-2 transition-all duration-300 font-medium ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedWallet.balance, " ", selectedWallet.currency), /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full border border-neutral-200 uppercase mt-1 " }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ import_react27.default.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, renderQrCode(selectedWallet)), /* @__PURE__ */ import_react27.default.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Address"), /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-black break-all font-medium" }, selectedWallet.address)), /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Wallet Name"), /* @__PURE__ */ import_react27.default.createElement("span", { className: "text-[13px] text-black" }, selectedWallet.name))), /* @__PURE__ */ import_react27.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react27.default.createElement(
|
|
1627
|
+
ThreeDActionButton,
|
|
1628
|
+
{
|
|
1629
|
+
onClick: () => onDownloadPayId && onDownloadPayId(selectedWallet),
|
|
1630
|
+
isLoading: isGeneratingStatement,
|
|
1631
|
+
className: "w-full py-3 text-[13px]"
|
|
1632
|
+
},
|
|
1633
|
+
"Generate Statement"
|
|
1634
|
+
), /* @__PURE__ */ import_react27.default.createElement(
|
|
1635
|
+
"button",
|
|
1636
|
+
{
|
|
1637
|
+
onClick: () => handleCopy(selectedWallet),
|
|
1638
|
+
className: "w-full flex font-medium items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-[13px] tracking-wide transition-colors"
|
|
1639
|
+
},
|
|
1640
|
+
"Copy Wallet Address"
|
|
1641
|
+
))))));
|
|
1642
|
+
};
|
|
1643
|
+
|
|
1644
|
+
// src/components/UniversalCardPage.tsx
|
|
1645
|
+
var import_react29 = __toESM(require("react"));
|
|
1646
|
+
var import_react30 = require("@hugeicons/react");
|
|
1647
|
+
var import_core_free_icons10 = require("@hugeicons/core-free-icons");
|
|
1648
|
+
var UniversalCardPage = ({
|
|
1649
|
+
cardHolderName,
|
|
1650
|
+
cardNumber,
|
|
1651
|
+
expiry,
|
|
1652
|
+
cvv,
|
|
1653
|
+
cardBgSrc,
|
|
1654
|
+
companyLogoSrc,
|
|
1655
|
+
networkLogoSrc,
|
|
1656
|
+
onReveal,
|
|
1657
|
+
onFreeze,
|
|
1658
|
+
onSetLimits,
|
|
1659
|
+
onDelete
|
|
1660
|
+
}) => {
|
|
1661
|
+
const [isFlipped, setIsFlipped] = (0, import_react29.useState)(false);
|
|
1662
|
+
return /* @__PURE__ */ import_react29.default.createElement("div", { className: "w-full max-w-md mx-auto flex flex-col items-center animate-in fade-in duration-300 pb-12" }, /* @__PURE__ */ import_react29.default.createElement("div", { className: "w-full px-4 pt-6 pb-2", style: { perspective: "1000px" } }, /* @__PURE__ */ import_react29.default.createElement(
|
|
1663
|
+
"div",
|
|
1664
|
+
{
|
|
1665
|
+
onClick: () => setIsFlipped(!isFlipped),
|
|
1666
|
+
className: "relative w-full h-50.5 cursor-pointer transition-transform duration-700",
|
|
1667
|
+
style: {
|
|
1668
|
+
transformStyle: "preserve-3d",
|
|
1669
|
+
transform: isFlipped ? "rotateY(180deg)" : "rotateY(0deg)"
|
|
1670
|
+
}
|
|
1671
|
+
},
|
|
1672
|
+
/* @__PURE__ */ import_react29.default.createElement(
|
|
1673
|
+
"div",
|
|
1674
|
+
{
|
|
1675
|
+
className: "absolute inset-0 w-full h-full rounded-2xl overflow-hidden shadow-xl",
|
|
1676
|
+
style: { backfaceVisibility: "hidden" }
|
|
1677
|
+
},
|
|
1678
|
+
/* @__PURE__ */ import_react29.default.createElement(
|
|
1679
|
+
"div",
|
|
1680
|
+
{
|
|
1681
|
+
className: "absolute inset-0 bg-cover bg-center",
|
|
1682
|
+
style: { backgroundImage: `url(${cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
1683
|
+
}
|
|
1684
|
+
),
|
|
1685
|
+
/* @__PURE__ */ import_react29.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex justify-between items-start w-full" }, /* @__PURE__ */ import_react29.default.createElement("div", null, /* @__PURE__ */ import_react29.default.createElement("span", { className: "text-[13px] text-white/70 font-medium" }, "Prepaid Card")), companyLogoSrc && /* @__PURE__ */ import_react29.default.createElement("img", { src: companyLogoSrc, alt: "Company Logo", className: "h-6 object-contain opacity-90" })), /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react29.default.createElement("span", { className: "text-[11px] text-white/60 tracking-widest" }, "Card Number"), /* @__PURE__ */ import_react29.default.createElement("span", { className: "text-[18px] text-white tracking-widest font-light" }, cardNumber)), networkLogoSrc && /* @__PURE__ */ import_react29.default.createElement("img", { src: networkLogoSrc, alt: "Network Logo", className: "h-10 object-contain opacity-90" })))
|
|
1686
|
+
),
|
|
1687
|
+
/* @__PURE__ */ import_react29.default.createElement(
|
|
1688
|
+
"div",
|
|
1689
|
+
{
|
|
1690
|
+
className: "absolute inset-0 w-full h-full rounded-2xl overflow-hidden shadow-xl",
|
|
1691
|
+
style: {
|
|
1692
|
+
backfaceVisibility: "hidden",
|
|
1693
|
+
transform: "rotateY(180deg)"
|
|
1694
|
+
}
|
|
1695
|
+
},
|
|
1696
|
+
/* @__PURE__ */ import_react29.default.createElement(
|
|
1697
|
+
"div",
|
|
1698
|
+
{
|
|
1699
|
+
className: "absolute inset-0 bg-cover bg-center",
|
|
1700
|
+
style: { backgroundImage: `url(${cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
1701
|
+
}
|
|
1702
|
+
),
|
|
1703
|
+
/* @__PURE__ */ import_react29.default.createElement("div", { className: "absolute top-6 left-0 right-0 h-10 bg-black/80 w-full" }),
|
|
1704
|
+
/* @__PURE__ */ import_react29.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-end" }, /* @__PURE__ */ import_react29.default.createElement("div", { className: "w-full text-center mb-6" }, /* @__PURE__ */ import_react29.default.createElement("span", { className: "text-white text-3xl font-serif italic tracking-wide opacity-90" }, cardHolderName)), /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex justify-between w-full max-w-[80%]" }, /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react29.default.createElement("span", { className: "text-[11px] text-white/60 tracking-widest" }, "Expiry"), /* @__PURE__ */ import_react29.default.createElement("span", { className: "text-[16px] text-white font-light" }, expiry)), /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react29.default.createElement("span", { className: "text-[11px] text-white/60 tracking-widest" }, "CVV"), /* @__PURE__ */ import_react29.default.createElement("span", { className: "text-[16px] text-white font-light" }, cvv))))
|
|
1705
|
+
)
|
|
1706
|
+
)), /* @__PURE__ */ import_react29.default.createElement("p", { className: "text-xs text-neutral-400 mb-6" }, "Tap to flip card"), /* @__PURE__ */ import_react29.default.createElement("div", { className: "w-full px-4 flex flex-col gap-4" }, /* @__PURE__ */ import_react29.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react29.default.createElement(
|
|
1707
|
+
MenuRow,
|
|
1708
|
+
{
|
|
1709
|
+
icon: import_core_free_icons10.EyeIcon,
|
|
1710
|
+
title: "Reveal Information",
|
|
1711
|
+
subtitle: "Show card informations",
|
|
1712
|
+
onClick: onReveal
|
|
1713
|
+
}
|
|
1714
|
+
), /* @__PURE__ */ import_react29.default.createElement(
|
|
1715
|
+
MenuRow,
|
|
1716
|
+
{
|
|
1717
|
+
icon: import_core_free_icons10.SnowIcon,
|
|
1718
|
+
title: "Freeze",
|
|
1719
|
+
subtitle: "Freeze & Unfreeze card",
|
|
1720
|
+
onClick: onFreeze
|
|
1721
|
+
}
|
|
1722
|
+
), /* @__PURE__ */ import_react29.default.createElement(
|
|
1723
|
+
MenuRow,
|
|
1724
|
+
{
|
|
1725
|
+
icon: import_core_free_icons10.Settings02Icon,
|
|
1726
|
+
title: "Set Limits",
|
|
1727
|
+
subtitle: "Set card limits",
|
|
1728
|
+
onClick: onSetLimits,
|
|
1729
|
+
isLast: true
|
|
1730
|
+
}
|
|
1731
|
+
)), /* @__PURE__ */ import_react29.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react29.default.createElement(
|
|
1732
|
+
MenuRow,
|
|
1733
|
+
{
|
|
1734
|
+
icon: import_core_free_icons10.Delete02Icon,
|
|
1735
|
+
title: "Delete card",
|
|
1736
|
+
subtitle: "Permanently delete card",
|
|
1737
|
+
onClick: onDelete,
|
|
1738
|
+
isLast: true
|
|
1739
|
+
}
|
|
1740
|
+
))));
|
|
1741
|
+
};
|
|
1742
|
+
var MenuRow = ({ icon, title, subtitle, onClick, iconColor = "text-black", titleColor = "text-black", isLast = false }) => /* @__PURE__ */ import_react29.default.createElement(
|
|
1743
|
+
"div",
|
|
1744
|
+
{
|
|
1745
|
+
onClick,
|
|
1746
|
+
className: `flex items-center p-4 cursor-pointer hover:bg-neutral-50 transition-colors ${!isLast ? "border-b border-neutral-100" : ""}`
|
|
1747
|
+
},
|
|
1748
|
+
/* @__PURE__ */ import_react29.default.createElement("div", { className: "w-10 h-10 rounded-full bg-neutral-100 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react29.default.createElement(import_react30.HugeiconsIcon, { icon, size: 20, className: iconColor })),
|
|
1749
|
+
/* @__PURE__ */ import_react29.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react29.default.createElement("p", { className: `text-[15px] font-medium truncate ${titleColor}` }, title), /* @__PURE__ */ import_react29.default.createElement("p", { className: "text-[13px] text-neutral-500 truncate" }, subtitle)),
|
|
1750
|
+
/* @__PURE__ */ import_react29.default.createElement(import_react30.HugeiconsIcon, { icon: import_core_free_icons10.ArrowRight01Icon, size: 20, className: "text-neutral-400 shrink-0 ml-2" })
|
|
1751
|
+
);
|
|
1752
|
+
|
|
1753
|
+
// src/components/UniversalProfilePage.tsx
|
|
1754
|
+
var import_react31 = __toESM(require("react"));
|
|
1755
|
+
var import_react32 = require("@hugeicons/react");
|
|
1756
|
+
var import_core_free_icons11 = require("@hugeicons/core-free-icons");
|
|
1757
|
+
var UniversalProfilePage = ({
|
|
1758
|
+
avatarSrc,
|
|
1759
|
+
roleName,
|
|
1760
|
+
memberSince,
|
|
1761
|
+
onAccountTap,
|
|
1762
|
+
onSecurityTap,
|
|
1763
|
+
onNotificationsTap,
|
|
1764
|
+
onHelpTap,
|
|
1765
|
+
onVerificationsTap,
|
|
1766
|
+
onExportTap,
|
|
1767
|
+
onLogoutTap,
|
|
1768
|
+
onDeleteTap
|
|
1769
|
+
}) => {
|
|
1770
|
+
return /* @__PURE__ */ import_react31.default.createElement("div", { className: "w-full max-w-md mx-auto flex flex-col items-center animate-in fade-in duration-300 pb-12" }, /* @__PURE__ */ import_react31.default.createElement("div", { className: "pt-8 pb-4 flex flex-col items-center" }, /* @__PURE__ */ import_react31.default.createElement("div", { className: "w-24 h-24 rounded-full bg-white p-1 mb-4 shadow-sm flex items-center justify-center" }, /* @__PURE__ */ import_react31.default.createElement("div", { className: "w-full h-full rounded-full overflow-hidden bg-neutral-100 flex items-center justify-center" }, avatarSrc ? /* @__PURE__ */ import_react31.default.createElement(
|
|
1771
|
+
"img",
|
|
1772
|
+
{
|
|
1773
|
+
src: avatarSrc,
|
|
1774
|
+
alt: "User Avatar",
|
|
1775
|
+
className: "w-full h-full object-cover"
|
|
1776
|
+
}
|
|
1777
|
+
) : /* @__PURE__ */ import_react31.default.createElement(import_react32.HugeiconsIcon, { icon: import_core_free_icons11.UserIcon, size: 40, className: "text-neutral-300" }))), /* @__PURE__ */ import_react31.default.createElement("div", { className: "bg-white rounded-full px-5 py-2 flex items-center justify-center gap-2 shadow-sm mb-3" }, /* @__PURE__ */ import_react31.default.createElement("span", { className: "text-[14px] font-medium text-black" }, roleName), /* @__PURE__ */ import_react31.default.createElement(import_react32.HugeiconsIcon, { icon: import_core_free_icons11.ArrowRight01Icon, size: 16, className: "text-neutral-400" })), /* @__PURE__ */ import_react31.default.createElement("span", { className: "text-[12px] text-neutral-500" }, memberSince)), /* @__PURE__ */ import_react31.default.createElement("div", { className: "w-full px-4 flex flex-col gap-4 mt-2" }, /* @__PURE__ */ import_react31.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden shadow-sm" }, /* @__PURE__ */ import_react31.default.createElement(
|
|
1778
|
+
MenuRow2,
|
|
1779
|
+
{
|
|
1780
|
+
icon: import_core_free_icons11.UserIcon,
|
|
1781
|
+
title: "Account",
|
|
1782
|
+
subtitle: "Your account details",
|
|
1783
|
+
onClick: onAccountTap
|
|
1784
|
+
}
|
|
1785
|
+
), /* @__PURE__ */ import_react31.default.createElement(
|
|
1786
|
+
MenuRow2,
|
|
1787
|
+
{
|
|
1788
|
+
icon: import_core_free_icons11.LockKeyIcon,
|
|
1789
|
+
title: "Security",
|
|
1790
|
+
subtitle: "2FA & authentication",
|
|
1791
|
+
onClick: onSecurityTap
|
|
1792
|
+
}
|
|
1793
|
+
), /* @__PURE__ */ import_react31.default.createElement(
|
|
1794
|
+
MenuRow2,
|
|
1795
|
+
{
|
|
1796
|
+
icon: import_core_free_icons11.Notification03Icon,
|
|
1797
|
+
title: "Notifications",
|
|
1798
|
+
subtitle: "Manage notifications",
|
|
1799
|
+
onClick: onNotificationsTap
|
|
1800
|
+
}
|
|
1801
|
+
), /* @__PURE__ */ import_react31.default.createElement(
|
|
1802
|
+
MenuRow2,
|
|
1803
|
+
{
|
|
1804
|
+
icon: import_core_free_icons11.HelpCircleIcon,
|
|
1805
|
+
title: "Get Help",
|
|
1806
|
+
subtitle: "24/7 Support",
|
|
1807
|
+
onClick: onHelpTap,
|
|
1808
|
+
isLast: true
|
|
1809
|
+
}
|
|
1810
|
+
)), /* @__PURE__ */ import_react31.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden shadow-sm" }, /* @__PURE__ */ import_react31.default.createElement(
|
|
1811
|
+
MenuRow2,
|
|
1812
|
+
{
|
|
1813
|
+
icon: import_core_free_icons11.Shield01Icon,
|
|
1814
|
+
title: "Verifications",
|
|
1815
|
+
subtitle: "Account Verifications",
|
|
1816
|
+
onClick: onVerificationsTap
|
|
1817
|
+
}
|
|
1818
|
+
), /* @__PURE__ */ import_react31.default.createElement(
|
|
1819
|
+
MenuRow2,
|
|
1820
|
+
{
|
|
1821
|
+
icon: import_core_free_icons11.Download04Icon,
|
|
1822
|
+
title: "Export Account",
|
|
1823
|
+
subtitle: "Transfer your account",
|
|
1824
|
+
onClick: onExportTap
|
|
1825
|
+
}
|
|
1826
|
+
), /* @__PURE__ */ import_react31.default.createElement(
|
|
1827
|
+
MenuRow2,
|
|
1828
|
+
{
|
|
1829
|
+
icon: import_core_free_icons11.Logout03Icon,
|
|
1830
|
+
title: "LogOut",
|
|
1831
|
+
subtitle: "End your session",
|
|
1832
|
+
onClick: onLogoutTap,
|
|
1833
|
+
isLast: true
|
|
1834
|
+
}
|
|
1835
|
+
)), /* @__PURE__ */ import_react31.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden shadow-sm mb-4" }, /* @__PURE__ */ import_react31.default.createElement(
|
|
1836
|
+
MenuRow2,
|
|
1837
|
+
{
|
|
1838
|
+
icon: import_core_free_icons11.Delete02Icon,
|
|
1839
|
+
title: "Delete Account",
|
|
1840
|
+
subtitle: "Remove account",
|
|
1841
|
+
onClick: onDeleteTap,
|
|
1842
|
+
isLast: true
|
|
1843
|
+
}
|
|
1844
|
+
))));
|
|
1845
|
+
};
|
|
1846
|
+
var MenuRow2 = ({ icon, title, subtitle, onClick, iconColor = "text-black", titleColor = "text-black", isLast = false }) => /* @__PURE__ */ import_react31.default.createElement(
|
|
1847
|
+
"div",
|
|
1848
|
+
{
|
|
1849
|
+
onClick,
|
|
1850
|
+
className: `flex items-center p-4 cursor-pointer hover:bg-neutral-50 transition-colors ${!isLast ? "border-b border-neutral-100" : ""}`
|
|
1851
|
+
},
|
|
1852
|
+
/* @__PURE__ */ import_react31.default.createElement("div", { className: "w-10 h-10 rounded-full bg-neutral-100 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react31.default.createElement(import_react32.HugeiconsIcon, { icon, size: 20, className: iconColor })),
|
|
1853
|
+
/* @__PURE__ */ import_react31.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react31.default.createElement("p", { className: `text-[15px] font-medium truncate ${titleColor}` }, title), /* @__PURE__ */ import_react31.default.createElement("p", { className: "text-[13px] text-neutral-500 truncate" }, subtitle)),
|
|
1854
|
+
/* @__PURE__ */ import_react31.default.createElement(import_react32.HugeiconsIcon, { icon: import_core_free_icons11.ArrowRight01Icon, size: 20, className: "text-neutral-400 shrink-0 ml-2" })
|
|
1855
|
+
);
|
|
1856
|
+
|
|
1857
|
+
// src/components/HeroSection.tsx
|
|
1858
|
+
var import_react34 = __toESM(require("react"));
|
|
1859
|
+
var import_link5 = __toESM(require("next/link"));
|
|
1860
|
+
var import_image2 = __toESM(require("next/image"));
|
|
1861
|
+
|
|
464
1862
|
// src/components/WaitlistDialog.tsx
|
|
1863
|
+
var import_react33 = __toESM(require("react"));
|
|
1864
|
+
var import_react_hot_toast7 = require("react-hot-toast");
|
|
465
1865
|
var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
466
|
-
const [email, setEmail] = (0,
|
|
467
|
-
const [isLoading, setIsLoading] = (0,
|
|
1866
|
+
const [email, setEmail] = (0, import_react33.useState)("");
|
|
1867
|
+
const [isLoading, setIsLoading] = (0, import_react33.useState)(false);
|
|
468
1868
|
if (!isOpen) return null;
|
|
469
1869
|
const handleSubmit = async (e) => {
|
|
470
1870
|
e.preventDefault();
|
|
471
1871
|
if (!email || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) {
|
|
472
|
-
|
|
1872
|
+
import_react_hot_toast7.toast.error("Please enter a valid email address.");
|
|
473
1873
|
return;
|
|
474
1874
|
}
|
|
475
1875
|
setIsLoading(true);
|
|
@@ -483,24 +1883,24 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
483
1883
|
});
|
|
484
1884
|
const data = await response.json();
|
|
485
1885
|
if (response.ok && data.success) {
|
|
486
|
-
|
|
1886
|
+
import_react_hot_toast7.toast.success(data.message || "You've been added to the waitlist!");
|
|
487
1887
|
setEmail("");
|
|
488
1888
|
onClose();
|
|
489
1889
|
} else {
|
|
490
|
-
|
|
1890
|
+
import_react_hot_toast7.toast.error(data.error || "Something went wrong. Please try again.");
|
|
491
1891
|
}
|
|
492
1892
|
} catch (error) {
|
|
493
|
-
|
|
1893
|
+
import_react_hot_toast7.toast.error("Network error. Please check your connection.");
|
|
494
1894
|
} finally {
|
|
495
1895
|
setIsLoading(false);
|
|
496
1896
|
}
|
|
497
1897
|
};
|
|
498
|
-
return /* @__PURE__ */
|
|
1898
|
+
return /* @__PURE__ */ import_react33.default.createElement("div", { className: "fixed inset-0 z-100 flex items-center justify-center p-4 bg-black/40" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "absolute inset-0", onClick: !isLoading ? onClose : void 0 }), /* @__PURE__ */ import_react33.default.createElement(
|
|
499
1899
|
"div",
|
|
500
1900
|
{
|
|
501
1901
|
className: "w-full max-w-md bg-white rounded-2xl shadow-2xl overflow-hidden relative z-10 animate-in fade-in zoom-in-95 duration-200"
|
|
502
1902
|
},
|
|
503
|
-
/* @__PURE__ */
|
|
1903
|
+
/* @__PURE__ */ import_react33.default.createElement(
|
|
504
1904
|
"button",
|
|
505
1905
|
{
|
|
506
1906
|
onClick: onClose,
|
|
@@ -508,7 +1908,7 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
508
1908
|
className: "absolute top-4 right-4 p-2 text-neutral-700 hover:text-neutral-400 transition-colors disabled:opacity-50 outline-none",
|
|
509
1909
|
"aria-label": "Close dialog"
|
|
510
1910
|
},
|
|
511
|
-
/* @__PURE__ */
|
|
1911
|
+
/* @__PURE__ */ import_react33.default.createElement(
|
|
512
1912
|
"svg",
|
|
513
1913
|
{
|
|
514
1914
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -521,11 +1921,11 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
521
1921
|
strokeLinecap: "round",
|
|
522
1922
|
strokeLinejoin: "round"
|
|
523
1923
|
},
|
|
524
|
-
/* @__PURE__ */
|
|
525
|
-
/* @__PURE__ */
|
|
1924
|
+
/* @__PURE__ */ import_react33.default.createElement("path", { d: "M18 6 6 18" }),
|
|
1925
|
+
/* @__PURE__ */ import_react33.default.createElement("path", { d: "m6 6 12 12" })
|
|
526
1926
|
)
|
|
527
1927
|
),
|
|
528
|
-
/* @__PURE__ */
|
|
1928
|
+
/* @__PURE__ */ import_react33.default.createElement("div", { className: "p-6 sm:p-8" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "mb-8 mt-2" }, /* @__PURE__ */ import_react33.default.createElement("h2", { className: "text-2xl text-black tracking-tight mb-2" }, "Join the Waitlist"), /* @__PURE__ */ import_react33.default.createElement("p", { className: "text-[13px] text-neutral-500 leading-relaxed" }, "Be the first to experience the future of natural language computing. Secure your early access spot today.")), /* @__PURE__ */ import_react33.default.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col gap-8" }, /* @__PURE__ */ import_react33.default.createElement(
|
|
529
1929
|
TextInput,
|
|
530
1930
|
{
|
|
531
1931
|
label: "Email ID",
|
|
@@ -535,7 +1935,7 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
535
1935
|
placeholder: "name@example.com",
|
|
536
1936
|
disabled: isLoading
|
|
537
1937
|
}
|
|
538
|
-
), /* @__PURE__ */
|
|
1938
|
+
), /* @__PURE__ */ import_react33.default.createElement(
|
|
539
1939
|
ThreeDActionButton,
|
|
540
1940
|
{
|
|
541
1941
|
type: "submit",
|
|
@@ -568,10 +1968,10 @@ var HeroSection = ({
|
|
|
568
1968
|
bgImageSrc,
|
|
569
1969
|
isWaitlist = false
|
|
570
1970
|
}) => {
|
|
571
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
572
|
-
const [isWaitlistOpen, setIsWaitlistOpen] = (0,
|
|
573
|
-
const titleRef = (0,
|
|
574
|
-
(0,
|
|
1971
|
+
const [isAnimating, setIsAnimating] = (0, import_react34.useState)(false);
|
|
1972
|
+
const [isWaitlistOpen, setIsWaitlistOpen] = (0, import_react34.useState)(false);
|
|
1973
|
+
const titleRef = (0, import_react34.useRef)(null);
|
|
1974
|
+
(0, import_react34.useEffect)(() => {
|
|
575
1975
|
const observer = new IntersectionObserver(
|
|
576
1976
|
([entry]) => {
|
|
577
1977
|
if (entry.isIntersecting) {
|
|
@@ -593,7 +1993,7 @@ var HeroSection = ({
|
|
|
593
1993
|
setIsWaitlistOpen(true);
|
|
594
1994
|
}
|
|
595
1995
|
};
|
|
596
|
-
return /* @__PURE__ */
|
|
1996
|
+
return /* @__PURE__ */ import_react34.default.createElement("div", { className: "w-screen min-h-screen flex justify-center items-center p-4" }, /* @__PURE__ */ import_react34.default.createElement("section", { className: "relative h-[95vh] w-full overflow-hidden rounded-2xl " }, bgVideoSrc ? /* @__PURE__ */ import_react34.default.createElement(
|
|
597
1997
|
"video",
|
|
598
1998
|
{
|
|
599
1999
|
src: bgVideoSrc,
|
|
@@ -604,7 +2004,7 @@ var HeroSection = ({
|
|
|
604
2004
|
playsInline: true,
|
|
605
2005
|
className: "absolute inset-0 h-full w-full object-cover z-0"
|
|
606
2006
|
}
|
|
607
|
-
) : bgImageSrc ? /* @__PURE__ */
|
|
2007
|
+
) : bgImageSrc ? /* @__PURE__ */ import_react34.default.createElement(
|
|
608
2008
|
import_image2.default,
|
|
609
2009
|
{
|
|
610
2010
|
src: bgImageSrc,
|
|
@@ -613,7 +2013,7 @@ var HeroSection = ({
|
|
|
613
2013
|
priority: true,
|
|
614
2014
|
className: "absolute inset-0 h-full w-full object-cover z-0"
|
|
615
2015
|
}
|
|
616
|
-
) : null, /* @__PURE__ */
|
|
2016
|
+
) : null, /* @__PURE__ */ import_react34.default.createElement(
|
|
617
2017
|
"div",
|
|
618
2018
|
{
|
|
619
2019
|
className: "pointer-events-none absolute inset-0 z-10 opacity-[0.7] mix-blend-overlay",
|
|
@@ -621,31 +2021,31 @@ var HeroSection = ({
|
|
|
621
2021
|
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")`
|
|
622
2022
|
}
|
|
623
2023
|
}
|
|
624
|
-
), /* @__PURE__ */
|
|
2024
|
+
), /* @__PURE__ */ import_react34.default.createElement("div", { className: "pointer-events-none absolute inset-0 bg-linear-to-b from-black/30 via-transparent to-black/80 z-10" }), /* @__PURE__ */ import_react34.default.createElement("div", { className: "absolute bottom-0 left-0 right-0 px-4 pb-4 sm:px-6 md:px-10 z-20" }, /* @__PURE__ */ import_react34.default.createElement("div", { className: "grid grid-cols-12 items-end gap-4" }, /* @__PURE__ */ import_react34.default.createElement("div", { className: "col-span-12 lg:col-span-8" }, /* @__PURE__ */ import_react34.default.createElement(
|
|
625
2025
|
"h1",
|
|
626
2026
|
{
|
|
627
2027
|
ref: titleRef,
|
|
628
2028
|
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]"
|
|
629
2029
|
},
|
|
630
|
-
/* @__PURE__ */
|
|
631
|
-
)), /* @__PURE__ */
|
|
632
|
-
/* @__PURE__ */
|
|
633
|
-
|
|
2030
|
+
/* @__PURE__ */ import_react34.default.createElement("div", { className: "inline-flex flex-wrap" }, /* @__PURE__ */ import_react34.default.createElement("span", { className: `inline-block relative transition-all duration-1000 ${isAnimating ? "opacity-100 translate-y-0" : "opacity-0 translate-y-10"}` }, titlePrefix, titlePrefix && /* @__PURE__ */ import_react34.default.createElement("br", null), highlightText, /* @__PURE__ */ import_react34.default.createElement("span", { className: "absolute top-[0.65em] right-[-0.3em] text-[0.31em] text-[#ffffff]/70" }, "*")))
|
|
2031
|
+
)), /* @__PURE__ */ import_react34.default.createElement("div", { className: "col-span-12 flex flex-col gap-5 pb-6 lg:col-span-4 lg:pb-10" }, subtitle && /* @__PURE__ */ import_react34.default.createElement("p", { className: "text-xs text-[#ffffff]/70 sm:text-sm md:text-base leading-[1.2] max-w-md transition-opacity duration-1000 delay-300" }, subtitle), /* @__PURE__ */ import_react34.default.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!
|
|
2032
|
+
/* @__PURE__ */ import_react34.default.createElement(
|
|
2033
|
+
import_link5.default,
|
|
634
2034
|
{
|
|
635
2035
|
href: isWaitlist ? "#" : ctaHref || "#",
|
|
636
2036
|
onClick: handleCtaClick,
|
|
637
2037
|
className: "group inline-flex h-10 items-center gap-2 self-start rounded-full bg-[#ffffff] pl-5 pr-1 text-xs text-black transition-all hover:gap-3"
|
|
638
2038
|
},
|
|
639
2039
|
ctaText,
|
|
640
|
-
/* @__PURE__ */
|
|
641
|
-
), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */
|
|
642
|
-
|
|
2040
|
+
/* @__PURE__ */ import_react34.default.createElement("span", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-black transition-transform group-hover:scale-110" }, /* @__PURE__ */ import_react34.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "lucide lucide-arrow-right h-4 w-4 text-[#ffffff]" }, /* @__PURE__ */ import_react34.default.createElement("path", { d: "M5 12h14" }), /* @__PURE__ */ import_react34.default.createElement("path", { d: "m12 5 7 7-7 7" })))
|
|
2041
|
+
), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react34.default.createElement(
|
|
2042
|
+
import_link5.default,
|
|
643
2043
|
{
|
|
644
2044
|
href: secondaryCtaHref,
|
|
645
2045
|
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"
|
|
646
2046
|
},
|
|
647
2047
|
secondaryCtaText
|
|
648
|
-
)), showApps && appLogos && appLogos.length > 0 && /* @__PURE__ */
|
|
2048
|
+
)), showApps && appLogos && appLogos.length > 0 && /* @__PURE__ */ import_react34.default.createElement("div", { className: "flex flex-col gap-3 mt-4" }, appsText && /* @__PURE__ */ import_react34.default.createElement("span", { className: "text-[10px] tracking-widest uppercase text-[#ffffff]/50 " }, appsText), /* @__PURE__ */ import_react34.default.createElement("div", { className: "flex items-center gap-4" }, appLogos.map((logo, idx) => /* @__PURE__ */ import_react34.default.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__ */ import_react34.default.createElement(
|
|
649
2049
|
import_image2.default,
|
|
650
2050
|
{
|
|
651
2051
|
src: logo.src,
|
|
@@ -654,7 +2054,7 @@ var HeroSection = ({
|
|
|
654
2054
|
height: 28,
|
|
655
2055
|
className: "object-contain"
|
|
656
2056
|
}
|
|
657
|
-
))))))))), /* @__PURE__ */
|
|
2057
|
+
))))))))), /* @__PURE__ */ import_react34.default.createElement(
|
|
658
2058
|
WaitlistDialog,
|
|
659
2059
|
{
|
|
660
2060
|
isOpen: isWaitlistOpen,
|
|
@@ -664,12 +2064,12 @@ var HeroSection = ({
|
|
|
664
2064
|
};
|
|
665
2065
|
|
|
666
2066
|
// src/components/AppBento2.tsx
|
|
667
|
-
var
|
|
668
|
-
var
|
|
2067
|
+
var import_react35 = __toESM(require("react"));
|
|
2068
|
+
var import_react36 = require("@hugeicons/react");
|
|
669
2069
|
var AppBento2 = ({ tagline, headline, features }) => {
|
|
670
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
671
|
-
const titleRef = (0,
|
|
672
|
-
(0,
|
|
2070
|
+
const [isAnimating, setIsAnimating] = (0, import_react35.useState)(false);
|
|
2071
|
+
const titleRef = (0, import_react35.useRef)(null);
|
|
2072
|
+
(0, import_react35.useEffect)(() => {
|
|
673
2073
|
const observer = new IntersectionObserver(
|
|
674
2074
|
([entry]) => {
|
|
675
2075
|
if (entry.isIntersecting) {
|
|
@@ -687,7 +2087,7 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
687
2087
|
}
|
|
688
2088
|
return () => observer.disconnect();
|
|
689
2089
|
}, []);
|
|
690
|
-
return /* @__PURE__ */
|
|
2090
|
+
return /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full py-16" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full flex justify-center px-4" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "relative overflow-hidden mb-12 text-left" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 block mb-4 " }, tagline), /* @__PURE__ */ import_react35.default.createElement(
|
|
691
2091
|
"h2",
|
|
692
2092
|
{
|
|
693
2093
|
ref: titleRef,
|
|
@@ -695,7 +2095,7 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
695
2095
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
696
2096
|
},
|
|
697
2097
|
headline
|
|
698
|
-
))), /* @__PURE__ */
|
|
2098
|
+
))), /* @__PURE__ */ import_react35.default.createElement("div", { className: "grid grid-cols-1 lg:grid-cols-6 gap-6" }, features.map((f, i) => {
|
|
699
2099
|
const isWhite = i === 0;
|
|
700
2100
|
const isBlack = i === 1;
|
|
701
2101
|
const isNeutral = i === 2;
|
|
@@ -717,36 +2117,36 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
717
2117
|
const textColor = isBlack ? "text-white" : "text-black";
|
|
718
2118
|
const subTextColor = isBlack ? "text-neutral-300" : "text-neutral-600";
|
|
719
2119
|
const labelColor = isBlack ? "text-neutral-400" : "text-neutral-500";
|
|
720
|
-
return /* @__PURE__ */
|
|
2120
|
+
return /* @__PURE__ */ import_react35.default.createElement(
|
|
721
2121
|
"div",
|
|
722
2122
|
{
|
|
723
2123
|
key: i,
|
|
724
2124
|
className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-75 transition-all duration-500 group text-left ${getBgStyle()} ${f.size}`,
|
|
725
2125
|
style: { boxShadow: getShadowStyle() }
|
|
726
2126
|
},
|
|
727
|
-
/* @__PURE__ */
|
|
2127
|
+
/* @__PURE__ */ import_react35.default.createElement(
|
|
728
2128
|
"div",
|
|
729
2129
|
{
|
|
730
2130
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
731
2131
|
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")` }
|
|
732
2132
|
}
|
|
733
2133
|
),
|
|
734
|
-
isBlack && /* @__PURE__ */
|
|
735
|
-
/* @__PURE__ */
|
|
736
|
-
/* @__PURE__ */
|
|
2134
|
+
isBlack && /* @__PURE__ */ import_react35.default.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" }),
|
|
2135
|
+
/* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ import_react35.default.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__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon: f.icon, size: 180 }))),
|
|
2136
|
+
/* @__PURE__ */ import_react35.default.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: `text-[9px] tracking-widest ${labelColor}` }, f.label), /* @__PURE__ */ import_react35.default.createElement("div", { className: `p-2 rounded-full transition-colors ${isBlack ? "bg-white/10" : "bg-white/50 backdrop-blur-sm"}` }, /* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon: f.icon, size: 20, className: textColor }))), /* @__PURE__ */ import_react35.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react35.default.createElement("h3", { className: `text-xl mb-2 tracking-tight ${textColor}` }, f.title), /* @__PURE__ */ import_react35.default.createElement("p", { className: `text-[13px] leading-relaxed max-w-sm ${subTextColor}` }, f.desc)))
|
|
737
2137
|
);
|
|
738
2138
|
})))));
|
|
739
2139
|
};
|
|
740
2140
|
|
|
741
2141
|
// src/components/FeatureScroll.tsx
|
|
742
|
-
var
|
|
2142
|
+
var import_react37 = __toESM(require("react"));
|
|
743
2143
|
var import_image3 = __toESM(require("next/image"));
|
|
744
|
-
var
|
|
745
|
-
var
|
|
2144
|
+
var import_react38 = require("@hugeicons/react");
|
|
2145
|
+
var import_core_free_icons12 = require("@hugeicons/core-free-icons");
|
|
746
2146
|
var FeatureCard = ({ feature, bgImage }) => {
|
|
747
|
-
const [isBgLoading, setIsBgLoading] = (0,
|
|
748
|
-
const [isFgLoading, setIsFgLoading] = (0,
|
|
749
|
-
return /* @__PURE__ */
|
|
2147
|
+
const [isBgLoading, setIsBgLoading] = (0, import_react37.useState)(true);
|
|
2148
|
+
const [isFgLoading, setIsFgLoading] = (0, import_react37.useState)(!!feature.image);
|
|
2149
|
+
return /* @__PURE__ */ import_react37.default.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__ */ import_react37.default.createElement("div", { className: "relative w-full aspect-16/10 bg-neutral-100 rounded-2xl overflow-hidden mb-6 flex items-center justify-center" }, /* @__PURE__ */ import_react37.default.createElement(
|
|
750
2150
|
import_image3.default,
|
|
751
2151
|
{
|
|
752
2152
|
src: bgImage,
|
|
@@ -759,7 +2159,7 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
759
2159
|
${isBgLoading ? "blur-xl scale-110" : "blur-0 scale-100"}
|
|
760
2160
|
`
|
|
761
2161
|
}
|
|
762
|
-
), /* @__PURE__ */
|
|
2162
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
763
2163
|
"div",
|
|
764
2164
|
{
|
|
765
2165
|
className: "absolute inset-0 w-full h-full pointer-events-none z-0 opacity-[0.25] mix-blend-overlay",
|
|
@@ -767,7 +2167,7 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
767
2167
|
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")`
|
|
768
2168
|
}
|
|
769
2169
|
}
|
|
770
|
-
), isFgLoading && feature.image && /* @__PURE__ */
|
|
2170
|
+
), isFgLoading && feature.image && /* @__PURE__ */ import_react37.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-50/50 backdrop-blur-sm transition-opacity duration-300" }, /* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons12.Loading03Icon, size: 32, className: "animate-spin text-neutral-400" })), feature.image && /* @__PURE__ */ import_react37.default.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__ */ import_react37.default.createElement(
|
|
771
2171
|
import_image3.default,
|
|
772
2172
|
{
|
|
773
2173
|
src: feature.image,
|
|
@@ -780,12 +2180,12 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
780
2180
|
${isFgLoading ? "opacity-0 blur-xl" : "opacity-100 blur-0"}
|
|
781
2181
|
`
|
|
782
2182
|
}
|
|
783
|
-
))), /* @__PURE__ */
|
|
2183
|
+
))), /* @__PURE__ */ import_react37.default.createElement("div", { className: "flex flex-col text-left pr-4" }, /* @__PURE__ */ import_react37.default.createElement("h3", { className: " text-xl tracking-tight text-black mb-2" }, feature.title), /* @__PURE__ */ import_react37.default.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 max-w-[90%]" }, feature.desc)));
|
|
784
2184
|
};
|
|
785
2185
|
var FeatureScroll = ({ tagline, headline, features }) => {
|
|
786
|
-
const scrollRef = (0,
|
|
787
|
-
const [canScrollLeft, setCanScrollLeft] = (0,
|
|
788
|
-
const [canScrollRight, setCanScrollRight] = (0,
|
|
2186
|
+
const scrollRef = (0, import_react37.useRef)(null);
|
|
2187
|
+
const [canScrollLeft, setCanScrollLeft] = (0, import_react37.useState)(false);
|
|
2188
|
+
const [canScrollRight, setCanScrollRight] = (0, import_react37.useState)(true);
|
|
789
2189
|
const checkScroll = () => {
|
|
790
2190
|
if (scrollRef.current) {
|
|
791
2191
|
const { scrollLeft, scrollWidth, clientWidth } = scrollRef.current;
|
|
@@ -793,7 +2193,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
793
2193
|
setCanScrollRight(scrollLeft < scrollWidth - clientWidth - 2);
|
|
794
2194
|
}
|
|
795
2195
|
};
|
|
796
|
-
(0,
|
|
2196
|
+
(0, import_react37.useEffect)(() => {
|
|
797
2197
|
checkScroll();
|
|
798
2198
|
window.addEventListener("resize", checkScroll);
|
|
799
2199
|
return () => window.removeEventListener("resize", checkScroll);
|
|
@@ -809,7 +2209,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
809
2209
|
"https://retinalabs.company/assets/images/bg_6.avif",
|
|
810
2210
|
"https://retinalabs.company/assets/images/bg_1.avif"
|
|
811
2211
|
];
|
|
812
|
-
return /* @__PURE__ */
|
|
2212
|
+
return /* @__PURE__ */ import_react37.default.createElement("section", { className: "py-24 w-full flex justify-center relative z-10 overflow-hidden" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "flex flex-col md:flex-row md:items-end justify-between gap-6 mb-12" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "relative z-10 text-left" }, /* @__PURE__ */ import_react37.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ import_react37.default.createElement("h2", { className: " text-3xl tracking-tight text-black leading-[1.05]" }, headline)), /* @__PURE__ */ import_react37.default.createElement("div", { className: "hidden md:flex items-center gap-3" }, /* @__PURE__ */ import_react37.default.createElement(
|
|
813
2213
|
"button",
|
|
814
2214
|
{
|
|
815
2215
|
onClick: () => scroll("left"),
|
|
@@ -817,8 +2217,8 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
817
2217
|
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 disabled:hover:border-neutral-200 disabled:hover:text-neutral-500 disabled:cursor-not-allowed transition-all outline-none",
|
|
818
2218
|
"aria-label": "Previous feature"
|
|
819
2219
|
},
|
|
820
|
-
/* @__PURE__ */
|
|
821
|
-
), /* @__PURE__ */
|
|
2220
|
+
/* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons12.ArrowLeft01Icon, size: 20 })
|
|
2221
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
822
2222
|
"button",
|
|
823
2223
|
{
|
|
824
2224
|
onClick: () => scroll("right"),
|
|
@@ -826,57 +2226,57 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
826
2226
|
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 disabled:hover:border-neutral-200 disabled:hover:text-neutral-500 disabled:cursor-not-allowed transition-all outline-none",
|
|
827
2227
|
"aria-label": "Next feature"
|
|
828
2228
|
},
|
|
829
|
-
/* @__PURE__ */
|
|
830
|
-
))), /* @__PURE__ */
|
|
2229
|
+
/* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons12.ArrowRight01Icon, size: 20 })
|
|
2230
|
+
))), /* @__PURE__ */ import_react37.default.createElement(
|
|
831
2231
|
"div",
|
|
832
2232
|
{
|
|
833
2233
|
ref: scrollRef,
|
|
834
2234
|
onScroll: checkScroll,
|
|
835
2235
|
className: "flex gap-6 overflow-x-auto snap-x snap-mandatory [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] scrollbar-none pb-8 -mx-4 px-4 md:mx-0 md:px-0"
|
|
836
2236
|
},
|
|
837
|
-
features.slice(0, 3).map((feature, idx) => /* @__PURE__ */
|
|
838
|
-
), /* @__PURE__ */
|
|
2237
|
+
features.slice(0, 3).map((feature, idx) => /* @__PURE__ */ import_react37.default.createElement(FeatureCard, { key: idx, feature, bgImage: bgImages[idx] }))
|
|
2238
|
+
), /* @__PURE__ */ import_react37.default.createElement("div", { className: "flex md:hidden items-center justify-center gap-4 mt-2" }, /* @__PURE__ */ import_react37.default.createElement(
|
|
839
2239
|
"button",
|
|
840
2240
|
{
|
|
841
2241
|
onClick: () => scroll("left"),
|
|
842
2242
|
disabled: !canScrollLeft,
|
|
843
2243
|
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 transition-all outline-none"
|
|
844
2244
|
},
|
|
845
|
-
/* @__PURE__ */
|
|
846
|
-
), /* @__PURE__ */
|
|
2245
|
+
/* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons12.ArrowLeft01Icon, size: 20 })
|
|
2246
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
847
2247
|
"button",
|
|
848
2248
|
{
|
|
849
2249
|
onClick: () => scroll("right"),
|
|
850
2250
|
disabled: !canScrollRight,
|
|
851
2251
|
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 transition-all outline-none"
|
|
852
2252
|
},
|
|
853
|
-
/* @__PURE__ */
|
|
2253
|
+
/* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons12.ArrowRight01Icon, size: 20 })
|
|
854
2254
|
))));
|
|
855
2255
|
};
|
|
856
2256
|
|
|
857
2257
|
// src/components/PlatformFeatures.tsx
|
|
858
|
-
var
|
|
859
|
-
var
|
|
2258
|
+
var import_react39 = __toESM(require("react"));
|
|
2259
|
+
var import_react40 = require("@hugeicons/react");
|
|
860
2260
|
var PlatformFeatures = ({
|
|
861
2261
|
tagline,
|
|
862
2262
|
headline,
|
|
863
2263
|
description,
|
|
864
2264
|
features
|
|
865
2265
|
}) => {
|
|
866
|
-
return /* @__PURE__ */
|
|
2266
|
+
return /* @__PURE__ */ import_react39.default.createElement("section", { className: "w-full flex justify-center mb-15 relative z-10" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col items-start mb-16 relative z-10" }, /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ import_react39.default.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.05] mb-6" }, headline), /* @__PURE__ */ import_react39.default.createElement("p", { className: "text-[15px] leading-[1.8] text-neutral-600 max-w-2xl" }, description)), /* @__PURE__ */ import_react39.default.createElement("div", { className: "w-full h-px bg-neutral-100 mb-16", "aria-hidden": "true" }), /* @__PURE__ */ import_react39.default.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__ */ import_react39.default.createElement(
|
|
867
2267
|
"div",
|
|
868
2268
|
{
|
|
869
2269
|
key: idx,
|
|
870
2270
|
className: "flex flex-col group animate-in fade-in slide-in-from-bottom-4 duration-700 fill-mode-both",
|
|
871
2271
|
style: { animationDelay: feature.delay || "0ms" }
|
|
872
2272
|
},
|
|
873
|
-
/* @__PURE__ */
|
|
874
|
-
/* @__PURE__ */
|
|
2273
|
+
/* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-row items-center gap-4 mb-4" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "w-14 h-14 shrink-0 rounded-xl border border-neutral-200 flex items-center justify-center text-neutral-600 transition-colors duration-300" }, /* @__PURE__ */ import_react39.default.createElement(import_react40.HugeiconsIcon, { icon: feature.icon, size: 24 })), /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 mb-0.5" }, feature.label || "CAPABILITY"), /* @__PURE__ */ import_react39.default.createElement("h3", { className: "text-xl tracking-tight text-black" }, feature.title))),
|
|
2274
|
+
/* @__PURE__ */ import_react39.default.createElement("div", null, /* @__PURE__ */ import_react39.default.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 pr-4" }, feature.desc))
|
|
875
2275
|
)))));
|
|
876
2276
|
};
|
|
877
2277
|
|
|
878
2278
|
// src/components/ManagedDocument.tsx
|
|
879
|
-
var
|
|
2279
|
+
var import_react41 = __toESM(require("react"));
|
|
880
2280
|
var ManagedDocument = ({
|
|
881
2281
|
tagline,
|
|
882
2282
|
title,
|
|
@@ -884,9 +2284,9 @@ var ManagedDocument = ({
|
|
|
884
2284
|
contactText,
|
|
885
2285
|
contactEmail
|
|
886
2286
|
}) => {
|
|
887
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
888
|
-
const titleRef = (0,
|
|
889
|
-
(0,
|
|
2287
|
+
const [isAnimating, setIsAnimating] = (0, import_react41.useState)(false);
|
|
2288
|
+
const titleRef = (0, import_react41.useRef)(null);
|
|
2289
|
+
(0, import_react41.useEffect)(() => {
|
|
890
2290
|
const observer = new IntersectionObserver(
|
|
891
2291
|
([entry]) => {
|
|
892
2292
|
if (entry.isIntersecting) {
|
|
@@ -906,7 +2306,7 @@ var ManagedDocument = ({
|
|
|
906
2306
|
}, []);
|
|
907
2307
|
return (
|
|
908
2308
|
// Outer layout wrapper (takes up available space, adds padding)
|
|
909
|
-
/* @__PURE__ */
|
|
2309
|
+
/* @__PURE__ */ import_react41.default.createElement("div", { className: "grow pt-4 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ import_react41.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block " }, tagline), /* @__PURE__ */ import_react41.default.createElement(
|
|
910
2310
|
"h1",
|
|
911
2311
|
{
|
|
912
2312
|
ref: titleRef,
|
|
@@ -914,7 +2314,7 @@ var ManagedDocument = ({
|
|
|
914
2314
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
915
2315
|
},
|
|
916
2316
|
title
|
|
917
|
-
)), sections.map((section, index) => /* @__PURE__ */
|
|
2317
|
+
)), sections.map((section, index) => /* @__PURE__ */ import_react41.default.createElement("div", { key: index, className: "relative px-5 md:px-12 py-8 md:py-10" }, section.heading && /* @__PURE__ */ import_react41.default.createElement("p", { className: " text-[11px] tracking-[0.2em] text-black mb-4 text-left " }, section.heading), section.paragraphs && section.paragraphs.length > 0 && /* @__PURE__ */ import_react41.default.createElement("div", { className: "text-[14px] leading-[1.8] text-neutral-700 space-y-4 text-left " }, section.paragraphs.map((text, pIndex) => /* @__PURE__ */ import_react41.default.createElement("p", { key: pIndex }, text))), section.quote && /* @__PURE__ */ import_react41.default.createElement("div", { className: `border-neutral-100 border rounded-xl p-6 ${section.paragraphs && section.paragraphs.length > 0 ? "mt-6" : ""}` }, /* @__PURE__ */ import_react41.default.createElement("p", { className: "text-neutral-900 text-[14px] md:text-[14px] leading-relaxed" }, '"', section.quote, '"')))), (contactText || contactEmail) && /* @__PURE__ */ import_react41.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ import_react41.default.createElement("p", { className: "text-[11px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ import_react41.default.createElement(
|
|
918
2318
|
"a",
|
|
919
2319
|
{
|
|
920
2320
|
href: `mailto:${contactEmail}`,
|
|
@@ -926,18 +2326,18 @@ var ManagedDocument = ({
|
|
|
926
2326
|
};
|
|
927
2327
|
|
|
928
2328
|
// src/components/ManagedContactBlock.tsx
|
|
929
|
-
var
|
|
930
|
-
var
|
|
2329
|
+
var import_react42 = __toESM(require("react"));
|
|
2330
|
+
var import_react43 = require("@hugeicons/react");
|
|
931
2331
|
var SecureEmail = ({ user, domain, className }) => {
|
|
932
|
-
const [isMounted, setIsMounted] = (0,
|
|
933
|
-
(0,
|
|
2332
|
+
const [isMounted, setIsMounted] = (0, import_react42.useState)(false);
|
|
2333
|
+
(0, import_react42.useEffect)(() => {
|
|
934
2334
|
setIsMounted(true);
|
|
935
2335
|
}, []);
|
|
936
2336
|
if (!isMounted) {
|
|
937
|
-
return /* @__PURE__ */
|
|
2337
|
+
return /* @__PURE__ */ import_react42.default.createElement("span", { className, style: { opacity: 0 } }, "Loading");
|
|
938
2338
|
}
|
|
939
2339
|
const email = `${user}@${domain}`;
|
|
940
|
-
return /* @__PURE__ */
|
|
2340
|
+
return /* @__PURE__ */ import_react42.default.createElement("a", { href: `mailto:${email}`, className }, email);
|
|
941
2341
|
};
|
|
942
2342
|
var ManagedContactBlock = ({
|
|
943
2343
|
tagline,
|
|
@@ -946,7 +2346,7 @@ var ManagedContactBlock = ({
|
|
|
946
2346
|
emails,
|
|
947
2347
|
socials
|
|
948
2348
|
}) => {
|
|
949
|
-
return /* @__PURE__ */
|
|
2349
|
+
return /* @__PURE__ */ import_react42.default.createElement("div", { className: "grow pt-4 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react42.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react42.default.createElement(
|
|
950
2350
|
"div",
|
|
951
2351
|
{
|
|
952
2352
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -955,21 +2355,21 @@ var ManagedContactBlock = ({
|
|
|
955
2355
|
backgroundRepeat: "repeat"
|
|
956
2356
|
}
|
|
957
2357
|
}
|
|
958
|
-
), /* @__PURE__ */
|
|
2358
|
+
), /* @__PURE__ */ import_react42.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react42.default.createElement("div", { className: "relative px-8 md:px-12 py-10" }, tagline && /* @__PURE__ */ import_react42.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block " }, tagline), /* @__PURE__ */ import_react42.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ import_react42.default.createElement("div", { className: "relative px-8 md:px-12 py-8 pb-14" }, /* @__PURE__ */ import_react42.default.createElement("div", { className: "flex flex-wrap gap-12 lg:gap-16 w-full" }, company && /* @__PURE__ */ import_react42.default.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ import_react42.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-black mb-4 " }, "Contact Details"), /* @__PURE__ */ import_react42.default.createElement("div", { className: "space-y-3 text-[13px] text-neutral-600 leading-[1.8]" }, company.name && /* @__PURE__ */ import_react42.default.createElement("p", { className: "text-black" }, company.name), company.lines && company.lines.map((line, idx) => /* @__PURE__ */ import_react42.default.createElement("p", { key: idx }, line)), company.phone && /* @__PURE__ */ import_react42.default.createElement("p", { className: "pt-2" }, /* @__PURE__ */ import_react42.default.createElement(
|
|
959
2359
|
"a",
|
|
960
2360
|
{
|
|
961
2361
|
href: `tel:${company.phone.replace(/\s+/g, "")}`,
|
|
962
2362
|
className: "transition-colors hover:text-black"
|
|
963
2363
|
},
|
|
964
2364
|
company.phone
|
|
965
|
-
)))), emails && emails.length > 0 && /* @__PURE__ */
|
|
2365
|
+
)))), emails && emails.length > 0 && /* @__PURE__ */ import_react42.default.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ import_react42.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-black mb-4 " }, "Email Directory"), /* @__PURE__ */ import_react42.default.createElement("div", { className: "space-y-6 text-[13px]" }, emails.map((email, idx) => /* @__PURE__ */ import_react42.default.createElement("div", { key: idx }, /* @__PURE__ */ import_react42.default.createElement("p", { className: "text-[11px] tracking-[0.2em] mb-1.5 text-neutral-500 " }, email.label), /* @__PURE__ */ import_react42.default.createElement(
|
|
966
2366
|
SecureEmail,
|
|
967
2367
|
{
|
|
968
2368
|
user: email.user,
|
|
969
2369
|
domain: email.domain,
|
|
970
2370
|
className: "text-neutral-600 transition-colors hover:text-black"
|
|
971
2371
|
}
|
|
972
|
-
))))), socials && socials.length > 0 && /* @__PURE__ */
|
|
2372
|
+
))))), socials && socials.length > 0 && /* @__PURE__ */ import_react42.default.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ import_react42.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-black mb-4 " }, "Find Us Online"), /* @__PURE__ */ import_react42.default.createElement("div", { className: "flex flex-col space-y-5 pt-1" }, socials.map((social, idx) => /* @__PURE__ */ import_react42.default.createElement(
|
|
973
2373
|
"a",
|
|
974
2374
|
{
|
|
975
2375
|
key: idx,
|
|
@@ -979,27 +2379,27 @@ var ManagedContactBlock = ({
|
|
|
979
2379
|
className: "flex items-center gap-3 transition-colors group text-neutral-600 hover:text-black",
|
|
980
2380
|
"aria-label": social.label
|
|
981
2381
|
},
|
|
982
|
-
/* @__PURE__ */
|
|
983
|
-
/* @__PURE__ */
|
|
2382
|
+
/* @__PURE__ */ import_react42.default.createElement(import_react43.HugeiconsIcon, { icon: social.icon, size: 18 }),
|
|
2383
|
+
/* @__PURE__ */ import_react42.default.createElement("span", { className: "text-[13px]" }, social.label)
|
|
984
2384
|
)))))))));
|
|
985
2385
|
};
|
|
986
2386
|
|
|
987
2387
|
// src/components/ManagedPricingBlock.tsx
|
|
988
|
-
var
|
|
989
|
-
var
|
|
2388
|
+
var import_react44 = __toESM(require("react"));
|
|
2389
|
+
var import_link6 = __toESM(require("next/link"));
|
|
990
2390
|
var import_image4 = __toESM(require("next/image"));
|
|
991
|
-
var CheckIcon = ({ className = "" }) => /* @__PURE__ */
|
|
992
|
-
var CrossIcon = ({ className = "" }) => /* @__PURE__ */
|
|
2391
|
+
var CheckIcon = ({ className = "" }) => /* @__PURE__ */ import_react44.default.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react44.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "black" }), /* @__PURE__ */ import_react44.default.createElement("path", { d: "M8 12L11 15L16 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
2392
|
+
var CrossIcon = ({ className = "" }) => /* @__PURE__ */ import_react44.default.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react44.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "#F5F5F5" }), /* @__PURE__ */ import_react44.default.createElement("path", { d: "M15 9L9 15M9 9l6 6", stroke: "#D4D4D4", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
993
2393
|
var ManagedPricingBlock = ({
|
|
994
2394
|
tagline,
|
|
995
2395
|
title,
|
|
996
2396
|
plans = [],
|
|
997
2397
|
tabs
|
|
998
2398
|
}) => {
|
|
999
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
1000
|
-
const [activeTabIndex, setActiveTabIndex] = (0,
|
|
1001
|
-
const titleRef = (0,
|
|
1002
|
-
(0,
|
|
2399
|
+
const [isAnimating, setIsAnimating] = (0, import_react44.useState)(false);
|
|
2400
|
+
const [activeTabIndex, setActiveTabIndex] = (0, import_react44.useState)(0);
|
|
2401
|
+
const titleRef = (0, import_react44.useRef)(null);
|
|
2402
|
+
(0, import_react44.useEffect)(() => {
|
|
1003
2403
|
const observer = new IntersectionObserver(
|
|
1004
2404
|
([entry]) => {
|
|
1005
2405
|
if (entry.isIntersecting) {
|
|
@@ -1019,7 +2419,7 @@ var ManagedPricingBlock = ({
|
|
|
1019
2419
|
}, []);
|
|
1020
2420
|
const hasTabs = tabs && tabs.length > 0;
|
|
1021
2421
|
const currentPlans = hasTabs ? tabs[activeTabIndex].plans : plans;
|
|
1022
|
-
return /* @__PURE__ */
|
|
2422
|
+
return /* @__PURE__ */ import_react44.default.createElement("div", { className: "grow pt-10 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react44.default.createElement("div", { className: "w-full max-w-5xl mx-auto flex flex-col items-center" }, /* @__PURE__ */ import_react44.default.createElement("div", { className: "w-full flex flex-col items-center text-center mb-10 sm:mb-12" }, tagline && /* @__PURE__ */ import_react44.default.createElement("span", { className: "text-[9px] tracking-[0.4em] text-black block " }, tagline), /* @__PURE__ */ import_react44.default.createElement(
|
|
1023
2423
|
"h1",
|
|
1024
2424
|
{
|
|
1025
2425
|
ref: titleRef,
|
|
@@ -1027,9 +2427,9 @@ var ManagedPricingBlock = ({
|
|
|
1027
2427
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
1028
2428
|
},
|
|
1029
2429
|
title
|
|
1030
|
-
)), hasTabs && /* @__PURE__ */
|
|
2430
|
+
)), hasTabs && /* @__PURE__ */ import_react44.default.createElement("div", { className: "flex items-center justify-center mb-8 sm:mb-10 w-full animate-in fade-in duration-300 px-2" }, /* @__PURE__ */ import_react44.default.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) => {
|
|
1031
2431
|
const isActive = activeTabIndex === idx;
|
|
1032
|
-
return /* @__PURE__ */
|
|
2432
|
+
return /* @__PURE__ */ import_react44.default.createElement(
|
|
1033
2433
|
"button",
|
|
1034
2434
|
{
|
|
1035
2435
|
key: idx,
|
|
@@ -1038,19 +2438,19 @@ var ManagedPricingBlock = ({
|
|
|
1038
2438
|
},
|
|
1039
2439
|
tab.label
|
|
1040
2440
|
);
|
|
1041
|
-
}))), /* @__PURE__ */
|
|
2441
|
+
}))), /* @__PURE__ */ import_react44.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-3xl animate-in slide-in-from-bottom-2 fade-in duration-500" }, currentPlans.map((plan, planIdx) => /* @__PURE__ */ import_react44.default.createElement(
|
|
1042
2442
|
"div",
|
|
1043
2443
|
{
|
|
1044
2444
|
key: `${activeTabIndex}-${planIdx}`,
|
|
1045
2445
|
className: `bg-white rounded-3xl p-6 flex flex-col relative overflow-hidden transition-all duration-300 ${plan.isPremium ? "" : ""}`
|
|
1046
2446
|
},
|
|
1047
|
-
/* @__PURE__ */
|
|
2447
|
+
/* @__PURE__ */ import_react44.default.createElement("div", { className: "mb-6" }, /* @__PURE__ */ import_react44.default.createElement("span", { className: "text-black text-base block mb-1" }, plan.name), /* @__PURE__ */ import_react44.default.createElement("div", { className: "flex items-baseline gap-1" }, /* @__PURE__ */ import_react44.default.createElement("h3", { className: "text-3xl font-light text-black" }, plan.price), plan.period && /* @__PURE__ */ import_react44.default.createElement("span", { className: "text-xs text-neutral-500" }, plan.period)), /* @__PURE__ */ import_react44.default.createElement("p", { className: "text-xs text-neutral-500 mt-2 min-h-8" }, plan.description), plan.showApps && plan.appLogos && plan.appLogos.length > 0 && /* @__PURE__ */ import_react44.default.createElement("div", { className: "flex items-center gap-2 mt-4" }, plan.appLogos.map((logo, logoIdx) => /* @__PURE__ */ import_react44.default.createElement(
|
|
1048
2448
|
"div",
|
|
1049
2449
|
{
|
|
1050
2450
|
key: logoIdx,
|
|
1051
2451
|
className: "relative w-5 h-5 overflow-hidden flex items-center justify-center shrink-0"
|
|
1052
2452
|
},
|
|
1053
|
-
/* @__PURE__ */
|
|
2453
|
+
/* @__PURE__ */ import_react44.default.createElement(
|
|
1054
2454
|
import_image4.default,
|
|
1055
2455
|
{
|
|
1056
2456
|
src: logo.src,
|
|
@@ -1061,28 +2461,28 @@ var ManagedPricingBlock = ({
|
|
|
1061
2461
|
}
|
|
1062
2462
|
)
|
|
1063
2463
|
)))),
|
|
1064
|
-
plan.isPremium ? /* @__PURE__ */
|
|
1065
|
-
|
|
2464
|
+
plan.isPremium ? /* @__PURE__ */ import_react44.default.createElement(ThreeDButton, { href: plan.ctaHref, className: "mb-6 w-full" }, plan.ctaText) : /* @__PURE__ */ import_react44.default.createElement(
|
|
2465
|
+
import_link6.default,
|
|
1066
2466
|
{
|
|
1067
2467
|
href: plan.ctaHref,
|
|
1068
2468
|
className: "w-full py-2.5 px-5 rounded-full border border-neutral-100 text-center text-black text-xs hover:bg-neutral-50 transition-colors mb-6 outline-none block"
|
|
1069
2469
|
},
|
|
1070
2470
|
plan.ctaText
|
|
1071
2471
|
),
|
|
1072
|
-
/* @__PURE__ */
|
|
2472
|
+
/* @__PURE__ */ import_react44.default.createElement("div", { className: "flex flex-col gap-3" }, plan.features.map((feature, featureIdx) => {
|
|
1073
2473
|
const isAvailable = feature.value !== false;
|
|
1074
2474
|
const valueText = typeof feature.value === "string" ? feature.value : "";
|
|
1075
|
-
return /* @__PURE__ */
|
|
2475
|
+
return /* @__PURE__ */ import_react44.default.createElement("div", { key: featureIdx, className: "flex items-center gap-2.5" }, isAvailable ? /* @__PURE__ */ import_react44.default.createElement(CheckIcon, null) : /* @__PURE__ */ import_react44.default.createElement(CrossIcon, null), /* @__PURE__ */ import_react44.default.createElement("span", { className: `text-xs truncate ${isAvailable ? "text-neutral-800" : "text-neutral-400"}` }, feature.name, valueText && /* @__PURE__ */ import_react44.default.createElement("span", { className: "text-neutral-500 ml-1" }, "(", valueText, ")")));
|
|
1076
2476
|
}))
|
|
1077
2477
|
)))));
|
|
1078
2478
|
};
|
|
1079
2479
|
|
|
1080
2480
|
// src/components/ManagedBoardBlock.tsx
|
|
1081
|
-
var
|
|
2481
|
+
var import_react45 = __toESM(require("react"));
|
|
1082
2482
|
var import_image5 = __toESM(require("next/image"));
|
|
1083
|
-
var
|
|
1084
|
-
var
|
|
1085
|
-
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */
|
|
2483
|
+
var import_react46 = require("@hugeicons/react");
|
|
2484
|
+
var import_core_free_icons13 = require("@hugeicons/core-free-icons");
|
|
2485
|
+
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ import_react45.default.createElement(
|
|
1086
2486
|
"a",
|
|
1087
2487
|
{
|
|
1088
2488
|
href,
|
|
@@ -1091,7 +2491,7 @@ var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ import_r
|
|
|
1091
2491
|
className: "text-neutral-400 hover:text-black transition-colors",
|
|
1092
2492
|
"aria-label": `${name} on ${label}`
|
|
1093
2493
|
},
|
|
1094
|
-
/* @__PURE__ */
|
|
2494
|
+
/* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon, size: 16 })
|
|
1095
2495
|
);
|
|
1096
2496
|
var ManagedBoardBlock = ({
|
|
1097
2497
|
tagline,
|
|
@@ -1100,7 +2500,7 @@ var ManagedBoardBlock = ({
|
|
|
1100
2500
|
contactText,
|
|
1101
2501
|
contactEmail
|
|
1102
2502
|
}) => {
|
|
1103
|
-
return /* @__PURE__ */
|
|
2503
|
+
return /* @__PURE__ */ import_react45.default.createElement("div", { className: "grow pt-4 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "relative w-full mx-auto overflow-hidden max-w-7xl" }, /* @__PURE__ */ import_react45.default.createElement(
|
|
1104
2504
|
"div",
|
|
1105
2505
|
{
|
|
1106
2506
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -1109,7 +2509,7 @@ var ManagedBoardBlock = ({
|
|
|
1109
2509
|
backgroundRepeat: "repeat"
|
|
1110
2510
|
}
|
|
1111
2511
|
}
|
|
1112
|
-
), /* @__PURE__ */
|
|
2512
|
+
), /* @__PURE__ */ import_react45.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ import_react45.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block " }, tagline), /* @__PURE__ */ import_react45.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ import_react45.default.createElement("div", { className: "relative px-5 md:px-12 py-4 md:py-8" }, /* @__PURE__ */ import_react45.default.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__ */ import_react45.default.createElement("div", { key: idx, className: "relative p-6 md:p-8 rounded-2xl bg-white flex flex-col transition-all group" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex items-start space-x-4 md:space-x-5 mb-5 md:mb-6" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "relative w-14 h-14 md:w-16 md:h-16 shrink-0 bg-white overflow-hidden rounded-xl" }, /* @__PURE__ */ import_react45.default.createElement(
|
|
1113
2513
|
import_image5.default,
|
|
1114
2514
|
{
|
|
1115
2515
|
src: member.imageSrc,
|
|
@@ -1118,101 +2518,44 @@ var ManagedBoardBlock = ({
|
|
|
1118
2518
|
sizes: "(max-width: 768px) 56px, 64px",
|
|
1119
2519
|
className: "object-cover grayscale opacity-100 transition-opacity"
|
|
1120
2520
|
}
|
|
1121
|
-
)), /* @__PURE__ */
|
|
2521
|
+
)), /* @__PURE__ */ import_react45.default.createElement("div", { className: "pt-1" }, /* @__PURE__ */ import_react45.default.createElement("h3", { className: " text-[14px] md:text-[15px] text-black tracking-tight" }, member.name), /* @__PURE__ */ import_react45.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 mt-1.5 " }, member.title))), /* @__PURE__ */ import_react45.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 text-left grow mb-8" }, member.bio), /* @__PURE__ */ import_react45.default.createElement("div", { className: "space-y-6 mt-auto" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ import_react45.default.createElement(ThreeDButton, { href: member.website }, "Visit Website")), /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex space-x-4 pt-5" }, member.twitterHandle && member.twitterHandle.length > 0 && /* @__PURE__ */ import_react45.default.createElement(
|
|
1122
2522
|
MemberSocialLink,
|
|
1123
2523
|
{
|
|
1124
2524
|
href: `https://x.com/${member.twitterHandle}`,
|
|
1125
|
-
icon:
|
|
2525
|
+
icon: import_core_free_icons13.TwitterIcon,
|
|
1126
2526
|
label: "X",
|
|
1127
2527
|
name: member.name
|
|
1128
2528
|
}
|
|
1129
|
-
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */
|
|
2529
|
+
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */ import_react45.default.createElement(
|
|
1130
2530
|
MemberSocialLink,
|
|
1131
2531
|
{
|
|
1132
2532
|
href: member.linkedinHandle,
|
|
1133
|
-
icon:
|
|
2533
|
+
icon: import_core_free_icons13.LinkedinIcon,
|
|
1134
2534
|
label: "LinkedIn",
|
|
1135
2535
|
name: member.name
|
|
1136
2536
|
}
|
|
1137
|
-
))))))), (contactText || contactEmail) && /* @__PURE__ */
|
|
2537
|
+
))))))), (contactText || contactEmail) && /* @__PURE__ */ import_react45.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ import_react45.default.createElement("p", { className: "text-[11px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ import_react45.default.createElement("a", { href: `mailto:${contactEmail}`, className: "text-black decoration-black decoration-2 underline-offset-4 ml-1 transition-colors" }, contactEmail))))));
|
|
1138
2538
|
};
|
|
1139
2539
|
|
|
1140
2540
|
// src/components/ManagedNotFoundBlock.tsx
|
|
1141
|
-
var
|
|
2541
|
+
var import_react47 = __toESM(require("react"));
|
|
1142
2542
|
var ManagedNotFoundBlock = ({
|
|
1143
2543
|
title = "404 - Page Not Found",
|
|
1144
2544
|
description = "The page you are looking for does not exist or has been moved."
|
|
1145
2545
|
}) => {
|
|
1146
|
-
return /* @__PURE__ */
|
|
2546
|
+
return /* @__PURE__ */ import_react47.default.createElement("main", { className: "min-h-screen flex items-center justify-center relative z-20 bg-transparent" }, /* @__PURE__ */ import_react47.default.createElement("div", { className: "p-6 w-full max-w-md mx-auto text-center" }, /* @__PURE__ */ import_react47.default.createElement("div", { className: "mb-8 flex justify-center" }, /* @__PURE__ */ import_react47.default.createElement(
|
|
1147
2547
|
"svg",
|
|
1148
2548
|
{
|
|
1149
2549
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1150
2550
|
viewBox: "0 0 24 24",
|
|
1151
2551
|
className: "w-12 h-12 fill-neutral-100"
|
|
1152
2552
|
},
|
|
1153
|
-
/* @__PURE__ */
|
|
1154
|
-
)), /* @__PURE__ */
|
|
1155
|
-
};
|
|
1156
|
-
|
|
1157
|
-
// src/components/PageSpinner.tsx
|
|
1158
|
-
var import_react24 = __toESM(require("react"));
|
|
1159
|
-
var import_react25 = require("@hugeicons/react");
|
|
1160
|
-
var import_core_free_icons4 = require("@hugeicons/core-free-icons");
|
|
1161
|
-
var PageSpinner = ({
|
|
1162
|
-
className = "",
|
|
1163
|
-
iconClassName = "text-black",
|
|
1164
|
-
size = 32
|
|
1165
|
-
}) => {
|
|
1166
|
-
return (
|
|
1167
|
-
// z-[100] ensures it sits above absolute headers and modals
|
|
1168
|
-
/* @__PURE__ */ import_react24.default.createElement("div", { className: `fixed inset-0 z-100 flex flex-col items-center justify-center w-full h-full pointer-events-none ${className}` }, /* @__PURE__ */ import_react24.default.createElement(
|
|
1169
|
-
import_react25.HugeiconsIcon,
|
|
1170
|
-
{
|
|
1171
|
-
icon: import_core_free_icons4.Loading03Icon,
|
|
1172
|
-
size,
|
|
1173
|
-
className: `animate-spin mb-4 ${iconClassName}`
|
|
1174
|
-
}
|
|
1175
|
-
))
|
|
1176
|
-
);
|
|
1177
|
-
};
|
|
1178
|
-
|
|
1179
|
-
// src/components/ManagedToaster.tsx
|
|
1180
|
-
var import_react26 = __toESM(require("react"));
|
|
1181
|
-
var import_react_hot_toast2 = require("react-hot-toast");
|
|
1182
|
-
var ManagedToaster = () => {
|
|
1183
|
-
return /* @__PURE__ */ import_react26.default.createElement(
|
|
1184
|
-
import_react_hot_toast2.Toaster,
|
|
1185
|
-
{
|
|
1186
|
-
position: "top-right",
|
|
1187
|
-
toastOptions: {
|
|
1188
|
-
style: {
|
|
1189
|
-
background: "#171717",
|
|
1190
|
-
color: "#fafafa",
|
|
1191
|
-
fontSize: "11px",
|
|
1192
|
-
padding: "8px 12px",
|
|
1193
|
-
borderRadius: "8px",
|
|
1194
|
-
minWidth: "fit-content",
|
|
1195
|
-
boxShadow: "0 4px 6px -1px rgba(0, 0, 0, 0.5)"
|
|
1196
|
-
},
|
|
1197
|
-
success: {
|
|
1198
|
-
iconTheme: {
|
|
1199
|
-
primary: "#fafafa",
|
|
1200
|
-
secondary: "#171717"
|
|
1201
|
-
}
|
|
1202
|
-
},
|
|
1203
|
-
error: {
|
|
1204
|
-
iconTheme: {
|
|
1205
|
-
primary: "#fafafa",
|
|
1206
|
-
secondary: "#171717"
|
|
1207
|
-
}
|
|
1208
|
-
}
|
|
1209
|
-
}
|
|
1210
|
-
}
|
|
1211
|
-
);
|
|
2553
|
+
/* @__PURE__ */ import_react47.default.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" })
|
|
2554
|
+
)), /* @__PURE__ */ import_react47.default.createElement("h1", { className: " text-xl md:text-3xl text-black tracking-tight mb-4" }, title), /* @__PURE__ */ import_react47.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-12" }, description)));
|
|
1212
2555
|
};
|
|
1213
2556
|
|
|
1214
2557
|
// src/components/ManagedNewsletterSplitBlock.tsx
|
|
1215
|
-
var
|
|
2558
|
+
var import_react48 = __toESM(require("react"));
|
|
1216
2559
|
var import_image6 = __toESM(require("next/image"));
|
|
1217
2560
|
var ManagedNewsletterSplitBlock = ({
|
|
1218
2561
|
tagline,
|
|
@@ -1226,7 +2569,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
1226
2569
|
ctaHref = "/contact",
|
|
1227
2570
|
children
|
|
1228
2571
|
}) => {
|
|
1229
|
-
return /* @__PURE__ */
|
|
2572
|
+
return /* @__PURE__ */ import_react48.default.createElement("div", { className: "grow flex flex-col md:flex-row relative w-full pt-32 md:pt-0" }, /* @__PURE__ */ import_react48.default.createElement("div", { className: "hidden md:block md:w-1/2 relative min-h-screen overflow-hidden" }, /* @__PURE__ */ import_react48.default.createElement(
|
|
1230
2573
|
import_image6.default,
|
|
1231
2574
|
{
|
|
1232
2575
|
src: imageSrc,
|
|
@@ -1236,7 +2579,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
1236
2579
|
className: "object-cover object-top grayscale opacity-60",
|
|
1237
2580
|
quality: 100
|
|
1238
2581
|
}
|
|
1239
|
-
), /* @__PURE__ */
|
|
2582
|
+
), /* @__PURE__ */ import_react48.default.createElement(
|
|
1240
2583
|
"div",
|
|
1241
2584
|
{
|
|
1242
2585
|
className: "absolute inset-0 z-10 pointer-events-none",
|
|
@@ -1244,7 +2587,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
1244
2587
|
background: "linear-gradient(to right, rgba(255,255,255,0) 30%, #ffffff 100%)"
|
|
1245
2588
|
}
|
|
1246
2589
|
}
|
|
1247
|
-
), /* @__PURE__ */
|
|
2590
|
+
), /* @__PURE__ */ import_react48.default.createElement(
|
|
1248
2591
|
"div",
|
|
1249
2592
|
{
|
|
1250
2593
|
className: "absolute inset-x-0 bottom-0 h-40 z-10 pointer-events-none",
|
|
@@ -1252,7 +2595,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
1252
2595
|
background: "linear-gradient(to bottom, rgba(255,255,255,0) 0%, #ffffff 100%)"
|
|
1253
2596
|
}
|
|
1254
2597
|
}
|
|
1255
|
-
)), /* @__PURE__ */
|
|
2598
|
+
)), /* @__PURE__ */ import_react48.default.createElement("div", { className: "w-full md:w-1/2 flex mt-22 flex-col items-center justify-center p-4 md:p-12 relative z-20" }, /* @__PURE__ */ import_react48.default.createElement("div", { className: "relative w-full max-w-lg p-8 md:p-12 text-center md:text-left transition-all duration-700 ease-out" }, /* @__PURE__ */ import_react48.default.createElement(
|
|
1256
2599
|
"div",
|
|
1257
2600
|
{
|
|
1258
2601
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -1261,7 +2604,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
1261
2604
|
backgroundRepeat: "repeat"
|
|
1262
2605
|
}
|
|
1263
2606
|
}
|
|
1264
|
-
), /* @__PURE__ */
|
|
2607
|
+
), /* @__PURE__ */ import_react48.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react48.default.createElement("div", { className: "mb-10 border-b border-neutral-100 pb-8 text-center md:text-left" }, tagline && /* @__PURE__ */ import_react48.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 " }, tagline), /* @__PURE__ */ import_react48.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight mb-4" }, title), subtitle && /* @__PURE__ */ import_react48.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 " }, subtitle)), /* @__PURE__ */ import_react48.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-10 text-center md:text-left" }, description), children && /* @__PURE__ */ import_react48.default.createElement("div", { className: "mb-8 text-left" }, children), /* @__PURE__ */ import_react48.default.createElement("div", { className: "text-center md:text-left mt-10 space-y-6" }, dividerText && /* @__PURE__ */ import_react48.default.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ import_react48.default.createElement("div", { className: "grow h-px bg-neutral-100" }), /* @__PURE__ */ import_react48.default.createElement("span", { className: "shrink mx-4 text-[11px] tracking-[0.2em] text-neutral-400 " }, dividerText), /* @__PURE__ */ import_react48.default.createElement("div", { className: "grow h-px bg-neutral-100" })), ctaText && ctaHref && /* @__PURE__ */ import_react48.default.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ import_react48.default.createElement(
|
|
1265
2608
|
ThreeDButton,
|
|
1266
2609
|
{
|
|
1267
2610
|
href: ctaHref,
|
|
@@ -1272,14 +2615,14 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
1272
2615
|
};
|
|
1273
2616
|
|
|
1274
2617
|
// src/components/PortfolioHero.tsx
|
|
1275
|
-
var
|
|
1276
|
-
var
|
|
2618
|
+
var import_react49 = __toESM(require("react"));
|
|
2619
|
+
var import_link7 = __toESM(require("next/link"));
|
|
1277
2620
|
var import_image7 = __toESM(require("next/image"));
|
|
1278
|
-
var
|
|
1279
|
-
var
|
|
2621
|
+
var import_react50 = require("@hugeicons/react");
|
|
2622
|
+
var import_core_free_icons14 = require("@hugeicons/core-free-icons");
|
|
1280
2623
|
var useScrollAnimation = () => {
|
|
1281
|
-
const elementRef = (0,
|
|
1282
|
-
(0,
|
|
2624
|
+
const elementRef = (0, import_react49.useRef)(null);
|
|
2625
|
+
(0, import_react49.useEffect)(() => {
|
|
1283
2626
|
const el = elementRef.current;
|
|
1284
2627
|
if (!el) return;
|
|
1285
2628
|
const observer = new IntersectionObserver(
|
|
@@ -1315,13 +2658,13 @@ var PortfolioHero = ({
|
|
|
1315
2658
|
secondaryCtaHref
|
|
1316
2659
|
}) => {
|
|
1317
2660
|
const heroContentRef = useScrollAnimation();
|
|
1318
|
-
return /* @__PURE__ */
|
|
2661
|
+
return /* @__PURE__ */ import_react49.default.createElement("section", { className: "pt-44 md:pt-52 pb-16 px-6 md:px-12 flex flex-col relative overflow-hidden z-10 w-full" }, /* @__PURE__ */ import_react49.default.createElement(
|
|
1319
2662
|
"div",
|
|
1320
2663
|
{
|
|
1321
2664
|
ref: heroContentRef,
|
|
1322
2665
|
className: "w-full opacity-0 translate-y-5 transition-all duration-1000 ease-out relative z-10"
|
|
1323
2666
|
},
|
|
1324
|
-
/* @__PURE__ */
|
|
2667
|
+
/* @__PURE__ */ import_react49.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-10" }, /* @__PURE__ */ import_react49.default.createElement("div", { className: "relative w-20 h-20 sm:w-32 sm:h-32 rounded-full overflow-hidden border border-neutral-100 shrink-0 shadow-sm" }, /* @__PURE__ */ import_react49.default.createElement(
|
|
1325
2668
|
import_image7.default,
|
|
1326
2669
|
{
|
|
1327
2670
|
src: imageSrc,
|
|
@@ -1332,7 +2675,7 @@ var PortfolioHero = ({
|
|
|
1332
2675
|
sizes: "(max-width: 640px) 80px, 128px",
|
|
1333
2676
|
quality: 100
|
|
1334
2677
|
}
|
|
1335
|
-
)), /* @__PURE__ */
|
|
2678
|
+
)), /* @__PURE__ */ import_react49.default.createElement("div", { className: "flex flex-col text-left" }, /* @__PURE__ */ import_react49.default.createElement("h1", { className: " text-3xl sm:text-5xl lg:text-6xl tracking-tight text-black leading-none mb-3" }, name), socialLabel && /* @__PURE__ */ import_react49.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 " }, socialLabel), socialLinkText && socialLinkHref && /* @__PURE__ */ import_react49.default.createElement(
|
|
1336
2679
|
"a",
|
|
1337
2680
|
{
|
|
1338
2681
|
href: socialLinkHref,
|
|
@@ -1342,31 +2685,31 @@ var PortfolioHero = ({
|
|
|
1342
2685
|
},
|
|
1343
2686
|
socialLinkText
|
|
1344
2687
|
))),
|
|
1345
|
-
/* @__PURE__ */
|
|
1346
|
-
/* @__PURE__ */
|
|
2688
|
+
/* @__PURE__ */ import_react49.default.createElement("p", { className: "text-[13px] leading-[1.8] max-w-4xl mb-12 text-neutral-600" }, bio),
|
|
2689
|
+
/* @__PURE__ */ import_react49.default.createElement("div", { className: "flex flex-col sm:flex-row gap-4 w-full sm:w-auto" }, primaryCtaText && primaryCtaHref && /* @__PURE__ */ import_react49.default.createElement("div", { className: "w-full sm:w-auto *:w-full" }, /* @__PURE__ */ import_react49.default.createElement(
|
|
1347
2690
|
ThreeDButton,
|
|
1348
2691
|
{
|
|
1349
2692
|
href: primaryCtaHref,
|
|
1350
2693
|
className: "py-3 tracking-widest text-[11px]"
|
|
1351
2694
|
},
|
|
1352
2695
|
primaryCtaText
|
|
1353
|
-
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */
|
|
1354
|
-
|
|
2696
|
+
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react49.default.createElement(
|
|
2697
|
+
import_link7.default,
|
|
1355
2698
|
{
|
|
1356
2699
|
href: secondaryCtaHref,
|
|
1357
2700
|
className: "w-full sm:w-auto inline-flex items-center justify-center gap-3 text-[11px] tracking-[0.2em] rounded-full px-8 py-3.5 bg-neutral-200 transition-colors text-black hover:bg-neutral-200 outline-none"
|
|
1358
2701
|
},
|
|
1359
2702
|
secondaryCtaText,
|
|
1360
|
-
/* @__PURE__ */
|
|
2703
|
+
/* @__PURE__ */ import_react49.default.createElement(import_react50.HugeiconsIcon, { icon: import_core_free_icons14.ArrowRight01Icon, size: 16 })
|
|
1361
2704
|
))
|
|
1362
2705
|
));
|
|
1363
2706
|
};
|
|
1364
2707
|
|
|
1365
2708
|
// src/components/GifFeatureCard.tsx
|
|
1366
|
-
var
|
|
2709
|
+
var import_react51 = __toESM(require("react"));
|
|
1367
2710
|
var import_image8 = __toESM(require("next/image"));
|
|
1368
|
-
var
|
|
1369
|
-
var
|
|
2711
|
+
var import_react52 = require("@hugeicons/react");
|
|
2712
|
+
var import_core_free_icons15 = require("@hugeicons/core-free-icons");
|
|
1370
2713
|
var GifFeatureCard = ({
|
|
1371
2714
|
gifSrc,
|
|
1372
2715
|
title,
|
|
@@ -1374,20 +2717,20 @@ var GifFeatureCard = ({
|
|
|
1374
2717
|
alt = "Feature animation",
|
|
1375
2718
|
className = "aspect-video"
|
|
1376
2719
|
}) => {
|
|
1377
|
-
const [isLoading, setIsLoading] = (0,
|
|
1378
|
-
return /* @__PURE__ */
|
|
1379
|
-
|
|
2720
|
+
const [isLoading, setIsLoading] = (0, import_react51.useState)(true);
|
|
2721
|
+
return /* @__PURE__ */ import_react51.default.createElement("div", { className: `relative w-full bg-black overflow-hidden shadow-2xl ${className}` }, isLoading && /* @__PURE__ */ import_react51.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-black" }, /* @__PURE__ */ import_react51.default.createElement(
|
|
2722
|
+
import_react52.HugeiconsIcon,
|
|
1380
2723
|
{
|
|
1381
|
-
icon:
|
|
2724
|
+
icon: import_core_free_icons15.Loading03Icon,
|
|
1382
2725
|
size: 32,
|
|
1383
2726
|
className: "animate-spin text-white"
|
|
1384
2727
|
}
|
|
1385
|
-
)), /* @__PURE__ */
|
|
2728
|
+
)), /* @__PURE__ */ import_react51.default.createElement(
|
|
1386
2729
|
"div",
|
|
1387
2730
|
{
|
|
1388
2731
|
className: `absolute inset-0 z-0 transition-all duration-1000 ease-out ${isLoading ? "scale-105 blur-2xl opacity-0" : "scale-100 blur-0 opacity-100"}`
|
|
1389
2732
|
},
|
|
1390
|
-
/* @__PURE__ */
|
|
2733
|
+
/* @__PURE__ */ import_react51.default.createElement(
|
|
1391
2734
|
import_image8.default,
|
|
1392
2735
|
{
|
|
1393
2736
|
src: gifSrc,
|
|
@@ -1398,16 +2741,16 @@ var GifFeatureCard = ({
|
|
|
1398
2741
|
className: "object-cover object-center pointer-events-none"
|
|
1399
2742
|
}
|
|
1400
2743
|
)
|
|
1401
|
-
), /* @__PURE__ */
|
|
2744
|
+
), /* @__PURE__ */ import_react51.default.createElement(
|
|
1402
2745
|
"div",
|
|
1403
2746
|
{
|
|
1404
2747
|
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"
|
|
1405
2748
|
}
|
|
1406
|
-
), /* @__PURE__ */
|
|
2749
|
+
), /* @__PURE__ */ import_react51.default.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__ */ import_react51.default.createElement("h3", { className: " text-xl sm:text-2xl md:text-3xl text-white tracking-tight mb-2 sm:mb-3 drop-shadow-md" }, title), subtitle && /* @__PURE__ */ import_react51.default.createElement("p", { className: "text-[13px] sm:text-[15px] leading-relaxed text-neutral-300 max-w-2xl drop-shadow-sm" }, subtitle)));
|
|
1407
2750
|
};
|
|
1408
2751
|
|
|
1409
2752
|
// src/components/MedicalFeatureStatsBlock.tsx
|
|
1410
|
-
var
|
|
2753
|
+
var import_react53 = __toESM(require("react"));
|
|
1411
2754
|
var import_image9 = __toESM(require("next/image"));
|
|
1412
2755
|
var MedicalFeatureStatsBlock = ({
|
|
1413
2756
|
bottomHeadline,
|
|
@@ -1416,9 +2759,9 @@ var MedicalFeatureStatsBlock = ({
|
|
|
1416
2759
|
trustText,
|
|
1417
2760
|
stats
|
|
1418
2761
|
}) => {
|
|
1419
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
1420
|
-
const titleRef = (0,
|
|
1421
|
-
(0,
|
|
2762
|
+
const [isAnimating, setIsAnimating] = (0, import_react53.useState)(false);
|
|
2763
|
+
const titleRef = (0, import_react53.useRef)(null);
|
|
2764
|
+
(0, import_react53.useEffect)(() => {
|
|
1422
2765
|
const observer = new IntersectionObserver(
|
|
1423
2766
|
([entry]) => {
|
|
1424
2767
|
if (entry.isIntersecting) {
|
|
@@ -1436,7 +2779,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
1436
2779
|
}
|
|
1437
2780
|
return () => observer.disconnect();
|
|
1438
2781
|
}, []);
|
|
1439
|
-
return /* @__PURE__ */
|
|
2782
|
+
return /* @__PURE__ */ import_react53.default.createElement("section", { className: "py-24 w-full flex justify-center relative z-10" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-10 mb-12" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "max-w-xl" }, /* @__PURE__ */ import_react53.default.createElement(
|
|
1440
2783
|
"h2",
|
|
1441
2784
|
{
|
|
1442
2785
|
ref: titleRef,
|
|
@@ -1444,7 +2787,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
1444
2787
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
1445
2788
|
},
|
|
1446
2789
|
bottomHeadline
|
|
1447
|
-
), /* @__PURE__ */
|
|
2790
|
+
), /* @__PURE__ */ import_react53.default.createElement("p", { className: "text-[14px] leading-relaxed text-neutral-500" }, bottomDescription)), /* @__PURE__ */ import_react53.default.createElement("div", { className: "flex items-center gap-4 shrink-0" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "flex -space-x-3" }, avatars.map((src, i) => /* @__PURE__ */ import_react53.default.createElement("div", { key: i, className: "relative w-12 h-12 rounded-full border-[3px] border-white overflow-hidden bg-neutral-100 z-1 hover:z-10 transition-all" }, /* @__PURE__ */ import_react53.default.createElement(
|
|
1448
2791
|
import_image9.default,
|
|
1449
2792
|
{
|
|
1450
2793
|
src,
|
|
@@ -1453,17 +2796,17 @@ var MedicalFeatureStatsBlock = ({
|
|
|
1453
2796
|
sizes: "48px",
|
|
1454
2797
|
className: "object-cover"
|
|
1455
2798
|
}
|
|
1456
|
-
)))), /* @__PURE__ */
|
|
2799
|
+
)))), /* @__PURE__ */ import_react53.default.createElement("p", { className: "text-[11px] text-neutral-800 leading-[1.4] max-w-55" }, trustText))), /* @__PURE__ */ import_react53.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6" }, stats.map((stat, idx) => /* @__PURE__ */ import_react53.default.createElement("div", { key: idx, className: "bg-white rounded-4xl p-8 md:p-10 flex flex-col h-70" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "flex items-center p-0.5 mb-6" }, /* @__PURE__ */ import_react53.default.createElement("span", { className: "text-[14px] text-neutral-500 tracking-wide" }, stat.label)), /* @__PURE__ */ import_react53.default.createElement("h1", { className: "text-6xl gradient-text md:text-[80px] tracking-tighter text-black mt-auto leading-none" }, stat.value))))));
|
|
1457
2800
|
};
|
|
1458
2801
|
|
|
1459
2802
|
// src/components/ConsultantShowcase.tsx
|
|
1460
|
-
var
|
|
2803
|
+
var import_react54 = __toESM(require("react"));
|
|
1461
2804
|
var import_image10 = __toESM(require("next/image"));
|
|
1462
|
-
var
|
|
1463
|
-
var
|
|
2805
|
+
var import_react55 = require("@hugeicons/react");
|
|
2806
|
+
var import_core_free_icons16 = require("@hugeicons/core-free-icons");
|
|
1464
2807
|
var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
1465
|
-
const [isLoading, setIsLoading] = (0,
|
|
1466
|
-
return /* @__PURE__ */
|
|
2808
|
+
const [isLoading, setIsLoading] = (0, import_react54.useState)(true);
|
|
2809
|
+
return /* @__PURE__ */ import_react54.default.createElement("div", { className: `absolute inset-0 bg-neutral-800 ${className}` }, isLoading && /* @__PURE__ */ import_react54.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-800/50 backdrop-blur-md transition-opacity duration-300" }, /* @__PURE__ */ import_react54.default.createElement(import_react55.HugeiconsIcon, { icon: import_core_free_icons16.Loading03Icon, size: 24, className: "animate-spin text-white/50" })), /* @__PURE__ */ import_react54.default.createElement(
|
|
1467
2810
|
import_image10.default,
|
|
1468
2811
|
{
|
|
1469
2812
|
src,
|
|
@@ -1482,9 +2825,9 @@ var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
|
1482
2825
|
var ConsultantShowcase = ({
|
|
1483
2826
|
profiles
|
|
1484
2827
|
}) => {
|
|
1485
|
-
const [currentIndex, setCurrentIndex] = (0,
|
|
1486
|
-
const [touchStart, setTouchStart] = (0,
|
|
1487
|
-
const [touchEnd, setTouchEnd] = (0,
|
|
2828
|
+
const [currentIndex, setCurrentIndex] = (0, import_react54.useState)(0);
|
|
2829
|
+
const [touchStart, setTouchStart] = (0, import_react54.useState)(null);
|
|
2830
|
+
const [touchEnd, setTouchEnd] = (0, import_react54.useState)(null);
|
|
1488
2831
|
const nextSlide = () => {
|
|
1489
2832
|
setCurrentIndex((prev) => prev === profiles.length - 1 ? 0 : prev + 1);
|
|
1490
2833
|
};
|
|
@@ -1509,7 +2852,7 @@ var ConsultantShowcase = ({
|
|
|
1509
2852
|
}
|
|
1510
2853
|
};
|
|
1511
2854
|
if (!profiles || profiles.length === 0) return null;
|
|
1512
|
-
return /* @__PURE__ */
|
|
2855
|
+
return /* @__PURE__ */ import_react54.default.createElement("section", { className: "py-24 w-full flex justify-center px-4 md:px-8 z-10 relative" }, /* @__PURE__ */ import_react54.default.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ import_react54.default.createElement(
|
|
1513
2856
|
"div",
|
|
1514
2857
|
{
|
|
1515
2858
|
className: "relative w-full h-100 md:h-112.5 rounded-4xl overflow-hidden bg-neutral-900 group select-none",
|
|
@@ -1519,13 +2862,13 @@ var ConsultantShowcase = ({
|
|
|
1519
2862
|
},
|
|
1520
2863
|
profiles.map((profile, idx) => {
|
|
1521
2864
|
const isActive = idx === currentIndex;
|
|
1522
|
-
return /* @__PURE__ */
|
|
2865
|
+
return /* @__PURE__ */ import_react54.default.createElement(
|
|
1523
2866
|
"div",
|
|
1524
2867
|
{
|
|
1525
2868
|
key: profile.id,
|
|
1526
2869
|
className: `absolute inset-0 transition-opacity duration-700 ease-in-out ${isActive ? "opacity-100 z-10" : "opacity-0 z-0 pointer-events-none"}`
|
|
1527
2870
|
},
|
|
1528
|
-
/* @__PURE__ */
|
|
2871
|
+
/* @__PURE__ */ import_react54.default.createElement(
|
|
1529
2872
|
ImageWithLoader,
|
|
1530
2873
|
{
|
|
1531
2874
|
src: profile.imageSrc,
|
|
@@ -1533,14 +2876,14 @@ var ConsultantShowcase = ({
|
|
|
1533
2876
|
priority: idx === 0
|
|
1534
2877
|
}
|
|
1535
2878
|
),
|
|
1536
|
-
/* @__PURE__ */
|
|
1537
|
-
/* @__PURE__ */
|
|
1538
|
-
/* @__PURE__ */
|
|
2879
|
+
/* @__PURE__ */ import_react54.default.createElement("div", { className: "absolute inset-0 bg-black/20 z-10 pointer-events-none" }),
|
|
2880
|
+
/* @__PURE__ */ import_react54.default.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" }),
|
|
2881
|
+
/* @__PURE__ */ import_react54.default.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__ */ import_react54.default.createElement("h2", { className: "text-[29px] tracking-tight mb-2 leading-none" }, profile.name), /* @__PURE__ */ import_react54.default.createElement("div", { className: "flex flex-col gap-0.5" }, /* @__PURE__ */ import_react54.default.createElement("p", { className: "text-[15px] text-white/80 tracking-wide" }, profile.role), profile.description && /* @__PURE__ */ import_react54.default.createElement("p", { className: "text-[15px] text-white/80 tracking-wide mt-1" }, profile.description)))
|
|
1539
2882
|
);
|
|
1540
2883
|
}),
|
|
1541
|
-
/* @__PURE__ */
|
|
1542
|
-
/* @__PURE__ */
|
|
1543
|
-
/* @__PURE__ */
|
|
2884
|
+
/* @__PURE__ */ import_react54.default.createElement("div", { className: "absolute top-0 left-0 w-[20%] h-full z-40 cursor-w-resize hidden md:block", onClick: prevSlide, "aria-label": "Previous image" }),
|
|
2885
|
+
/* @__PURE__ */ import_react54.default.createElement("div", { className: "absolute top-0 right-0 w-[20%] h-full z-40 cursor-e-resize hidden md:block", onClick: nextSlide, "aria-label": "Next image" }),
|
|
2886
|
+
/* @__PURE__ */ import_react54.default.createElement("div", { className: "absolute bottom-6 md:bottom-8 left-0 w-full px-4 z-30 flex justify-center items-center gap-2" }, profiles.map((_, idx) => /* @__PURE__ */ import_react54.default.createElement(
|
|
1544
2887
|
"button",
|
|
1545
2888
|
{
|
|
1546
2889
|
key: idx,
|
|
@@ -1553,13 +2896,13 @@ var ConsultantShowcase = ({
|
|
|
1553
2896
|
};
|
|
1554
2897
|
|
|
1555
2898
|
// src/components/ContentGridBlock.tsx
|
|
1556
|
-
var
|
|
2899
|
+
var import_react56 = __toESM(require("react"));
|
|
1557
2900
|
var import_image11 = __toESM(require("next/image"));
|
|
1558
|
-
var
|
|
1559
|
-
var
|
|
2901
|
+
var import_react57 = require("@hugeicons/react");
|
|
2902
|
+
var import_core_free_icons17 = require("@hugeicons/core-free-icons");
|
|
1560
2903
|
var ImageWithLoader2 = ({ src, alt, className, sizes }) => {
|
|
1561
|
-
const [isLoading, setIsLoading] = (0,
|
|
1562
|
-
return /* @__PURE__ */
|
|
2904
|
+
const [isLoading, setIsLoading] = (0, import_react56.useState)(true);
|
|
2905
|
+
return /* @__PURE__ */ import_react56.default.createElement("div", { className: `relative overflow-hidden bg-neutral-100 ${className}` }, isLoading && /* @__PURE__ */ import_react56.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-100/50 backdrop-blur-sm transition-opacity duration-300" }, /* @__PURE__ */ import_react56.default.createElement(import_react57.HugeiconsIcon, { icon: import_core_free_icons17.Loading03Icon, size: 24, className: "animate-spin text-neutral-400" })), /* @__PURE__ */ import_react56.default.createElement(
|
|
1563
2906
|
import_image11.default,
|
|
1564
2907
|
{
|
|
1565
2908
|
src,
|
|
@@ -1581,30 +2924,30 @@ var ContentGridBlock = ({
|
|
|
1581
2924
|
middleBottomCard,
|
|
1582
2925
|
rightCards
|
|
1583
2926
|
}) => {
|
|
1584
|
-
return /* @__PURE__ */
|
|
2927
|
+
return /* @__PURE__ */ import_react56.default.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ import_react56.default.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ import_react56.default.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ import_react56.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "bg-black rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[17px] text-white leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ import_react56.default.createElement("span", { className: "mb-auto text-[11px] text-neutral-200 tracking-widest" }, leftCard.tag), /* @__PURE__ */ import_react56.default.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ import_react56.default.createElement("div", null, /* @__PURE__ */ import_react56.default.createElement("h4", { className: "text-[15px] text-white" }, leftCard.title), /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[13px] text-neutral-300" }, leftCard.subtitle)), /* @__PURE__ */ import_react56.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react56.default.createElement(import_image11.default, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ import_react56.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react56.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ import_react56.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ import_react56.default.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ import_react56.default.createElement(import_image11.default, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ import_react56.default.createElement("span", { className: "text-sm text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ import_react56.default.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-100 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ import_react56.default.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ import_react56.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[11px] text-neutral-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[14px] text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ import_react56.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ import_react56.default.createElement("div", null, /* @__PURE__ */ import_react56.default.createElement("h4", { className: "text-[15px] text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ import_react56.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react56.default.createElement(import_image11.default, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ import_react56.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[16px] text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ import_react56.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ import_react56.default.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ import_react56.default.createElement("div", { key: idx, className: "relative w-full h-80 text-white rounded-3xl overflow-hidden group" }, /* @__PURE__ */ import_react56.default.createElement(
|
|
1585
2928
|
ImageWithLoader2,
|
|
1586
2929
|
{
|
|
1587
2930
|
src: card.bgImageSrc,
|
|
1588
2931
|
alt: card.title,
|
|
1589
2932
|
className: "absolute inset-0 w-full h-full"
|
|
1590
2933
|
}
|
|
1591
|
-
), /* @__PURE__ */
|
|
2934
|
+
), /* @__PURE__ */ import_react56.default.createElement("div", { className: "absolute inset-0 z-20 pointer-events-none" }), /* @__PURE__ */ import_react56.default.createElement("div", { className: "absolute inset-0 z-30 p-6 flex flex-col justify-end text-white" }, /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[14px] leading-snug mb-3 pr-2 text-white/90" }, card.mainText), card.tag && /* @__PURE__ */ import_react56.default.createElement("span", { className: "mb-4 text-[11px] text-white/50 tracking-widest" }, card.tag), /* @__PURE__ */ import_react56.default.createElement("div", { className: "pt-3" }, /* @__PURE__ */ import_react56.default.createElement("h4", { className: "text-[15px] text-white tracking-wide" }, card.title), /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[13px] text-white/60" }, card.subtitle)))))))));
|
|
1592
2935
|
};
|
|
1593
2936
|
|
|
1594
2937
|
// src/components/ManagedProjectsBlock.tsx
|
|
1595
|
-
var
|
|
1596
|
-
var
|
|
2938
|
+
var import_react58 = __toESM(require("react"));
|
|
2939
|
+
var import_link8 = __toESM(require("next/link"));
|
|
1597
2940
|
var GridSection = ({
|
|
1598
2941
|
children,
|
|
1599
2942
|
isLast = false,
|
|
1600
2943
|
className = "py-8 md:py-10"
|
|
1601
|
-
}) => /* @__PURE__ */
|
|
2944
|
+
}) => /* @__PURE__ */ import_react58.default.createElement("div", { className: `relative px-5 md:px-12 ${className} ${!isLast ? "" : ""}` }, children);
|
|
1602
2945
|
var ManagedProjectsBlock = ({
|
|
1603
2946
|
tagline,
|
|
1604
2947
|
title,
|
|
1605
2948
|
projects
|
|
1606
2949
|
}) => {
|
|
1607
|
-
return /* @__PURE__ */
|
|
2950
|
+
return /* @__PURE__ */ import_react58.default.createElement("div", { className: "grow pt-4 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-5xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react58.default.createElement(
|
|
1608
2951
|
"div",
|
|
1609
2952
|
{
|
|
1610
2953
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -1613,10 +2956,10 @@ var ManagedProjectsBlock = ({
|
|
|
1613
2956
|
backgroundRepeat: "repeat"
|
|
1614
2957
|
}
|
|
1615
2958
|
}
|
|
1616
|
-
), /* @__PURE__ */
|
|
2959
|
+
), /* @__PURE__ */ import_react58.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react58.default.createElement(GridSection, null, tagline && /* @__PURE__ */ import_react58.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block " }, tagline), /* @__PURE__ */ import_react58.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), projects.map((project, index) => {
|
|
1617
2960
|
const isLast = index === projects.length - 1;
|
|
1618
|
-
const projectContent = /* @__PURE__ */
|
|
1619
|
-
return /* @__PURE__ */
|
|
2961
|
+
const projectContent = /* @__PURE__ */ import_react58.default.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ import_react58.default.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__ */ import_react58.default.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ import_react58.default.createElement("h2", { className: " text-[16px] text-black transition-all flex items-center gap-2" }, project.title, /* @__PURE__ */ import_react58.default.createElement("span", { className: "text-[11px] opacity-0 -translate-x-2 group-hover:opacity-100 group-hover:translate-x-0 transition-all duration-300" }, project.isExternal ? "\u2197" : "\u2192")), /* @__PURE__ */ import_react58.default.createElement("span", { className: `text-[9px] px-2.5 py-1 rounded-full tracking-[0.15em] transition-colors ${project.status.toLowerCase() === "production" ? "bg-black text-white" : "bg-neutral-100 text-neutral-500 group-hover:bg-neutral-100 group-hover:text-black"}` }, project.status)), /* @__PURE__ */ import_react58.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 shrink-0 " }, project.date)), /* @__PURE__ */ import_react58.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 max-w-4xl text-left transition-colors group-hover:text-black" }, project.description));
|
|
2962
|
+
return /* @__PURE__ */ import_react58.default.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__ */ import_react58.default.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ import_react58.default.createElement(import_link8.default, { href: project.link, className: "block outline-none" }, projectContent));
|
|
1620
2963
|
}))));
|
|
1621
2964
|
};
|
|
1622
2965
|
// Annotate the CommonJS export names for ESM import in node:
|
|
@@ -1639,12 +2982,22 @@ var ManagedProjectsBlock = ({
|
|
|
1639
2982
|
ManagedProjectsBlock,
|
|
1640
2983
|
ManagedToaster,
|
|
1641
2984
|
MedicalFeatureStatsBlock,
|
|
2985
|
+
MobileNav,
|
|
1642
2986
|
NumberInput,
|
|
1643
2987
|
PageSpinner,
|
|
2988
|
+
PipleAuth,
|
|
1644
2989
|
PlatformFeatures,
|
|
1645
2990
|
PortfolioHero,
|
|
1646
2991
|
TextInput,
|
|
1647
2992
|
ThreeDActionButton,
|
|
1648
2993
|
ThreeDButton,
|
|
2994
|
+
UniversalCardPage,
|
|
2995
|
+
UniversalErrorView,
|
|
2996
|
+
UniversalHomeView,
|
|
2997
|
+
UniversalOrganizationPage,
|
|
2998
|
+
UniversalProfilePage,
|
|
2999
|
+
UniversalProfileSettings,
|
|
3000
|
+
UniversalTransactionPage,
|
|
3001
|
+
UniversalWalletPage,
|
|
1649
3002
|
WaitlistDialog
|
|
1650
3003
|
});
|