@retinalabsllc/zairusjs 9.0.2 → 9.0.4
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 +1624 -268
- package/dist/index.mjs +1652 -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,89 @@ 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 (
|
|
674
|
+
// Wrapper: Fixed at the bottom, centered, hidden on desktop (sm:hidden)
|
|
675
|
+
/* @__PURE__ */ import_react9.default.createElement("div", { className: "fixed bottom-6 inset-x-0 z-100 flex justify-center pointer-events-none px-4 sm:hidden 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 border border-neutral-200/60 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) => {
|
|
676
|
+
const isActive = item.href === "/" ? pathname === "/" : pathname?.startsWith(item.href);
|
|
677
|
+
return /* @__PURE__ */ import_react9.default.createElement(
|
|
678
|
+
import_link4.default,
|
|
679
|
+
{
|
|
680
|
+
key: item.label,
|
|
681
|
+
href: item.href,
|
|
682
|
+
className: "flex flex-col items-center justify-center gap-1 min-w-14 transition-transform active:scale-95 outline-none"
|
|
683
|
+
},
|
|
684
|
+
/* @__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(
|
|
685
|
+
import_react10.HugeiconsIcon,
|
|
686
|
+
{
|
|
687
|
+
icon: item.icon,
|
|
688
|
+
size: 24
|
|
689
|
+
}
|
|
690
|
+
)),
|
|
691
|
+
/* @__PURE__ */ import_react9.default.createElement(
|
|
692
|
+
"span",
|
|
693
|
+
{
|
|
694
|
+
className: `text-[10px] tracking-wide transition-colors duration-300 font-medium ${isActive ? "text-black" : "text-neutral-400"}`
|
|
695
|
+
},
|
|
696
|
+
item.label
|
|
697
|
+
)
|
|
698
|
+
);
|
|
699
|
+
})))
|
|
700
|
+
);
|
|
701
|
+
};
|
|
409
702
|
|
|
410
|
-
// src/components/
|
|
411
|
-
var
|
|
412
|
-
var
|
|
703
|
+
// src/components/UniversalOrganizationPage.tsx
|
|
704
|
+
var import_react15 = __toESM(require("react"));
|
|
705
|
+
var import_react_hot_toast3 = __toESM(require("react-hot-toast"));
|
|
706
|
+
|
|
707
|
+
// src/components/ManagedToaster.tsx
|
|
708
|
+
var import_react11 = __toESM(require("react"));
|
|
709
|
+
var import_react_hot_toast2 = require("react-hot-toast");
|
|
710
|
+
var ManagedToaster = () => {
|
|
711
|
+
return /* @__PURE__ */ import_react11.default.createElement(
|
|
712
|
+
import_react_hot_toast2.Toaster,
|
|
713
|
+
{
|
|
714
|
+
position: "top-right",
|
|
715
|
+
toastOptions: {
|
|
716
|
+
style: {
|
|
717
|
+
background: "#171717",
|
|
718
|
+
color: "#fafafa",
|
|
719
|
+
fontSize: "11px",
|
|
720
|
+
padding: "8px 12px",
|
|
721
|
+
borderRadius: "8px",
|
|
722
|
+
minWidth: "fit-content",
|
|
723
|
+
boxShadow: "0 4px 6px -1px rgba(0, 0, 0, 0.5)"
|
|
724
|
+
},
|
|
725
|
+
success: {
|
|
726
|
+
iconTheme: {
|
|
727
|
+
primary: "#fafafa",
|
|
728
|
+
secondary: "#171717"
|
|
729
|
+
}
|
|
730
|
+
},
|
|
731
|
+
error: {
|
|
732
|
+
iconTheme: {
|
|
733
|
+
primary: "#fafafa",
|
|
734
|
+
secondary: "#171717"
|
|
735
|
+
}
|
|
736
|
+
}
|
|
737
|
+
}
|
|
738
|
+
}
|
|
739
|
+
);
|
|
740
|
+
};
|
|
413
741
|
|
|
414
742
|
// src/components/ReusableInputs.tsx
|
|
415
|
-
var
|
|
743
|
+
var import_react12 = __toESM(require("react"));
|
|
416
744
|
var TextInput = ({
|
|
417
745
|
label,
|
|
418
746
|
value,
|
|
@@ -423,7 +751,7 @@ var TextInput = ({
|
|
|
423
751
|
readOnly,
|
|
424
752
|
type = "text",
|
|
425
753
|
onClick
|
|
426
|
-
}) => /* @__PURE__ */
|
|
754
|
+
}) => /* @__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
755
|
"input",
|
|
428
756
|
{
|
|
429
757
|
type,
|
|
@@ -444,7 +772,7 @@ var NumberInput = ({
|
|
|
444
772
|
placeholder,
|
|
445
773
|
maxLength,
|
|
446
774
|
disabled
|
|
447
|
-
}) => /* @__PURE__ */
|
|
775
|
+
}) => /* @__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
776
|
"input",
|
|
449
777
|
{
|
|
450
778
|
type: "text",
|
|
@@ -461,15 +789,1090 @@ var NumberInput = ({
|
|
|
461
789
|
}
|
|
462
790
|
));
|
|
463
791
|
|
|
792
|
+
// src/components/Banner.tsx
|
|
793
|
+
var import_react13 = __toESM(require("react"));
|
|
794
|
+
var import_react14 = require("@hugeicons/react");
|
|
795
|
+
var import_core_free_icons2 = require("@hugeicons/core-free-icons");
|
|
796
|
+
var Banner = ({
|
|
797
|
+
title,
|
|
798
|
+
message,
|
|
799
|
+
type,
|
|
800
|
+
icon,
|
|
801
|
+
isDismissible = true,
|
|
802
|
+
onDismiss,
|
|
803
|
+
action
|
|
804
|
+
}) => {
|
|
805
|
+
const [isVisible, setIsVisible] = (0, import_react13.useState)(true);
|
|
806
|
+
if (!isVisible) return null;
|
|
807
|
+
const handleDismiss = () => {
|
|
808
|
+
setIsVisible(false);
|
|
809
|
+
if (onDismiss) onDismiss();
|
|
810
|
+
};
|
|
811
|
+
const config = {
|
|
812
|
+
success: {
|
|
813
|
+
bg: "bg-emerald-50",
|
|
814
|
+
iconColor: "text-emerald-600",
|
|
815
|
+
titleColor: "text-emerald-900",
|
|
816
|
+
msgColor: "text-emerald-700",
|
|
817
|
+
defaultIcon: import_core_free_icons2.CheckmarkBadge01Icon,
|
|
818
|
+
closeHover: "hover:bg-emerald-100 text-emerald-500"
|
|
819
|
+
},
|
|
820
|
+
warning: {
|
|
821
|
+
bg: "bg-amber-50",
|
|
822
|
+
iconColor: "text-amber-600",
|
|
823
|
+
titleColor: "text-amber-900",
|
|
824
|
+
msgColor: "text-amber-700",
|
|
825
|
+
defaultIcon: import_core_free_icons2.InformationCircleIcon,
|
|
826
|
+
closeHover: "hover:bg-amber-100 text-amber-500"
|
|
827
|
+
},
|
|
828
|
+
alert: {
|
|
829
|
+
bg: "bg-red-50",
|
|
830
|
+
iconColor: "text-red-600",
|
|
831
|
+
titleColor: "text-red-900",
|
|
832
|
+
msgColor: "text-red-700",
|
|
833
|
+
defaultIcon: import_core_free_icons2.Alert02Icon,
|
|
834
|
+
closeHover: "hover:bg-red-100 text-red-500"
|
|
835
|
+
}
|
|
836
|
+
};
|
|
837
|
+
const currentConfig = config[type];
|
|
838
|
+
const IconToUse = icon || currentConfig.defaultIcon;
|
|
839
|
+
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(
|
|
840
|
+
"button",
|
|
841
|
+
{
|
|
842
|
+
onClick: handleDismiss,
|
|
843
|
+
className: `absolute top-3 right-3 p-1.5 rounded-full transition-colors outline-none shrink-0 ${currentConfig.closeHover}`,
|
|
844
|
+
"aria-label": "Dismiss banner"
|
|
845
|
+
},
|
|
846
|
+
/* @__PURE__ */ import_react13.default.createElement(import_react14.HugeiconsIcon, { icon: import_core_free_icons2.Cancel01Icon, size: 16 })
|
|
847
|
+
));
|
|
848
|
+
};
|
|
849
|
+
|
|
850
|
+
// src/components/UniversalOrganizationPage.tsx
|
|
851
|
+
var import_react16 = require("@hugeicons/react");
|
|
852
|
+
var import_core_free_icons3 = require("@hugeicons/core-free-icons");
|
|
853
|
+
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" }));
|
|
854
|
+
var UniversalOrganizationPage = ({
|
|
855
|
+
initialOrgName,
|
|
856
|
+
initialSlug,
|
|
857
|
+
initialUsername,
|
|
858
|
+
orgId,
|
|
859
|
+
isReadOnly = false,
|
|
860
|
+
slugPrefixUrl = ".aeona.eth",
|
|
861
|
+
bannerProps,
|
|
862
|
+
onSaveConfiguration,
|
|
863
|
+
onCheckSlugAvailability
|
|
864
|
+
}) => {
|
|
865
|
+
const resolvedInitialUsername = initialUsername || initialSlug;
|
|
866
|
+
const [web3Name, setWeb3Name] = (0, import_react15.useState)(initialOrgName);
|
|
867
|
+
const [username, setUsername] = (0, import_react15.useState)(resolvedInitialUsername);
|
|
868
|
+
const [slug, setSlug] = (0, import_react15.useState)(initialSlug);
|
|
869
|
+
const [isCheckingSlug, setIsCheckingSlug] = (0, import_react15.useState)(false);
|
|
870
|
+
const [slugAvailable, setSlugAvailable] = (0, import_react15.useState)(null);
|
|
871
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react15.useState)(false);
|
|
872
|
+
(0, import_react15.useEffect)(() => {
|
|
873
|
+
setWeb3Name(initialOrgName || "");
|
|
874
|
+
setSlug(initialSlug || "");
|
|
875
|
+
setUsername(initialUsername || initialSlug || "");
|
|
876
|
+
}, [initialOrgName, initialSlug, initialUsername]);
|
|
877
|
+
const handleWeb3NameChange = (val) => {
|
|
878
|
+
setWeb3Name(val.replace(/[^a-zA-Z0-9\s-]/g, "").substring(0, 50));
|
|
879
|
+
};
|
|
880
|
+
const handleUsernameChange = (val) => {
|
|
881
|
+
setUsername(val.toLowerCase().replace(/[^a-z0-9-]/g, "").substring(0, 30));
|
|
882
|
+
};
|
|
883
|
+
const handleSlugChange = (val) => {
|
|
884
|
+
setSlug(val.toLowerCase().replace(/[^a-z0-9-]/g, "").replace(/-+/g, "-").substring(0, 50));
|
|
885
|
+
};
|
|
886
|
+
(0, import_react15.useEffect)(() => {
|
|
887
|
+
if (!slug || slug === initialSlug) {
|
|
888
|
+
setSlugAvailable(null);
|
|
889
|
+
setIsCheckingSlug(false);
|
|
890
|
+
return;
|
|
891
|
+
}
|
|
892
|
+
if (slug.length < 3) {
|
|
893
|
+
setSlugAvailable(false);
|
|
894
|
+
setIsCheckingSlug(false);
|
|
895
|
+
return;
|
|
896
|
+
}
|
|
897
|
+
setIsCheckingSlug(true);
|
|
898
|
+
setSlugAvailable(null);
|
|
899
|
+
const checkTimer = setTimeout(async () => {
|
|
900
|
+
try {
|
|
901
|
+
const res = await onCheckSlugAvailability(slug);
|
|
902
|
+
setSlugAvailable(res.available);
|
|
903
|
+
} catch (error) {
|
|
904
|
+
setSlugAvailable(null);
|
|
905
|
+
} finally {
|
|
906
|
+
setIsCheckingSlug(false);
|
|
907
|
+
}
|
|
908
|
+
}, 1500);
|
|
909
|
+
return () => clearTimeout(checkTimer);
|
|
910
|
+
}, [slug, initialSlug, onCheckSlugAvailability]);
|
|
911
|
+
const handleSave = async (e) => {
|
|
912
|
+
e.preventDefault();
|
|
913
|
+
if (isSubmitting || isCheckingSlug || isReadOnly) return;
|
|
914
|
+
if (slug !== initialSlug && slugAvailable === false) {
|
|
915
|
+
import_react_hot_toast3.default.error("Please select an available profile address handles.");
|
|
916
|
+
return;
|
|
917
|
+
}
|
|
918
|
+
setIsSubmitting(true);
|
|
919
|
+
try {
|
|
920
|
+
const payload = {
|
|
921
|
+
organizationId: orgId,
|
|
922
|
+
organizationName: web3Name !== initialOrgName ? web3Name : void 0,
|
|
923
|
+
slug: slug !== initialSlug ? slug : void 0,
|
|
924
|
+
username: username !== resolvedInitialUsername ? username : void 0
|
|
925
|
+
};
|
|
926
|
+
const responseData = await onSaveConfiguration(payload);
|
|
927
|
+
if (responseData.success) {
|
|
928
|
+
import_react_hot_toast3.default.success("Web3 profile identity updated successfully.");
|
|
929
|
+
setTimeout(() => window.location.reload(), 1e3);
|
|
930
|
+
} else {
|
|
931
|
+
import_react_hot_toast3.default.error(responseData.error || "Failed to update your identity profile.");
|
|
932
|
+
setIsSubmitting(false);
|
|
933
|
+
}
|
|
934
|
+
} catch (error) {
|
|
935
|
+
import_react_hot_toast3.default.error("Service unavailable. Try again later.");
|
|
936
|
+
setIsSubmitting(false);
|
|
937
|
+
}
|
|
938
|
+
};
|
|
939
|
+
const hasChanges = web3Name !== initialOrgName || slug !== initialSlug || username !== resolvedInitialUsername;
|
|
940
|
+
const isSaveDisabled = isSubmitting || isReadOnly || isCheckingSlug || !hasChanges || web3Name.length < 3 || slug.length < 3 || username.length < 3 || slug !== initialSlug && slugAvailable === false;
|
|
941
|
+
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(
|
|
942
|
+
TextInput,
|
|
943
|
+
{
|
|
944
|
+
label: "Display Name",
|
|
945
|
+
value: web3Name,
|
|
946
|
+
onChange: handleWeb3NameChange,
|
|
947
|
+
disabled: isReadOnly || isSubmitting,
|
|
948
|
+
placeholder: "Sovereign User",
|
|
949
|
+
maxLength: 50
|
|
950
|
+
}
|
|
951
|
+
), /* @__PURE__ */ import_react15.default.createElement(
|
|
952
|
+
TextInput,
|
|
953
|
+
{
|
|
954
|
+
label: "Digital Identity",
|
|
955
|
+
value: username,
|
|
956
|
+
onChange: handleUsernameChange,
|
|
957
|
+
disabled: isReadOnly || isSubmitting,
|
|
958
|
+
placeholder: "sovereignuser",
|
|
959
|
+
maxLength: 30
|
|
960
|
+
}
|
|
961
|
+
), /* @__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(
|
|
962
|
+
"input",
|
|
963
|
+
{
|
|
964
|
+
type: "text",
|
|
965
|
+
value: slug,
|
|
966
|
+
disabled: isReadOnly || isSubmitting,
|
|
967
|
+
onChange: (e) => handleSlugChange(e.target.value),
|
|
968
|
+
spellCheck: "false",
|
|
969
|
+
autoComplete: "off",
|
|
970
|
+
className: "w-full px-2 py-3 text-sm bg-transparent text-black outline-none disabled:opacity-50 disabled:cursor-not-allowed",
|
|
971
|
+
placeholder: "sovereign-user-handle"
|
|
972
|
+
}
|
|
973
|
+
), /* @__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(
|
|
974
|
+
ThreeDActionButton,
|
|
975
|
+
{
|
|
976
|
+
type: "submit",
|
|
977
|
+
disabled: isSaveDisabled,
|
|
978
|
+
isLoading: isSubmitting,
|
|
979
|
+
className: "min-w-32"
|
|
980
|
+
},
|
|
981
|
+
"Save Changes"
|
|
982
|
+
), hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */ import_react15.default.createElement(
|
|
983
|
+
"button",
|
|
984
|
+
{
|
|
985
|
+
type: "button",
|
|
986
|
+
onClick: () => {
|
|
987
|
+
setWeb3Name(initialOrgName);
|
|
988
|
+
setSlug(initialSlug);
|
|
989
|
+
setUsername(resolvedInitialUsername);
|
|
990
|
+
},
|
|
991
|
+
className: "text-[11px] tracking-widest text-neutral-400 hover:text-black transition-colors outline-none"
|
|
992
|
+
},
|
|
993
|
+
"Cancel"
|
|
994
|
+
)))));
|
|
995
|
+
};
|
|
996
|
+
|
|
997
|
+
// src/components/UniversalProfileSettings.tsx
|
|
998
|
+
var import_react17 = __toESM(require("react"));
|
|
999
|
+
var import_react_hot_toast4 = __toESM(require("react-hot-toast"));
|
|
1000
|
+
var import_react18 = require("@hugeicons/react");
|
|
1001
|
+
var import_core_free_icons4 = require("@hugeicons/core-free-icons");
|
|
1002
|
+
var UniversalProfileSettings = ({
|
|
1003
|
+
initialFirstName,
|
|
1004
|
+
initialLastName,
|
|
1005
|
+
email,
|
|
1006
|
+
accountStatus = "GOOD",
|
|
1007
|
+
memberSince,
|
|
1008
|
+
isReadOnly = false,
|
|
1009
|
+
bannerProps,
|
|
1010
|
+
hasPin = false,
|
|
1011
|
+
isPinLoading = false,
|
|
1012
|
+
onSavePin,
|
|
1013
|
+
onSaveProfile
|
|
1014
|
+
}) => {
|
|
1015
|
+
const [firstName, setFirstName] = (0, import_react17.useState)(initialFirstName);
|
|
1016
|
+
const [lastName, setLastName] = (0, import_react17.useState)(initialLastName);
|
|
1017
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react17.useState)(false);
|
|
1018
|
+
const [isPinModalOpen, setIsPinModalOpen] = (0, import_react17.useState)(false);
|
|
1019
|
+
const [oldPin, setOldPin] = (0, import_react17.useState)("");
|
|
1020
|
+
const [newPin, setNewPin] = (0, import_react17.useState)("");
|
|
1021
|
+
const [confirmPin, setConfirmPin] = (0, import_react17.useState)("");
|
|
1022
|
+
const [isPinSubmitting, setIsPinSubmitting] = (0, import_react17.useState)(false);
|
|
1023
|
+
(0, import_react17.useEffect)(() => {
|
|
1024
|
+
setFirstName(initialFirstName || "");
|
|
1025
|
+
setLastName(initialLastName || "");
|
|
1026
|
+
}, [initialFirstName, initialLastName]);
|
|
1027
|
+
const handleFirstNameChange = (val) => {
|
|
1028
|
+
setFirstName(val.replace(/[^a-zA-Z\s-]/g, "").substring(0, 50));
|
|
1029
|
+
};
|
|
1030
|
+
const handleLastNameChange = (val) => {
|
|
1031
|
+
setLastName(val.replace(/[^a-zA-Z\s-]/g, "").substring(0, 50));
|
|
1032
|
+
};
|
|
1033
|
+
const handleSave = async (e) => {
|
|
1034
|
+
e.preventDefault();
|
|
1035
|
+
if (isSubmitting || isReadOnly) return;
|
|
1036
|
+
setIsSubmitting(true);
|
|
1037
|
+
try {
|
|
1038
|
+
const res = await onSaveProfile({ firstName, lastName });
|
|
1039
|
+
if (res.success) {
|
|
1040
|
+
import_react_hot_toast4.default.success("Profile updated successfully.");
|
|
1041
|
+
setTimeout(() => window.location.reload(), 1e3);
|
|
1042
|
+
} else {
|
|
1043
|
+
import_react_hot_toast4.default.error(res.error || "Uh oh! Something went wrong.");
|
|
1044
|
+
setIsSubmitting(false);
|
|
1045
|
+
}
|
|
1046
|
+
} catch (error) {
|
|
1047
|
+
import_react_hot_toast4.default.error("Uh oh! Something went wrong.");
|
|
1048
|
+
setIsSubmitting(false);
|
|
1049
|
+
}
|
|
1050
|
+
};
|
|
1051
|
+
const closePinModal = () => {
|
|
1052
|
+
if (isPinSubmitting) return;
|
|
1053
|
+
setIsPinModalOpen(false);
|
|
1054
|
+
setOldPin("");
|
|
1055
|
+
setNewPin("");
|
|
1056
|
+
setConfirmPin("");
|
|
1057
|
+
};
|
|
1058
|
+
const handlePinInput = (val, setter) => {
|
|
1059
|
+
setter(val.replace(/\D/g, "").substring(0, 4));
|
|
1060
|
+
};
|
|
1061
|
+
const handlePinSubmit = async (e) => {
|
|
1062
|
+
e.preventDefault();
|
|
1063
|
+
if (!onSavePin) return;
|
|
1064
|
+
if (hasPin && oldPin.length !== 4) return import_react_hot_toast4.default.error("Old PIN must be exactly 4 digits.");
|
|
1065
|
+
if (newPin.length !== 4) return import_react_hot_toast4.default.error("New PIN must be exactly 4 digits.");
|
|
1066
|
+
if (newPin !== confirmPin) return import_react_hot_toast4.default.error("New PINs do not match.");
|
|
1067
|
+
setIsPinSubmitting(true);
|
|
1068
|
+
try {
|
|
1069
|
+
const action = hasPin ? "change_pin" : "create_pin";
|
|
1070
|
+
const res = await onSavePin({
|
|
1071
|
+
action,
|
|
1072
|
+
oldPin: hasPin ? oldPin : void 0,
|
|
1073
|
+
newPin
|
|
1074
|
+
});
|
|
1075
|
+
if (res.success) {
|
|
1076
|
+
import_react_hot_toast4.default.success(res.message || "PIN updated successfully.");
|
|
1077
|
+
closePinModal();
|
|
1078
|
+
} else {
|
|
1079
|
+
import_react_hot_toast4.default.error(res.error || "Failed to update PIN.");
|
|
1080
|
+
}
|
|
1081
|
+
} catch (error) {
|
|
1082
|
+
import_react_hot_toast4.default.error("Uh oh! Something went wrong.");
|
|
1083
|
+
} finally {
|
|
1084
|
+
setIsPinSubmitting(false);
|
|
1085
|
+
}
|
|
1086
|
+
};
|
|
1087
|
+
const hasChanges = firstName !== initialFirstName || lastName !== initialLastName;
|
|
1088
|
+
const isSaveDisabled = isSubmitting || isReadOnly || !hasChanges || firstName.trim().length === 0 || lastName.trim().length === 0;
|
|
1089
|
+
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(
|
|
1090
|
+
TextInput,
|
|
1091
|
+
{
|
|
1092
|
+
label: "First Name",
|
|
1093
|
+
value: firstName,
|
|
1094
|
+
onChange: handleFirstNameChange,
|
|
1095
|
+
disabled: isReadOnly || isSubmitting,
|
|
1096
|
+
placeholder: "System"
|
|
1097
|
+
}
|
|
1098
|
+
)), /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react17.default.createElement(
|
|
1099
|
+
TextInput,
|
|
1100
|
+
{
|
|
1101
|
+
label: "Last Name",
|
|
1102
|
+
value: lastName,
|
|
1103
|
+
onChange: handleLastNameChange,
|
|
1104
|
+
disabled: isReadOnly || isSubmitting,
|
|
1105
|
+
placeholder: "Admin"
|
|
1106
|
+
}
|
|
1107
|
+
))), /* @__PURE__ */ import_react17.default.createElement("div", { className: "space-y-2 min-w-0" }, /* @__PURE__ */ import_react17.default.createElement(
|
|
1108
|
+
TextInput,
|
|
1109
|
+
{
|
|
1110
|
+
label: "Email ID",
|
|
1111
|
+
value: email,
|
|
1112
|
+
onChange: () => {
|
|
1113
|
+
},
|
|
1114
|
+
disabled: true
|
|
1115
|
+
}
|
|
1116
|
+
), /* @__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(
|
|
1117
|
+
"button",
|
|
1118
|
+
{
|
|
1119
|
+
type: "button",
|
|
1120
|
+
onClick: () => setIsPinModalOpen(true),
|
|
1121
|
+
"aria-label": "PIN Settings",
|
|
1122
|
+
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"
|
|
1123
|
+
},
|
|
1124
|
+
/* @__PURE__ */ import_react17.default.createElement(import_react18.HugeiconsIcon, { icon: import_core_free_icons4.LockKeyIcon, size: 17, className: "text-black" })
|
|
1125
|
+
))), /* @__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(
|
|
1126
|
+
"button",
|
|
1127
|
+
{
|
|
1128
|
+
type: "button",
|
|
1129
|
+
onClick: () => {
|
|
1130
|
+
setFirstName(initialFirstName);
|
|
1131
|
+
setLastName(initialLastName);
|
|
1132
|
+
},
|
|
1133
|
+
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"
|
|
1134
|
+
},
|
|
1135
|
+
"Cancel"
|
|
1136
|
+
), /* @__PURE__ */ import_react17.default.createElement(
|
|
1137
|
+
ThreeDActionButton,
|
|
1138
|
+
{
|
|
1139
|
+
type: "submit",
|
|
1140
|
+
disabled: isSaveDisabled,
|
|
1141
|
+
isLoading: isSubmitting,
|
|
1142
|
+
className: "min-w-32 w-full sm:w-auto"
|
|
1143
|
+
},
|
|
1144
|
+
"Save Changes"
|
|
1145
|
+
))))), 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(
|
|
1146
|
+
TextInput,
|
|
1147
|
+
{
|
|
1148
|
+
type: "password",
|
|
1149
|
+
label: "Old PIN",
|
|
1150
|
+
maxLength: 4,
|
|
1151
|
+
disabled: isPinSubmitting,
|
|
1152
|
+
value: oldPin,
|
|
1153
|
+
onChange: (val) => handlePinInput(val, setOldPin),
|
|
1154
|
+
placeholder: "\u2022\u2022\u2022\u2022"
|
|
1155
|
+
}
|
|
1156
|
+
), /* @__PURE__ */ import_react17.default.createElement(
|
|
1157
|
+
TextInput,
|
|
1158
|
+
{
|
|
1159
|
+
type: "password",
|
|
1160
|
+
label: hasPin ? "New PIN" : "Enter 4-Digit PIN",
|
|
1161
|
+
maxLength: 4,
|
|
1162
|
+
disabled: isPinSubmitting,
|
|
1163
|
+
value: newPin,
|
|
1164
|
+
onChange: (val) => handlePinInput(val, setNewPin),
|
|
1165
|
+
placeholder: "\u2022\u2022\u2022\u2022"
|
|
1166
|
+
}
|
|
1167
|
+
), /* @__PURE__ */ import_react17.default.createElement(
|
|
1168
|
+
TextInput,
|
|
1169
|
+
{
|
|
1170
|
+
type: "password",
|
|
1171
|
+
label: "Retype New PIN",
|
|
1172
|
+
maxLength: 4,
|
|
1173
|
+
disabled: isPinSubmitting,
|
|
1174
|
+
value: confirmPin,
|
|
1175
|
+
onChange: (val) => handlePinInput(val, setConfirmPin),
|
|
1176
|
+
placeholder: "\u2022\u2022\u2022\u2022"
|
|
1177
|
+
}
|
|
1178
|
+
), /* @__PURE__ */ import_react17.default.createElement("div", { className: "pt-2" }, /* @__PURE__ */ import_react17.default.createElement(
|
|
1179
|
+
ThreeDActionButton,
|
|
1180
|
+
{
|
|
1181
|
+
type: "submit",
|
|
1182
|
+
disabled: isPinSubmitting || newPin.length !== 4 || confirmPin.length !== 4 || hasPin && oldPin.length !== 4,
|
|
1183
|
+
isLoading: isPinSubmitting,
|
|
1184
|
+
className: "w-full py-3"
|
|
1185
|
+
},
|
|
1186
|
+
hasPin ? "Update PIN" : "Set PIN"
|
|
1187
|
+
)))))));
|
|
1188
|
+
};
|
|
1189
|
+
|
|
1190
|
+
// src/components/UniversalErrorView.tsx
|
|
1191
|
+
var import_react21 = __toESM(require("react"));
|
|
1192
|
+
var import_react22 = require("@hugeicons/react");
|
|
1193
|
+
var import_core_free_icons6 = require("@hugeicons/core-free-icons");
|
|
1194
|
+
|
|
1195
|
+
// src/components/PageSpinner.tsx
|
|
1196
|
+
var import_react19 = __toESM(require("react"));
|
|
1197
|
+
var import_react20 = require("@hugeicons/react");
|
|
1198
|
+
var import_core_free_icons5 = require("@hugeicons/core-free-icons");
|
|
1199
|
+
var PageSpinner = ({
|
|
1200
|
+
className = "",
|
|
1201
|
+
iconClassName = "text-black",
|
|
1202
|
+
size = 32
|
|
1203
|
+
}) => {
|
|
1204
|
+
return (
|
|
1205
|
+
// z-[100] ensures it sits above absolute headers and modals
|
|
1206
|
+
/* @__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(
|
|
1207
|
+
import_react20.HugeiconsIcon,
|
|
1208
|
+
{
|
|
1209
|
+
icon: import_core_free_icons5.Loading03Icon,
|
|
1210
|
+
size,
|
|
1211
|
+
className: `animate-spin mb-4 ${iconClassName}`
|
|
1212
|
+
}
|
|
1213
|
+
))
|
|
1214
|
+
);
|
|
1215
|
+
};
|
|
1216
|
+
|
|
1217
|
+
// src/components/UniversalErrorView.tsx
|
|
1218
|
+
var UniversalErrorView = ({
|
|
1219
|
+
isBooting,
|
|
1220
|
+
isLoading,
|
|
1221
|
+
activeData,
|
|
1222
|
+
activeError,
|
|
1223
|
+
envName,
|
|
1224
|
+
onRetry,
|
|
1225
|
+
returnUrl = "/app",
|
|
1226
|
+
returnLabel = "Return to Workspace"
|
|
1227
|
+
}) => {
|
|
1228
|
+
if (isBooting || isLoading && !activeData) {
|
|
1229
|
+
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));
|
|
1230
|
+
}
|
|
1231
|
+
if (!isLoading && (!activeData || activeError)) {
|
|
1232
|
+
const errorString = typeof activeError === "string" ? activeError : JSON.stringify(activeError || "");
|
|
1233
|
+
const errorMsg = errorString.toLowerCase();
|
|
1234
|
+
const isPermissionError = errorMsg.includes("forbidden") || errorMsg.includes("unauthorized") || errorMsg.includes("permission");
|
|
1235
|
+
const isNetworkError = errorMsg.includes("network") || errorMsg.includes("connection") || errorMsg.includes("fetch");
|
|
1236
|
+
const isNotFoundError = errorMsg.includes("not found") || errorMsg.includes("404") || errorMsg.includes("does not exist") || !activeData && !isPermissionError && !isNetworkError;
|
|
1237
|
+
const apiMessage = typeof activeError === "string" && activeError.trim() !== "" ? activeError : null;
|
|
1238
|
+
let title = "Oops Connection Error";
|
|
1239
|
+
let description = apiMessage || `We could not load your request. Please check your connection and try again.`;
|
|
1240
|
+
let IconComponent = import_core_free_icons6.ConfusedIcon;
|
|
1241
|
+
if (isNotFoundError) {
|
|
1242
|
+
title = "Oops its not your fault";
|
|
1243
|
+
description = apiMessage || `We could not reach the ${envName} you just loaded. Our team has been notified.`;
|
|
1244
|
+
} else if (isPermissionError) {
|
|
1245
|
+
title = "Access Restricted";
|
|
1246
|
+
description = apiMessage || `You have insufficient permissions to view this ${envName}. Please contact your administrator.`;
|
|
1247
|
+
}
|
|
1248
|
+
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(
|
|
1249
|
+
"button",
|
|
1250
|
+
{
|
|
1251
|
+
onClick: () => window.location.href = returnUrl,
|
|
1252
|
+
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"
|
|
1253
|
+
},
|
|
1254
|
+
returnLabel
|
|
1255
|
+
) : (
|
|
1256
|
+
// Soft errors (Network timeouts) allow them to retry or optionally retreat
|
|
1257
|
+
/* @__PURE__ */ import_react21.default.createElement(import_react21.default.Fragment, null, envName.toLowerCase().includes("application") && /* @__PURE__ */ import_react21.default.createElement(
|
|
1258
|
+
"button",
|
|
1259
|
+
{
|
|
1260
|
+
onClick: () => window.location.href = returnUrl,
|
|
1261
|
+
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"
|
|
1262
|
+
},
|
|
1263
|
+
"Back Home"
|
|
1264
|
+
), /* @__PURE__ */ import_react21.default.createElement(
|
|
1265
|
+
"button",
|
|
1266
|
+
{
|
|
1267
|
+
onClick: onRetry,
|
|
1268
|
+
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"
|
|
1269
|
+
},
|
|
1270
|
+
"Refresh ",
|
|
1271
|
+
envName
|
|
1272
|
+
))
|
|
1273
|
+
)));
|
|
1274
|
+
}
|
|
1275
|
+
return null;
|
|
1276
|
+
};
|
|
1277
|
+
|
|
1278
|
+
// src/components/UniversalTransactionPage.tsx
|
|
1279
|
+
var import_react23 = __toESM(require("react"));
|
|
1280
|
+
var import_react24 = require("@hugeicons/react");
|
|
1281
|
+
var import_react_hot_toast5 = __toESM(require("react-hot-toast"));
|
|
1282
|
+
var import_core_free_icons7 = require("@hugeicons/core-free-icons");
|
|
1283
|
+
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" }));
|
|
1284
|
+
var formatDate = (dateInput) => {
|
|
1285
|
+
const d = new Date(dateInput);
|
|
1286
|
+
const day = d.getDate();
|
|
1287
|
+
const month = d.toLocaleString("en-US", { month: "short" });
|
|
1288
|
+
const year = d.getFullYear();
|
|
1289
|
+
return `${day} ${month} ${year}`;
|
|
1290
|
+
};
|
|
1291
|
+
var formatTime = (dateInput) => {
|
|
1292
|
+
return new Date(dateInput).toLocaleTimeString("en-US", { hour: "2-digit", minute: "2-digit" });
|
|
1293
|
+
};
|
|
1294
|
+
var truncateAddress = (address) => {
|
|
1295
|
+
if (!address || address.length < 12) return address;
|
|
1296
|
+
return `${address.substring(0, 6)}...${address.substring(address.length - 4)}`;
|
|
1297
|
+
};
|
|
1298
|
+
var UniversalTransactionPage = ({
|
|
1299
|
+
headerTitle,
|
|
1300
|
+
headerDescription,
|
|
1301
|
+
hideControls = false,
|
|
1302
|
+
hideBalanceAmounts = false,
|
|
1303
|
+
hidePagination = false,
|
|
1304
|
+
transactions,
|
|
1305
|
+
isLoading,
|
|
1306
|
+
currentPage,
|
|
1307
|
+
totalPages,
|
|
1308
|
+
onPageChange,
|
|
1309
|
+
searchQuery,
|
|
1310
|
+
onSearchChange,
|
|
1311
|
+
activeDirectionFilter,
|
|
1312
|
+
onDirectionFilterChange,
|
|
1313
|
+
activeTypeFilter,
|
|
1314
|
+
onTypeFilterChange,
|
|
1315
|
+
onReportTransaction,
|
|
1316
|
+
onGenerateReceipt
|
|
1317
|
+
}) => {
|
|
1318
|
+
const [selectedTransaction, setSelectedTransaction] = (0, import_react23.useState)(null);
|
|
1319
|
+
const [isGeneratingReceipt, setIsGeneratingReceipt] = (0, import_react23.useState)(false);
|
|
1320
|
+
const [localSearchQuery, setLocalSearchQuery] = (0, import_react23.useState)(searchQuery);
|
|
1321
|
+
const [isTyping, setIsTyping] = (0, import_react23.useState)(false);
|
|
1322
|
+
const [isDirectionModalOpen, setIsDirectionModalOpen] = (0, import_react23.useState)(false);
|
|
1323
|
+
const [isTypeModalOpen, setIsTypeModalOpen] = (0, import_react23.useState)(false);
|
|
1324
|
+
const directionDropdownRef = (0, import_react23.useRef)(null);
|
|
1325
|
+
const typeDropdownRef = (0, import_react23.useRef)(null);
|
|
1326
|
+
(0, import_react23.useEffect)(() => {
|
|
1327
|
+
function handleClickOutside(event) {
|
|
1328
|
+
if (directionDropdownRef.current && !directionDropdownRef.current.contains(event.target)) {
|
|
1329
|
+
setIsDirectionModalOpen(false);
|
|
1330
|
+
}
|
|
1331
|
+
if (typeDropdownRef.current && !typeDropdownRef.current.contains(event.target)) {
|
|
1332
|
+
setIsTypeModalOpen(false);
|
|
1333
|
+
}
|
|
1334
|
+
}
|
|
1335
|
+
document.addEventListener("mousedown", handleClickOutside);
|
|
1336
|
+
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
1337
|
+
}, []);
|
|
1338
|
+
(0, import_react23.useEffect)(() => {
|
|
1339
|
+
setIsTyping(true);
|
|
1340
|
+
const handler = setTimeout(() => {
|
|
1341
|
+
onSearchChange(localSearchQuery);
|
|
1342
|
+
setIsTyping(false);
|
|
1343
|
+
}, 600);
|
|
1344
|
+
return () => clearTimeout(handler);
|
|
1345
|
+
}, [localSearchQuery, onSearchChange]);
|
|
1346
|
+
(0, import_react23.useEffect)(() => {
|
|
1347
|
+
if (searchQuery === "" && localSearchQuery !== "") {
|
|
1348
|
+
setLocalSearchQuery("");
|
|
1349
|
+
}
|
|
1350
|
+
}, [searchQuery]);
|
|
1351
|
+
const getDisplayName = (tx) => {
|
|
1352
|
+
if (tx.metadata?.merchantName) return tx.metadata.merchantName;
|
|
1353
|
+
if (tx.metadata?.description) return tx.metadata.description;
|
|
1354
|
+
return tx.type === "CARD_TRANSACTION" ? "Card Transaction" : "Wallet Transaction";
|
|
1355
|
+
};
|
|
1356
|
+
const handleGenerateReceipt = async () => {
|
|
1357
|
+
if (!onGenerateReceipt || !selectedTransaction) return;
|
|
1358
|
+
setIsGeneratingReceipt(true);
|
|
1359
|
+
try {
|
|
1360
|
+
await onGenerateReceipt(selectedTransaction);
|
|
1361
|
+
import_react_hot_toast5.default.success("Receipt generated successfully.");
|
|
1362
|
+
} catch (error) {
|
|
1363
|
+
import_react_hot_toast5.default.error("Failed to generate receipt.");
|
|
1364
|
+
} finally {
|
|
1365
|
+
setIsGeneratingReceipt(false);
|
|
1366
|
+
}
|
|
1367
|
+
};
|
|
1368
|
+
const isListLoading = isLoading || isTyping;
|
|
1369
|
+
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(
|
|
1370
|
+
"input",
|
|
1371
|
+
{
|
|
1372
|
+
type: "text",
|
|
1373
|
+
placeholder: "Search reference or amount...",
|
|
1374
|
+
value: localSearchQuery,
|
|
1375
|
+
onChange: (e) => setLocalSearchQuery(e.target.value),
|
|
1376
|
+
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"
|
|
1377
|
+
}
|
|
1378
|
+
)), /* @__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(
|
|
1379
|
+
"button",
|
|
1380
|
+
{
|
|
1381
|
+
onClick: () => setIsDirectionModalOpen(true),
|
|
1382
|
+
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"
|
|
1383
|
+
},
|
|
1384
|
+
/* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.SearchList02Icon, size: 12 }),
|
|
1385
|
+
activeDirectionFilter === "ALL" ? "Payment Type" : activeDirectionFilter
|
|
1386
|
+
), /* @__PURE__ */ import_react23.default.createElement(
|
|
1387
|
+
"button",
|
|
1388
|
+
{
|
|
1389
|
+
onClick: () => setIsTypeModalOpen(true),
|
|
1390
|
+
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"
|
|
1391
|
+
},
|
|
1392
|
+
/* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.ListSettingIcon, size: 14 }),
|
|
1393
|
+
activeTypeFilter === "ALL" ? "All Transactions" : activeTypeFilter.replace("_", " ")
|
|
1394
|
+
))), /* @__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(
|
|
1395
|
+
"div",
|
|
1396
|
+
{
|
|
1397
|
+
key: tx.id,
|
|
1398
|
+
onClick: () => setSelectedTransaction(tx),
|
|
1399
|
+
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"
|
|
1400
|
+
},
|
|
1401
|
+
/* @__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))),
|
|
1402
|
+
/* @__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()))
|
|
1403
|
+
))), !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(
|
|
1404
|
+
"button",
|
|
1405
|
+
{
|
|
1406
|
+
onClick: () => onPageChange(currentPage - 1),
|
|
1407
|
+
disabled: currentPage <= 1 || isListLoading,
|
|
1408
|
+
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"
|
|
1409
|
+
},
|
|
1410
|
+
/* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.ArrowLeft01Icon, size: 14 })
|
|
1411
|
+
), /* @__PURE__ */ import_react23.default.createElement(
|
|
1412
|
+
"button",
|
|
1413
|
+
{
|
|
1414
|
+
onClick: () => onPageChange(currentPage + 1),
|
|
1415
|
+
disabled: currentPage >= totalPages || isListLoading || totalPages === 0,
|
|
1416
|
+
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"
|
|
1417
|
+
},
|
|
1418
|
+
/* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.ArrowRight01Icon, size: 14 })
|
|
1419
|
+
)))))), 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]) => {
|
|
1420
|
+
if (key === "fromAddress" || key === "toAddress") return null;
|
|
1421
|
+
if (value === null || value === void 0 || typeof value === "object") return null;
|
|
1422
|
+
const formattedKey = key.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase());
|
|
1423
|
+
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)));
|
|
1424
|
+
})), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react23.default.createElement(
|
|
1425
|
+
ThreeDActionButton,
|
|
1426
|
+
{
|
|
1427
|
+
onClick: handleGenerateReceipt,
|
|
1428
|
+
isLoading: isGeneratingReceipt,
|
|
1429
|
+
className: "w-full py-3 text-[14px]"
|
|
1430
|
+
},
|
|
1431
|
+
"Generate Receipt"
|
|
1432
|
+
), /* @__PURE__ */ import_react23.default.createElement(
|
|
1433
|
+
"button",
|
|
1434
|
+
{
|
|
1435
|
+
onClick: () => onReportTransaction && onReportTransaction(selectedTransaction),
|
|
1436
|
+
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"
|
|
1437
|
+
},
|
|
1438
|
+
"Report Transaction"
|
|
1439
|
+
), selectedTransaction.type === "WALLET_TRANSACTION" && /* @__PURE__ */ import_react23.default.createElement(
|
|
1440
|
+
"a",
|
|
1441
|
+
{
|
|
1442
|
+
href: `https://basescan.org/tx/${selectedTransaction.reference}`,
|
|
1443
|
+
target: "_blank",
|
|
1444
|
+
rel: "noopener noreferrer",
|
|
1445
|
+
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"
|
|
1446
|
+
},
|
|
1447
|
+
"View in block explorer"
|
|
1448
|
+
))))), 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(
|
|
1449
|
+
"button",
|
|
1450
|
+
{
|
|
1451
|
+
key: option,
|
|
1452
|
+
onClick: () => {
|
|
1453
|
+
onDirectionFilterChange(option);
|
|
1454
|
+
setIsDirectionModalOpen(false);
|
|
1455
|
+
},
|
|
1456
|
+
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"}`
|
|
1457
|
+
},
|
|
1458
|
+
/* @__PURE__ */ import_react23.default.createElement("span", { className: "truncate pr-2" }, option.charAt(0).toUpperCase() + option.slice(1).toLowerCase())
|
|
1459
|
+
))), /* @__PURE__ */ import_react23.default.createElement("div", { className: "w-full flex mt-2 " }, /* @__PURE__ */ import_react23.default.createElement(
|
|
1460
|
+
"button",
|
|
1461
|
+
{
|
|
1462
|
+
onClick: () => setIsDirectionModalOpen(false),
|
|
1463
|
+
className: "w-full py-4 text-[13px] text-neutral-500 hover:text-black transition-colors outline-none font-medium"
|
|
1464
|
+
},
|
|
1465
|
+
"Cancel"
|
|
1466
|
+
)))), 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" }, [
|
|
1467
|
+
{ label: "All Transactions", value: "ALL" },
|
|
1468
|
+
{ label: "Wallet Transactions", value: "WALLET_TRANSACTION" },
|
|
1469
|
+
{ label: "Card Transactions", value: "CARD_TRANSACTION" }
|
|
1470
|
+
].map((option) => /* @__PURE__ */ import_react23.default.createElement(
|
|
1471
|
+
"button",
|
|
1472
|
+
{
|
|
1473
|
+
key: option.value,
|
|
1474
|
+
onClick: () => {
|
|
1475
|
+
onTypeFilterChange(option.value);
|
|
1476
|
+
setIsTypeModalOpen(false);
|
|
1477
|
+
},
|
|
1478
|
+
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"}`
|
|
1479
|
+
},
|
|
1480
|
+
/* @__PURE__ */ import_react23.default.createElement("span", { className: "truncate pr-2" }, option.label.charAt(0).toUpperCase() + option.label.slice(1).toLowerCase())
|
|
1481
|
+
))), /* @__PURE__ */ import_react23.default.createElement("div", { className: "w-full flex mt-2 " }, /* @__PURE__ */ import_react23.default.createElement(
|
|
1482
|
+
"button",
|
|
1483
|
+
{
|
|
1484
|
+
onClick: () => setIsTypeModalOpen(false),
|
|
1485
|
+
className: "w-full py-4 text-[13px] text-neutral-500 hover:text-black transition-colors outline-none font-medium"
|
|
1486
|
+
},
|
|
1487
|
+
"Cancel"
|
|
1488
|
+
)))));
|
|
1489
|
+
};
|
|
1490
|
+
|
|
1491
|
+
// src/components/UniversalHomeView.tsx
|
|
1492
|
+
var import_react25 = __toESM(require("react"));
|
|
1493
|
+
var import_react26 = require("@hugeicons/react");
|
|
1494
|
+
var import_core_free_icons8 = require("@hugeicons/core-free-icons");
|
|
1495
|
+
var UniversalHomeView = ({
|
|
1496
|
+
balanceLabel = "Your Balance",
|
|
1497
|
+
balanceAmount,
|
|
1498
|
+
balanceCurrency = "$",
|
|
1499
|
+
primaryAction,
|
|
1500
|
+
secondaryAction,
|
|
1501
|
+
transactionsProps
|
|
1502
|
+
}) => {
|
|
1503
|
+
const [displayAmount, setDisplayAmount] = (0, import_react25.useState)("0.00");
|
|
1504
|
+
const [isBalanceHidden, setIsBalanceHidden] = (0, import_react25.useState)(false);
|
|
1505
|
+
(0, import_react25.useEffect)(() => {
|
|
1506
|
+
const target = parseFloat(balanceAmount.replace(/,/g, ""));
|
|
1507
|
+
if (isNaN(target)) {
|
|
1508
|
+
setDisplayAmount(balanceAmount);
|
|
1509
|
+
return;
|
|
1510
|
+
}
|
|
1511
|
+
let startTimestamp = null;
|
|
1512
|
+
const duration = 1e3;
|
|
1513
|
+
const step = (timestamp) => {
|
|
1514
|
+
if (!startTimestamp) startTimestamp = timestamp;
|
|
1515
|
+
const progress = Math.min((timestamp - startTimestamp) / duration, 1);
|
|
1516
|
+
const easeProgress = progress === 1 ? 1 : 1 - Math.pow(2, -10 * progress);
|
|
1517
|
+
const currentCount = easeProgress * target;
|
|
1518
|
+
setDisplayAmount(currentCount.toLocaleString("en-US", {
|
|
1519
|
+
minimumFractionDigits: 2,
|
|
1520
|
+
maximumFractionDigits: 2
|
|
1521
|
+
}));
|
|
1522
|
+
if (progress < 1) {
|
|
1523
|
+
requestAnimationFrame(step);
|
|
1524
|
+
} else {
|
|
1525
|
+
setDisplayAmount(target.toLocaleString("en-US", {
|
|
1526
|
+
minimumFractionDigits: 2,
|
|
1527
|
+
maximumFractionDigits: 2
|
|
1528
|
+
}));
|
|
1529
|
+
}
|
|
1530
|
+
};
|
|
1531
|
+
requestAnimationFrame(step);
|
|
1532
|
+
}, [balanceAmount]);
|
|
1533
|
+
const [intPart, decPart] = displayAmount.includes(".") ? displayAmount.split(".") : [displayAmount, "00"];
|
|
1534
|
+
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(
|
|
1535
|
+
"button",
|
|
1536
|
+
{
|
|
1537
|
+
onClick: () => setIsBalanceHidden(!isBalanceHidden),
|
|
1538
|
+
className: "text-neutral-400 hover:text-black transition-colors outline-none"
|
|
1539
|
+
},
|
|
1540
|
+
/* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: isBalanceHidden ? import_core_free_icons8.ViewIcon : import_core_free_icons8.ViewOffSlashIcon, size: 14 })
|
|
1541
|
+
)), /* @__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(
|
|
1542
|
+
ThreeDActionButton,
|
|
1543
|
+
{
|
|
1544
|
+
onClick: primaryAction.onClick,
|
|
1545
|
+
className: "px-6 py-2.5 sm:px-8 sm:py-2.5"
|
|
1546
|
+
},
|
|
1547
|
+
/* @__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 }))
|
|
1548
|
+
), secondaryAction && /* @__PURE__ */ import_react25.default.createElement(
|
|
1549
|
+
"button",
|
|
1550
|
+
{
|
|
1551
|
+
onClick: secondaryAction.onClick,
|
|
1552
|
+
className: "flex items-center gap-1.5 px-6 py-2.5 sm:px-8 sm:py-2.5 rounded-full bg-white border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none"
|
|
1553
|
+
},
|
|
1554
|
+
/* @__PURE__ */ import_react25.default.createElement("span", { className: "text-[13px] tracking-wide font-medium" }, secondaryAction.label),
|
|
1555
|
+
secondaryAction.icon && /* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: secondaryAction.icon, size: 16 })
|
|
1556
|
+
)))), /* @__PURE__ */ import_react25.default.createElement("div", { className: "w-full mt-2" }, /* @__PURE__ */ import_react25.default.createElement(
|
|
1557
|
+
UniversalTransactionPage,
|
|
1558
|
+
{
|
|
1559
|
+
...transactionsProps,
|
|
1560
|
+
hideControls: true,
|
|
1561
|
+
hideBalanceAmounts: isBalanceHidden,
|
|
1562
|
+
hidePagination: true
|
|
1563
|
+
}
|
|
1564
|
+
)));
|
|
1565
|
+
};
|
|
1566
|
+
|
|
1567
|
+
// src/components/UniversalWalletPage.tsx
|
|
1568
|
+
var import_react27 = __toESM(require("react"));
|
|
1569
|
+
var import_react_hot_toast6 = __toESM(require("react-hot-toast"));
|
|
1570
|
+
var import_react28 = require("@hugeicons/react");
|
|
1571
|
+
var import_core_free_icons9 = require("@hugeicons/core-free-icons");
|
|
1572
|
+
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" }));
|
|
1573
|
+
var WalletLogo = ({ src, alt, sizeClass = "w-10 h-10" }) => {
|
|
1574
|
+
const [isLoaded, setIsLoaded] = (0, import_react27.useState)(false);
|
|
1575
|
+
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(
|
|
1576
|
+
"img",
|
|
1577
|
+
{
|
|
1578
|
+
src,
|
|
1579
|
+
alt,
|
|
1580
|
+
onLoad: () => setIsLoaded(true),
|
|
1581
|
+
className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}`
|
|
1582
|
+
}
|
|
1583
|
+
));
|
|
1584
|
+
};
|
|
1585
|
+
var UniversalWalletPage = ({
|
|
1586
|
+
headerTitle,
|
|
1587
|
+
headerDescription,
|
|
1588
|
+
hideControls = false,
|
|
1589
|
+
hideBalanceAmounts = false,
|
|
1590
|
+
isGeneratingStatement = false,
|
|
1591
|
+
wallets,
|
|
1592
|
+
isLoading = false,
|
|
1593
|
+
renderQrCode,
|
|
1594
|
+
onDownloadPayId,
|
|
1595
|
+
onCopyAddress
|
|
1596
|
+
}) => {
|
|
1597
|
+
const [selectedWallet, setSelectedWallet] = (0, import_react27.useState)(null);
|
|
1598
|
+
const [localSearchQuery, setLocalSearchQuery] = (0, import_react27.useState)("");
|
|
1599
|
+
const filteredWallets = wallets.filter((wallet) => {
|
|
1600
|
+
const q = localSearchQuery.toLowerCase();
|
|
1601
|
+
return wallet.name.toLowerCase().includes(q) || wallet.currency.toLowerCase().includes(q) || wallet.network.toLowerCase().includes(q);
|
|
1602
|
+
});
|
|
1603
|
+
const handleCopy = (wallet) => {
|
|
1604
|
+
if (onCopyAddress) onCopyAddress(wallet);
|
|
1605
|
+
if (typeof navigator !== "undefined" && navigator.clipboard) {
|
|
1606
|
+
navigator.clipboard.writeText(wallet.address).catch(() => {
|
|
1607
|
+
});
|
|
1608
|
+
}
|
|
1609
|
+
import_react_hot_toast6.default.success("Address copied to clipboard");
|
|
1610
|
+
};
|
|
1611
|
+
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(
|
|
1612
|
+
"input",
|
|
1613
|
+
{
|
|
1614
|
+
type: "text",
|
|
1615
|
+
placeholder: "Search wallets by name or network...",
|
|
1616
|
+
value: localSearchQuery,
|
|
1617
|
+
onChange: (e) => setLocalSearchQuery(e.target.value),
|
|
1618
|
+
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"
|
|
1619
|
+
}
|
|
1620
|
+
))), /* @__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(
|
|
1621
|
+
"div",
|
|
1622
|
+
{
|
|
1623
|
+
key: wallet.id,
|
|
1624
|
+
onClick: () => setSelectedWallet(wallet),
|
|
1625
|
+
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"
|
|
1626
|
+
},
|
|
1627
|
+
/* @__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))),
|
|
1628
|
+
/* @__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))
|
|
1629
|
+
)))))), 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(
|
|
1630
|
+
ThreeDActionButton,
|
|
1631
|
+
{
|
|
1632
|
+
onClick: () => onDownloadPayId && onDownloadPayId(selectedWallet),
|
|
1633
|
+
isLoading: isGeneratingStatement,
|
|
1634
|
+
className: "w-full py-3 text-[13px]"
|
|
1635
|
+
},
|
|
1636
|
+
"Generate Statement"
|
|
1637
|
+
), /* @__PURE__ */ import_react27.default.createElement(
|
|
1638
|
+
"button",
|
|
1639
|
+
{
|
|
1640
|
+
onClick: () => handleCopy(selectedWallet),
|
|
1641
|
+
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"
|
|
1642
|
+
},
|
|
1643
|
+
"Copy Wallet Address"
|
|
1644
|
+
))))));
|
|
1645
|
+
};
|
|
1646
|
+
|
|
1647
|
+
// src/components/UniversalCardPage.tsx
|
|
1648
|
+
var import_react29 = __toESM(require("react"));
|
|
1649
|
+
var import_react30 = require("@hugeicons/react");
|
|
1650
|
+
var import_core_free_icons10 = require("@hugeicons/core-free-icons");
|
|
1651
|
+
var UniversalCardPage = ({
|
|
1652
|
+
cardHolderName,
|
|
1653
|
+
cardNumber,
|
|
1654
|
+
expiry,
|
|
1655
|
+
cvv,
|
|
1656
|
+
cardBgSrc,
|
|
1657
|
+
companyLogoSrc,
|
|
1658
|
+
networkLogoSrc,
|
|
1659
|
+
onReveal,
|
|
1660
|
+
onFreeze,
|
|
1661
|
+
onSetLimits,
|
|
1662
|
+
onDelete
|
|
1663
|
+
}) => {
|
|
1664
|
+
const [isFlipped, setIsFlipped] = (0, import_react29.useState)(false);
|
|
1665
|
+
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(
|
|
1666
|
+
"div",
|
|
1667
|
+
{
|
|
1668
|
+
onClick: () => setIsFlipped(!isFlipped),
|
|
1669
|
+
className: "relative w-full h-50.5 cursor-pointer transition-transform duration-700",
|
|
1670
|
+
style: {
|
|
1671
|
+
transformStyle: "preserve-3d",
|
|
1672
|
+
transform: isFlipped ? "rotateY(180deg)" : "rotateY(0deg)"
|
|
1673
|
+
}
|
|
1674
|
+
},
|
|
1675
|
+
/* @__PURE__ */ import_react29.default.createElement(
|
|
1676
|
+
"div",
|
|
1677
|
+
{
|
|
1678
|
+
className: "absolute inset-0 w-full h-full rounded-2xl overflow-hidden shadow-xl",
|
|
1679
|
+
style: { backfaceVisibility: "hidden" }
|
|
1680
|
+
},
|
|
1681
|
+
/* @__PURE__ */ import_react29.default.createElement(
|
|
1682
|
+
"div",
|
|
1683
|
+
{
|
|
1684
|
+
className: "absolute inset-0 bg-cover bg-center",
|
|
1685
|
+
style: { backgroundImage: `url(${cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
1686
|
+
}
|
|
1687
|
+
),
|
|
1688
|
+
/* @__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" })))
|
|
1689
|
+
),
|
|
1690
|
+
/* @__PURE__ */ import_react29.default.createElement(
|
|
1691
|
+
"div",
|
|
1692
|
+
{
|
|
1693
|
+
className: "absolute inset-0 w-full h-full rounded-2xl overflow-hidden shadow-xl",
|
|
1694
|
+
style: {
|
|
1695
|
+
backfaceVisibility: "hidden",
|
|
1696
|
+
transform: "rotateY(180deg)"
|
|
1697
|
+
}
|
|
1698
|
+
},
|
|
1699
|
+
/* @__PURE__ */ import_react29.default.createElement(
|
|
1700
|
+
"div",
|
|
1701
|
+
{
|
|
1702
|
+
className: "absolute inset-0 bg-cover bg-center",
|
|
1703
|
+
style: { backgroundImage: `url(${cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
1704
|
+
}
|
|
1705
|
+
),
|
|
1706
|
+
/* @__PURE__ */ import_react29.default.createElement("div", { className: "absolute top-6 left-0 right-0 h-10 bg-black/80 w-full" }),
|
|
1707
|
+
/* @__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))))
|
|
1708
|
+
)
|
|
1709
|
+
)), /* @__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(
|
|
1710
|
+
MenuRow,
|
|
1711
|
+
{
|
|
1712
|
+
icon: import_core_free_icons10.EyeIcon,
|
|
1713
|
+
title: "Reveal Information",
|
|
1714
|
+
subtitle: "Show card informations",
|
|
1715
|
+
onClick: onReveal
|
|
1716
|
+
}
|
|
1717
|
+
), /* @__PURE__ */ import_react29.default.createElement(
|
|
1718
|
+
MenuRow,
|
|
1719
|
+
{
|
|
1720
|
+
icon: import_core_free_icons10.SnowIcon,
|
|
1721
|
+
title: "Freeze",
|
|
1722
|
+
subtitle: "Freeze & Unfreeze card",
|
|
1723
|
+
onClick: onFreeze
|
|
1724
|
+
}
|
|
1725
|
+
), /* @__PURE__ */ import_react29.default.createElement(
|
|
1726
|
+
MenuRow,
|
|
1727
|
+
{
|
|
1728
|
+
icon: import_core_free_icons10.Settings02Icon,
|
|
1729
|
+
title: "Set Limits",
|
|
1730
|
+
subtitle: "Set card limits",
|
|
1731
|
+
onClick: onSetLimits,
|
|
1732
|
+
isLast: true
|
|
1733
|
+
}
|
|
1734
|
+
)), /* @__PURE__ */ import_react29.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react29.default.createElement(
|
|
1735
|
+
MenuRow,
|
|
1736
|
+
{
|
|
1737
|
+
icon: import_core_free_icons10.Delete02Icon,
|
|
1738
|
+
title: "Delete card",
|
|
1739
|
+
subtitle: "Permanently delete card",
|
|
1740
|
+
onClick: onDelete,
|
|
1741
|
+
isLast: true
|
|
1742
|
+
}
|
|
1743
|
+
))));
|
|
1744
|
+
};
|
|
1745
|
+
var MenuRow = ({ icon, title, subtitle, onClick, iconColor = "text-black", titleColor = "text-black", isLast = false }) => /* @__PURE__ */ import_react29.default.createElement(
|
|
1746
|
+
"div",
|
|
1747
|
+
{
|
|
1748
|
+
onClick,
|
|
1749
|
+
className: `flex items-center p-4 cursor-pointer hover:bg-neutral-50 transition-colors ${!isLast ? "border-b border-neutral-100" : ""}`
|
|
1750
|
+
},
|
|
1751
|
+
/* @__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 })),
|
|
1752
|
+
/* @__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)),
|
|
1753
|
+
/* @__PURE__ */ import_react29.default.createElement(import_react30.HugeiconsIcon, { icon: import_core_free_icons10.ArrowRight01Icon, size: 20, className: "text-neutral-400 shrink-0 ml-2" })
|
|
1754
|
+
);
|
|
1755
|
+
|
|
1756
|
+
// src/components/UniversalProfilePage.tsx
|
|
1757
|
+
var import_react31 = __toESM(require("react"));
|
|
1758
|
+
var import_react32 = require("@hugeicons/react");
|
|
1759
|
+
var import_core_free_icons11 = require("@hugeicons/core-free-icons");
|
|
1760
|
+
var UniversalProfilePage = ({
|
|
1761
|
+
avatarSrc,
|
|
1762
|
+
roleName,
|
|
1763
|
+
memberSince,
|
|
1764
|
+
onAccountTap,
|
|
1765
|
+
onSecurityTap,
|
|
1766
|
+
onNotificationsTap,
|
|
1767
|
+
onHelpTap,
|
|
1768
|
+
onVerificationsTap,
|
|
1769
|
+
onExportTap,
|
|
1770
|
+
onLogoutTap,
|
|
1771
|
+
onDeleteTap
|
|
1772
|
+
}) => {
|
|
1773
|
+
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(
|
|
1774
|
+
"img",
|
|
1775
|
+
{
|
|
1776
|
+
src: avatarSrc,
|
|
1777
|
+
alt: "User Avatar",
|
|
1778
|
+
className: "w-full h-full object-cover"
|
|
1779
|
+
}
|
|
1780
|
+
) : /* @__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(
|
|
1781
|
+
MenuRow2,
|
|
1782
|
+
{
|
|
1783
|
+
icon: import_core_free_icons11.UserIcon,
|
|
1784
|
+
title: "Account",
|
|
1785
|
+
subtitle: "Your account details",
|
|
1786
|
+
onClick: onAccountTap
|
|
1787
|
+
}
|
|
1788
|
+
), /* @__PURE__ */ import_react31.default.createElement(
|
|
1789
|
+
MenuRow2,
|
|
1790
|
+
{
|
|
1791
|
+
icon: import_core_free_icons11.LockKeyIcon,
|
|
1792
|
+
title: "Security",
|
|
1793
|
+
subtitle: "2FA & authentication",
|
|
1794
|
+
onClick: onSecurityTap
|
|
1795
|
+
}
|
|
1796
|
+
), /* @__PURE__ */ import_react31.default.createElement(
|
|
1797
|
+
MenuRow2,
|
|
1798
|
+
{
|
|
1799
|
+
icon: import_core_free_icons11.Notification03Icon,
|
|
1800
|
+
title: "Notifications",
|
|
1801
|
+
subtitle: "Manage notifications",
|
|
1802
|
+
onClick: onNotificationsTap
|
|
1803
|
+
}
|
|
1804
|
+
), /* @__PURE__ */ import_react31.default.createElement(
|
|
1805
|
+
MenuRow2,
|
|
1806
|
+
{
|
|
1807
|
+
icon: import_core_free_icons11.HelpCircleIcon,
|
|
1808
|
+
title: "Get Help",
|
|
1809
|
+
subtitle: "24/7 Support",
|
|
1810
|
+
onClick: onHelpTap,
|
|
1811
|
+
isLast: true
|
|
1812
|
+
}
|
|
1813
|
+
)), /* @__PURE__ */ import_react31.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden shadow-sm" }, /* @__PURE__ */ import_react31.default.createElement(
|
|
1814
|
+
MenuRow2,
|
|
1815
|
+
{
|
|
1816
|
+
icon: import_core_free_icons11.Shield01Icon,
|
|
1817
|
+
title: "Verifications",
|
|
1818
|
+
subtitle: "Account Verifications",
|
|
1819
|
+
onClick: onVerificationsTap
|
|
1820
|
+
}
|
|
1821
|
+
), /* @__PURE__ */ import_react31.default.createElement(
|
|
1822
|
+
MenuRow2,
|
|
1823
|
+
{
|
|
1824
|
+
icon: import_core_free_icons11.Download04Icon,
|
|
1825
|
+
title: "Export Account",
|
|
1826
|
+
subtitle: "Transfer your account",
|
|
1827
|
+
onClick: onExportTap
|
|
1828
|
+
}
|
|
1829
|
+
), /* @__PURE__ */ import_react31.default.createElement(
|
|
1830
|
+
MenuRow2,
|
|
1831
|
+
{
|
|
1832
|
+
icon: import_core_free_icons11.Logout03Icon,
|
|
1833
|
+
title: "LogOut",
|
|
1834
|
+
subtitle: "End your session",
|
|
1835
|
+
onClick: onLogoutTap,
|
|
1836
|
+
isLast: true
|
|
1837
|
+
}
|
|
1838
|
+
)), /* @__PURE__ */ import_react31.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden shadow-sm mb-4" }, /* @__PURE__ */ import_react31.default.createElement(
|
|
1839
|
+
MenuRow2,
|
|
1840
|
+
{
|
|
1841
|
+
icon: import_core_free_icons11.Delete02Icon,
|
|
1842
|
+
title: "Delete Account",
|
|
1843
|
+
subtitle: "Remove account",
|
|
1844
|
+
onClick: onDeleteTap,
|
|
1845
|
+
isLast: true
|
|
1846
|
+
}
|
|
1847
|
+
))));
|
|
1848
|
+
};
|
|
1849
|
+
var MenuRow2 = ({ icon, title, subtitle, onClick, iconColor = "text-black", titleColor = "text-black", isLast = false }) => /* @__PURE__ */ import_react31.default.createElement(
|
|
1850
|
+
"div",
|
|
1851
|
+
{
|
|
1852
|
+
onClick,
|
|
1853
|
+
className: `flex items-center p-4 cursor-pointer hover:bg-neutral-50 transition-colors ${!isLast ? "border-b border-neutral-100" : ""}`
|
|
1854
|
+
},
|
|
1855
|
+
/* @__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 })),
|
|
1856
|
+
/* @__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)),
|
|
1857
|
+
/* @__PURE__ */ import_react31.default.createElement(import_react32.HugeiconsIcon, { icon: import_core_free_icons11.ArrowRight01Icon, size: 20, className: "text-neutral-400 shrink-0 ml-2" })
|
|
1858
|
+
);
|
|
1859
|
+
|
|
1860
|
+
// src/components/HeroSection.tsx
|
|
1861
|
+
var import_react34 = __toESM(require("react"));
|
|
1862
|
+
var import_link5 = __toESM(require("next/link"));
|
|
1863
|
+
var import_image2 = __toESM(require("next/image"));
|
|
1864
|
+
|
|
464
1865
|
// src/components/WaitlistDialog.tsx
|
|
1866
|
+
var import_react33 = __toESM(require("react"));
|
|
1867
|
+
var import_react_hot_toast7 = require("react-hot-toast");
|
|
465
1868
|
var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
466
|
-
const [email, setEmail] = (0,
|
|
467
|
-
const [isLoading, setIsLoading] = (0,
|
|
1869
|
+
const [email, setEmail] = (0, import_react33.useState)("");
|
|
1870
|
+
const [isLoading, setIsLoading] = (0, import_react33.useState)(false);
|
|
468
1871
|
if (!isOpen) return null;
|
|
469
1872
|
const handleSubmit = async (e) => {
|
|
470
1873
|
e.preventDefault();
|
|
471
1874
|
if (!email || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) {
|
|
472
|
-
|
|
1875
|
+
import_react_hot_toast7.toast.error("Please enter a valid email address.");
|
|
473
1876
|
return;
|
|
474
1877
|
}
|
|
475
1878
|
setIsLoading(true);
|
|
@@ -483,24 +1886,24 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
483
1886
|
});
|
|
484
1887
|
const data = await response.json();
|
|
485
1888
|
if (response.ok && data.success) {
|
|
486
|
-
|
|
1889
|
+
import_react_hot_toast7.toast.success(data.message || "You've been added to the waitlist!");
|
|
487
1890
|
setEmail("");
|
|
488
1891
|
onClose();
|
|
489
1892
|
} else {
|
|
490
|
-
|
|
1893
|
+
import_react_hot_toast7.toast.error(data.error || "Something went wrong. Please try again.");
|
|
491
1894
|
}
|
|
492
1895
|
} catch (error) {
|
|
493
|
-
|
|
1896
|
+
import_react_hot_toast7.toast.error("Network error. Please check your connection.");
|
|
494
1897
|
} finally {
|
|
495
1898
|
setIsLoading(false);
|
|
496
1899
|
}
|
|
497
1900
|
};
|
|
498
|
-
return /* @__PURE__ */
|
|
1901
|
+
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
1902
|
"div",
|
|
500
1903
|
{
|
|
501
1904
|
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
1905
|
},
|
|
503
|
-
/* @__PURE__ */
|
|
1906
|
+
/* @__PURE__ */ import_react33.default.createElement(
|
|
504
1907
|
"button",
|
|
505
1908
|
{
|
|
506
1909
|
onClick: onClose,
|
|
@@ -508,7 +1911,7 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
508
1911
|
className: "absolute top-4 right-4 p-2 text-neutral-700 hover:text-neutral-400 transition-colors disabled:opacity-50 outline-none",
|
|
509
1912
|
"aria-label": "Close dialog"
|
|
510
1913
|
},
|
|
511
|
-
/* @__PURE__ */
|
|
1914
|
+
/* @__PURE__ */ import_react33.default.createElement(
|
|
512
1915
|
"svg",
|
|
513
1916
|
{
|
|
514
1917
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -521,11 +1924,11 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
521
1924
|
strokeLinecap: "round",
|
|
522
1925
|
strokeLinejoin: "round"
|
|
523
1926
|
},
|
|
524
|
-
/* @__PURE__ */
|
|
525
|
-
/* @__PURE__ */
|
|
1927
|
+
/* @__PURE__ */ import_react33.default.createElement("path", { d: "M18 6 6 18" }),
|
|
1928
|
+
/* @__PURE__ */ import_react33.default.createElement("path", { d: "m6 6 12 12" })
|
|
526
1929
|
)
|
|
527
1930
|
),
|
|
528
|
-
/* @__PURE__ */
|
|
1931
|
+
/* @__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
1932
|
TextInput,
|
|
530
1933
|
{
|
|
531
1934
|
label: "Email ID",
|
|
@@ -535,7 +1938,7 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
535
1938
|
placeholder: "name@example.com",
|
|
536
1939
|
disabled: isLoading
|
|
537
1940
|
}
|
|
538
|
-
), /* @__PURE__ */
|
|
1941
|
+
), /* @__PURE__ */ import_react33.default.createElement(
|
|
539
1942
|
ThreeDActionButton,
|
|
540
1943
|
{
|
|
541
1944
|
type: "submit",
|
|
@@ -568,10 +1971,10 @@ var HeroSection = ({
|
|
|
568
1971
|
bgImageSrc,
|
|
569
1972
|
isWaitlist = false
|
|
570
1973
|
}) => {
|
|
571
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
572
|
-
const [isWaitlistOpen, setIsWaitlistOpen] = (0,
|
|
573
|
-
const titleRef = (0,
|
|
574
|
-
(0,
|
|
1974
|
+
const [isAnimating, setIsAnimating] = (0, import_react34.useState)(false);
|
|
1975
|
+
const [isWaitlistOpen, setIsWaitlistOpen] = (0, import_react34.useState)(false);
|
|
1976
|
+
const titleRef = (0, import_react34.useRef)(null);
|
|
1977
|
+
(0, import_react34.useEffect)(() => {
|
|
575
1978
|
const observer = new IntersectionObserver(
|
|
576
1979
|
([entry]) => {
|
|
577
1980
|
if (entry.isIntersecting) {
|
|
@@ -593,7 +1996,7 @@ var HeroSection = ({
|
|
|
593
1996
|
setIsWaitlistOpen(true);
|
|
594
1997
|
}
|
|
595
1998
|
};
|
|
596
|
-
return /* @__PURE__ */
|
|
1999
|
+
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
2000
|
"video",
|
|
598
2001
|
{
|
|
599
2002
|
src: bgVideoSrc,
|
|
@@ -604,7 +2007,7 @@ var HeroSection = ({
|
|
|
604
2007
|
playsInline: true,
|
|
605
2008
|
className: "absolute inset-0 h-full w-full object-cover z-0"
|
|
606
2009
|
}
|
|
607
|
-
) : bgImageSrc ? /* @__PURE__ */
|
|
2010
|
+
) : bgImageSrc ? /* @__PURE__ */ import_react34.default.createElement(
|
|
608
2011
|
import_image2.default,
|
|
609
2012
|
{
|
|
610
2013
|
src: bgImageSrc,
|
|
@@ -613,7 +2016,7 @@ var HeroSection = ({
|
|
|
613
2016
|
priority: true,
|
|
614
2017
|
className: "absolute inset-0 h-full w-full object-cover z-0"
|
|
615
2018
|
}
|
|
616
|
-
) : null, /* @__PURE__ */
|
|
2019
|
+
) : null, /* @__PURE__ */ import_react34.default.createElement(
|
|
617
2020
|
"div",
|
|
618
2021
|
{
|
|
619
2022
|
className: "pointer-events-none absolute inset-0 z-10 opacity-[0.7] mix-blend-overlay",
|
|
@@ -621,31 +2024,31 @@ var HeroSection = ({
|
|
|
621
2024
|
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
2025
|
}
|
|
623
2026
|
}
|
|
624
|
-
), /* @__PURE__ */
|
|
2027
|
+
), /* @__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
2028
|
"h1",
|
|
626
2029
|
{
|
|
627
2030
|
ref: titleRef,
|
|
628
2031
|
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
2032
|
},
|
|
630
|
-
/* @__PURE__ */
|
|
631
|
-
)), /* @__PURE__ */
|
|
632
|
-
/* @__PURE__ */
|
|
633
|
-
|
|
2033
|
+
/* @__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" }, "*")))
|
|
2034
|
+
)), /* @__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!
|
|
2035
|
+
/* @__PURE__ */ import_react34.default.createElement(
|
|
2036
|
+
import_link5.default,
|
|
634
2037
|
{
|
|
635
2038
|
href: isWaitlist ? "#" : ctaHref || "#",
|
|
636
2039
|
onClick: handleCtaClick,
|
|
637
2040
|
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
2041
|
},
|
|
639
2042
|
ctaText,
|
|
640
|
-
/* @__PURE__ */
|
|
641
|
-
), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */
|
|
642
|
-
|
|
2043
|
+
/* @__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" })))
|
|
2044
|
+
), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react34.default.createElement(
|
|
2045
|
+
import_link5.default,
|
|
643
2046
|
{
|
|
644
2047
|
href: secondaryCtaHref,
|
|
645
2048
|
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
2049
|
},
|
|
647
2050
|
secondaryCtaText
|
|
648
|
-
)), showApps && appLogos && appLogos.length > 0 && /* @__PURE__ */
|
|
2051
|
+
)), 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
2052
|
import_image2.default,
|
|
650
2053
|
{
|
|
651
2054
|
src: logo.src,
|
|
@@ -654,7 +2057,7 @@ var HeroSection = ({
|
|
|
654
2057
|
height: 28,
|
|
655
2058
|
className: "object-contain"
|
|
656
2059
|
}
|
|
657
|
-
))))))))), /* @__PURE__ */
|
|
2060
|
+
))))))))), /* @__PURE__ */ import_react34.default.createElement(
|
|
658
2061
|
WaitlistDialog,
|
|
659
2062
|
{
|
|
660
2063
|
isOpen: isWaitlistOpen,
|
|
@@ -664,12 +2067,12 @@ var HeroSection = ({
|
|
|
664
2067
|
};
|
|
665
2068
|
|
|
666
2069
|
// src/components/AppBento2.tsx
|
|
667
|
-
var
|
|
668
|
-
var
|
|
2070
|
+
var import_react35 = __toESM(require("react"));
|
|
2071
|
+
var import_react36 = require("@hugeicons/react");
|
|
669
2072
|
var AppBento2 = ({ tagline, headline, features }) => {
|
|
670
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
671
|
-
const titleRef = (0,
|
|
672
|
-
(0,
|
|
2073
|
+
const [isAnimating, setIsAnimating] = (0, import_react35.useState)(false);
|
|
2074
|
+
const titleRef = (0, import_react35.useRef)(null);
|
|
2075
|
+
(0, import_react35.useEffect)(() => {
|
|
673
2076
|
const observer = new IntersectionObserver(
|
|
674
2077
|
([entry]) => {
|
|
675
2078
|
if (entry.isIntersecting) {
|
|
@@ -687,7 +2090,7 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
687
2090
|
}
|
|
688
2091
|
return () => observer.disconnect();
|
|
689
2092
|
}, []);
|
|
690
|
-
return /* @__PURE__ */
|
|
2093
|
+
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
2094
|
"h2",
|
|
692
2095
|
{
|
|
693
2096
|
ref: titleRef,
|
|
@@ -695,7 +2098,7 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
695
2098
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
696
2099
|
},
|
|
697
2100
|
headline
|
|
698
|
-
))), /* @__PURE__ */
|
|
2101
|
+
))), /* @__PURE__ */ import_react35.default.createElement("div", { className: "grid grid-cols-1 lg:grid-cols-6 gap-6" }, features.map((f, i) => {
|
|
699
2102
|
const isWhite = i === 0;
|
|
700
2103
|
const isBlack = i === 1;
|
|
701
2104
|
const isNeutral = i === 2;
|
|
@@ -717,36 +2120,36 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
717
2120
|
const textColor = isBlack ? "text-white" : "text-black";
|
|
718
2121
|
const subTextColor = isBlack ? "text-neutral-300" : "text-neutral-600";
|
|
719
2122
|
const labelColor = isBlack ? "text-neutral-400" : "text-neutral-500";
|
|
720
|
-
return /* @__PURE__ */
|
|
2123
|
+
return /* @__PURE__ */ import_react35.default.createElement(
|
|
721
2124
|
"div",
|
|
722
2125
|
{
|
|
723
2126
|
key: i,
|
|
724
2127
|
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
2128
|
style: { boxShadow: getShadowStyle() }
|
|
726
2129
|
},
|
|
727
|
-
/* @__PURE__ */
|
|
2130
|
+
/* @__PURE__ */ import_react35.default.createElement(
|
|
728
2131
|
"div",
|
|
729
2132
|
{
|
|
730
2133
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
731
2134
|
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
2135
|
}
|
|
733
2136
|
),
|
|
734
|
-
isBlack && /* @__PURE__ */
|
|
735
|
-
/* @__PURE__ */
|
|
736
|
-
/* @__PURE__ */
|
|
2137
|
+
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" }),
|
|
2138
|
+
/* @__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 }))),
|
|
2139
|
+
/* @__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
2140
|
);
|
|
738
2141
|
})))));
|
|
739
2142
|
};
|
|
740
2143
|
|
|
741
2144
|
// src/components/FeatureScroll.tsx
|
|
742
|
-
var
|
|
2145
|
+
var import_react37 = __toESM(require("react"));
|
|
743
2146
|
var import_image3 = __toESM(require("next/image"));
|
|
744
|
-
var
|
|
745
|
-
var
|
|
2147
|
+
var import_react38 = require("@hugeicons/react");
|
|
2148
|
+
var import_core_free_icons12 = require("@hugeicons/core-free-icons");
|
|
746
2149
|
var FeatureCard = ({ feature, bgImage }) => {
|
|
747
|
-
const [isBgLoading, setIsBgLoading] = (0,
|
|
748
|
-
const [isFgLoading, setIsFgLoading] = (0,
|
|
749
|
-
return /* @__PURE__ */
|
|
2150
|
+
const [isBgLoading, setIsBgLoading] = (0, import_react37.useState)(true);
|
|
2151
|
+
const [isFgLoading, setIsFgLoading] = (0, import_react37.useState)(!!feature.image);
|
|
2152
|
+
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
2153
|
import_image3.default,
|
|
751
2154
|
{
|
|
752
2155
|
src: bgImage,
|
|
@@ -759,7 +2162,7 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
759
2162
|
${isBgLoading ? "blur-xl scale-110" : "blur-0 scale-100"}
|
|
760
2163
|
`
|
|
761
2164
|
}
|
|
762
|
-
), /* @__PURE__ */
|
|
2165
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
763
2166
|
"div",
|
|
764
2167
|
{
|
|
765
2168
|
className: "absolute inset-0 w-full h-full pointer-events-none z-0 opacity-[0.25] mix-blend-overlay",
|
|
@@ -767,7 +2170,7 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
767
2170
|
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
2171
|
}
|
|
769
2172
|
}
|
|
770
|
-
), isFgLoading && feature.image && /* @__PURE__ */
|
|
2173
|
+
), 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
2174
|
import_image3.default,
|
|
772
2175
|
{
|
|
773
2176
|
src: feature.image,
|
|
@@ -780,12 +2183,12 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
780
2183
|
${isFgLoading ? "opacity-0 blur-xl" : "opacity-100 blur-0"}
|
|
781
2184
|
`
|
|
782
2185
|
}
|
|
783
|
-
))), /* @__PURE__ */
|
|
2186
|
+
))), /* @__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
2187
|
};
|
|
785
2188
|
var FeatureScroll = ({ tagline, headline, features }) => {
|
|
786
|
-
const scrollRef = (0,
|
|
787
|
-
const [canScrollLeft, setCanScrollLeft] = (0,
|
|
788
|
-
const [canScrollRight, setCanScrollRight] = (0,
|
|
2189
|
+
const scrollRef = (0, import_react37.useRef)(null);
|
|
2190
|
+
const [canScrollLeft, setCanScrollLeft] = (0, import_react37.useState)(false);
|
|
2191
|
+
const [canScrollRight, setCanScrollRight] = (0, import_react37.useState)(true);
|
|
789
2192
|
const checkScroll = () => {
|
|
790
2193
|
if (scrollRef.current) {
|
|
791
2194
|
const { scrollLeft, scrollWidth, clientWidth } = scrollRef.current;
|
|
@@ -793,7 +2196,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
793
2196
|
setCanScrollRight(scrollLeft < scrollWidth - clientWidth - 2);
|
|
794
2197
|
}
|
|
795
2198
|
};
|
|
796
|
-
(0,
|
|
2199
|
+
(0, import_react37.useEffect)(() => {
|
|
797
2200
|
checkScroll();
|
|
798
2201
|
window.addEventListener("resize", checkScroll);
|
|
799
2202
|
return () => window.removeEventListener("resize", checkScroll);
|
|
@@ -809,7 +2212,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
809
2212
|
"https://retinalabs.company/assets/images/bg_6.avif",
|
|
810
2213
|
"https://retinalabs.company/assets/images/bg_1.avif"
|
|
811
2214
|
];
|
|
812
|
-
return /* @__PURE__ */
|
|
2215
|
+
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
2216
|
"button",
|
|
814
2217
|
{
|
|
815
2218
|
onClick: () => scroll("left"),
|
|
@@ -817,8 +2220,8 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
817
2220
|
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
2221
|
"aria-label": "Previous feature"
|
|
819
2222
|
},
|
|
820
|
-
/* @__PURE__ */
|
|
821
|
-
), /* @__PURE__ */
|
|
2223
|
+
/* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons12.ArrowLeft01Icon, size: 20 })
|
|
2224
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
822
2225
|
"button",
|
|
823
2226
|
{
|
|
824
2227
|
onClick: () => scroll("right"),
|
|
@@ -826,57 +2229,57 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
826
2229
|
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
2230
|
"aria-label": "Next feature"
|
|
828
2231
|
},
|
|
829
|
-
/* @__PURE__ */
|
|
830
|
-
))), /* @__PURE__ */
|
|
2232
|
+
/* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons12.ArrowRight01Icon, size: 20 })
|
|
2233
|
+
))), /* @__PURE__ */ import_react37.default.createElement(
|
|
831
2234
|
"div",
|
|
832
2235
|
{
|
|
833
2236
|
ref: scrollRef,
|
|
834
2237
|
onScroll: checkScroll,
|
|
835
2238
|
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
2239
|
},
|
|
837
|
-
features.slice(0, 3).map((feature, idx) => /* @__PURE__ */
|
|
838
|
-
), /* @__PURE__ */
|
|
2240
|
+
features.slice(0, 3).map((feature, idx) => /* @__PURE__ */ import_react37.default.createElement(FeatureCard, { key: idx, feature, bgImage: bgImages[idx] }))
|
|
2241
|
+
), /* @__PURE__ */ import_react37.default.createElement("div", { className: "flex md:hidden items-center justify-center gap-4 mt-2" }, /* @__PURE__ */ import_react37.default.createElement(
|
|
839
2242
|
"button",
|
|
840
2243
|
{
|
|
841
2244
|
onClick: () => scroll("left"),
|
|
842
2245
|
disabled: !canScrollLeft,
|
|
843
2246
|
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
2247
|
},
|
|
845
|
-
/* @__PURE__ */
|
|
846
|
-
), /* @__PURE__ */
|
|
2248
|
+
/* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons12.ArrowLeft01Icon, size: 20 })
|
|
2249
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
847
2250
|
"button",
|
|
848
2251
|
{
|
|
849
2252
|
onClick: () => scroll("right"),
|
|
850
2253
|
disabled: !canScrollRight,
|
|
851
2254
|
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
2255
|
},
|
|
853
|
-
/* @__PURE__ */
|
|
2256
|
+
/* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons12.ArrowRight01Icon, size: 20 })
|
|
854
2257
|
))));
|
|
855
2258
|
};
|
|
856
2259
|
|
|
857
2260
|
// src/components/PlatformFeatures.tsx
|
|
858
|
-
var
|
|
859
|
-
var
|
|
2261
|
+
var import_react39 = __toESM(require("react"));
|
|
2262
|
+
var import_react40 = require("@hugeicons/react");
|
|
860
2263
|
var PlatformFeatures = ({
|
|
861
2264
|
tagline,
|
|
862
2265
|
headline,
|
|
863
2266
|
description,
|
|
864
2267
|
features
|
|
865
2268
|
}) => {
|
|
866
|
-
return /* @__PURE__ */
|
|
2269
|
+
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
2270
|
"div",
|
|
868
2271
|
{
|
|
869
2272
|
key: idx,
|
|
870
2273
|
className: "flex flex-col group animate-in fade-in slide-in-from-bottom-4 duration-700 fill-mode-both",
|
|
871
2274
|
style: { animationDelay: feature.delay || "0ms" }
|
|
872
2275
|
},
|
|
873
|
-
/* @__PURE__ */
|
|
874
|
-
/* @__PURE__ */
|
|
2276
|
+
/* @__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))),
|
|
2277
|
+
/* @__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
2278
|
)))));
|
|
876
2279
|
};
|
|
877
2280
|
|
|
878
2281
|
// src/components/ManagedDocument.tsx
|
|
879
|
-
var
|
|
2282
|
+
var import_react41 = __toESM(require("react"));
|
|
880
2283
|
var ManagedDocument = ({
|
|
881
2284
|
tagline,
|
|
882
2285
|
title,
|
|
@@ -884,9 +2287,9 @@ var ManagedDocument = ({
|
|
|
884
2287
|
contactText,
|
|
885
2288
|
contactEmail
|
|
886
2289
|
}) => {
|
|
887
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
888
|
-
const titleRef = (0,
|
|
889
|
-
(0,
|
|
2290
|
+
const [isAnimating, setIsAnimating] = (0, import_react41.useState)(false);
|
|
2291
|
+
const titleRef = (0, import_react41.useRef)(null);
|
|
2292
|
+
(0, import_react41.useEffect)(() => {
|
|
890
2293
|
const observer = new IntersectionObserver(
|
|
891
2294
|
([entry]) => {
|
|
892
2295
|
if (entry.isIntersecting) {
|
|
@@ -906,7 +2309,7 @@ var ManagedDocument = ({
|
|
|
906
2309
|
}, []);
|
|
907
2310
|
return (
|
|
908
2311
|
// Outer layout wrapper (takes up available space, adds padding)
|
|
909
|
-
/* @__PURE__ */
|
|
2312
|
+
/* @__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
2313
|
"h1",
|
|
911
2314
|
{
|
|
912
2315
|
ref: titleRef,
|
|
@@ -914,7 +2317,7 @@ var ManagedDocument = ({
|
|
|
914
2317
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
915
2318
|
},
|
|
916
2319
|
title
|
|
917
|
-
)), sections.map((section, index) => /* @__PURE__ */
|
|
2320
|
+
)), 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
2321
|
"a",
|
|
919
2322
|
{
|
|
920
2323
|
href: `mailto:${contactEmail}`,
|
|
@@ -926,18 +2329,18 @@ var ManagedDocument = ({
|
|
|
926
2329
|
};
|
|
927
2330
|
|
|
928
2331
|
// src/components/ManagedContactBlock.tsx
|
|
929
|
-
var
|
|
930
|
-
var
|
|
2332
|
+
var import_react42 = __toESM(require("react"));
|
|
2333
|
+
var import_react43 = require("@hugeicons/react");
|
|
931
2334
|
var SecureEmail = ({ user, domain, className }) => {
|
|
932
|
-
const [isMounted, setIsMounted] = (0,
|
|
933
|
-
(0,
|
|
2335
|
+
const [isMounted, setIsMounted] = (0, import_react42.useState)(false);
|
|
2336
|
+
(0, import_react42.useEffect)(() => {
|
|
934
2337
|
setIsMounted(true);
|
|
935
2338
|
}, []);
|
|
936
2339
|
if (!isMounted) {
|
|
937
|
-
return /* @__PURE__ */
|
|
2340
|
+
return /* @__PURE__ */ import_react42.default.createElement("span", { className, style: { opacity: 0 } }, "Loading");
|
|
938
2341
|
}
|
|
939
2342
|
const email = `${user}@${domain}`;
|
|
940
|
-
return /* @__PURE__ */
|
|
2343
|
+
return /* @__PURE__ */ import_react42.default.createElement("a", { href: `mailto:${email}`, className }, email);
|
|
941
2344
|
};
|
|
942
2345
|
var ManagedContactBlock = ({
|
|
943
2346
|
tagline,
|
|
@@ -946,7 +2349,7 @@ var ManagedContactBlock = ({
|
|
|
946
2349
|
emails,
|
|
947
2350
|
socials
|
|
948
2351
|
}) => {
|
|
949
|
-
return /* @__PURE__ */
|
|
2352
|
+
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
2353
|
"div",
|
|
951
2354
|
{
|
|
952
2355
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -955,21 +2358,21 @@ var ManagedContactBlock = ({
|
|
|
955
2358
|
backgroundRepeat: "repeat"
|
|
956
2359
|
}
|
|
957
2360
|
}
|
|
958
|
-
), /* @__PURE__ */
|
|
2361
|
+
), /* @__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
2362
|
"a",
|
|
960
2363
|
{
|
|
961
2364
|
href: `tel:${company.phone.replace(/\s+/g, "")}`,
|
|
962
2365
|
className: "transition-colors hover:text-black"
|
|
963
2366
|
},
|
|
964
2367
|
company.phone
|
|
965
|
-
)))), emails && emails.length > 0 && /* @__PURE__ */
|
|
2368
|
+
)))), 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
2369
|
SecureEmail,
|
|
967
2370
|
{
|
|
968
2371
|
user: email.user,
|
|
969
2372
|
domain: email.domain,
|
|
970
2373
|
className: "text-neutral-600 transition-colors hover:text-black"
|
|
971
2374
|
}
|
|
972
|
-
))))), socials && socials.length > 0 && /* @__PURE__ */
|
|
2375
|
+
))))), 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
2376
|
"a",
|
|
974
2377
|
{
|
|
975
2378
|
key: idx,
|
|
@@ -979,27 +2382,27 @@ var ManagedContactBlock = ({
|
|
|
979
2382
|
className: "flex items-center gap-3 transition-colors group text-neutral-600 hover:text-black",
|
|
980
2383
|
"aria-label": social.label
|
|
981
2384
|
},
|
|
982
|
-
/* @__PURE__ */
|
|
983
|
-
/* @__PURE__ */
|
|
2385
|
+
/* @__PURE__ */ import_react42.default.createElement(import_react43.HugeiconsIcon, { icon: social.icon, size: 18 }),
|
|
2386
|
+
/* @__PURE__ */ import_react42.default.createElement("span", { className: "text-[13px]" }, social.label)
|
|
984
2387
|
)))))))));
|
|
985
2388
|
};
|
|
986
2389
|
|
|
987
2390
|
// src/components/ManagedPricingBlock.tsx
|
|
988
|
-
var
|
|
989
|
-
var
|
|
2391
|
+
var import_react44 = __toESM(require("react"));
|
|
2392
|
+
var import_link6 = __toESM(require("next/link"));
|
|
990
2393
|
var import_image4 = __toESM(require("next/image"));
|
|
991
|
-
var CheckIcon = ({ className = "" }) => /* @__PURE__ */
|
|
992
|
-
var CrossIcon = ({ className = "" }) => /* @__PURE__ */
|
|
2394
|
+
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" }));
|
|
2395
|
+
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
2396
|
var ManagedPricingBlock = ({
|
|
994
2397
|
tagline,
|
|
995
2398
|
title,
|
|
996
2399
|
plans = [],
|
|
997
2400
|
tabs
|
|
998
2401
|
}) => {
|
|
999
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
1000
|
-
const [activeTabIndex, setActiveTabIndex] = (0,
|
|
1001
|
-
const titleRef = (0,
|
|
1002
|
-
(0,
|
|
2402
|
+
const [isAnimating, setIsAnimating] = (0, import_react44.useState)(false);
|
|
2403
|
+
const [activeTabIndex, setActiveTabIndex] = (0, import_react44.useState)(0);
|
|
2404
|
+
const titleRef = (0, import_react44.useRef)(null);
|
|
2405
|
+
(0, import_react44.useEffect)(() => {
|
|
1003
2406
|
const observer = new IntersectionObserver(
|
|
1004
2407
|
([entry]) => {
|
|
1005
2408
|
if (entry.isIntersecting) {
|
|
@@ -1019,7 +2422,7 @@ var ManagedPricingBlock = ({
|
|
|
1019
2422
|
}, []);
|
|
1020
2423
|
const hasTabs = tabs && tabs.length > 0;
|
|
1021
2424
|
const currentPlans = hasTabs ? tabs[activeTabIndex].plans : plans;
|
|
1022
|
-
return /* @__PURE__ */
|
|
2425
|
+
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
2426
|
"h1",
|
|
1024
2427
|
{
|
|
1025
2428
|
ref: titleRef,
|
|
@@ -1027,9 +2430,9 @@ var ManagedPricingBlock = ({
|
|
|
1027
2430
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
1028
2431
|
},
|
|
1029
2432
|
title
|
|
1030
|
-
)), hasTabs && /* @__PURE__ */
|
|
2433
|
+
)), 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
2434
|
const isActive = activeTabIndex === idx;
|
|
1032
|
-
return /* @__PURE__ */
|
|
2435
|
+
return /* @__PURE__ */ import_react44.default.createElement(
|
|
1033
2436
|
"button",
|
|
1034
2437
|
{
|
|
1035
2438
|
key: idx,
|
|
@@ -1038,19 +2441,19 @@ var ManagedPricingBlock = ({
|
|
|
1038
2441
|
},
|
|
1039
2442
|
tab.label
|
|
1040
2443
|
);
|
|
1041
|
-
}))), /* @__PURE__ */
|
|
2444
|
+
}))), /* @__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
2445
|
"div",
|
|
1043
2446
|
{
|
|
1044
2447
|
key: `${activeTabIndex}-${planIdx}`,
|
|
1045
2448
|
className: `bg-white rounded-3xl p-6 flex flex-col relative overflow-hidden transition-all duration-300 ${plan.isPremium ? "" : ""}`
|
|
1046
2449
|
},
|
|
1047
|
-
/* @__PURE__ */
|
|
2450
|
+
/* @__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
2451
|
"div",
|
|
1049
2452
|
{
|
|
1050
2453
|
key: logoIdx,
|
|
1051
2454
|
className: "relative w-5 h-5 overflow-hidden flex items-center justify-center shrink-0"
|
|
1052
2455
|
},
|
|
1053
|
-
/* @__PURE__ */
|
|
2456
|
+
/* @__PURE__ */ import_react44.default.createElement(
|
|
1054
2457
|
import_image4.default,
|
|
1055
2458
|
{
|
|
1056
2459
|
src: logo.src,
|
|
@@ -1061,28 +2464,28 @@ var ManagedPricingBlock = ({
|
|
|
1061
2464
|
}
|
|
1062
2465
|
)
|
|
1063
2466
|
)))),
|
|
1064
|
-
plan.isPremium ? /* @__PURE__ */
|
|
1065
|
-
|
|
2467
|
+
plan.isPremium ? /* @__PURE__ */ import_react44.default.createElement(ThreeDButton, { href: plan.ctaHref, className: "mb-6 w-full" }, plan.ctaText) : /* @__PURE__ */ import_react44.default.createElement(
|
|
2468
|
+
import_link6.default,
|
|
1066
2469
|
{
|
|
1067
2470
|
href: plan.ctaHref,
|
|
1068
2471
|
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
2472
|
},
|
|
1070
2473
|
plan.ctaText
|
|
1071
2474
|
),
|
|
1072
|
-
/* @__PURE__ */
|
|
2475
|
+
/* @__PURE__ */ import_react44.default.createElement("div", { className: "flex flex-col gap-3" }, plan.features.map((feature, featureIdx) => {
|
|
1073
2476
|
const isAvailable = feature.value !== false;
|
|
1074
2477
|
const valueText = typeof feature.value === "string" ? feature.value : "";
|
|
1075
|
-
return /* @__PURE__ */
|
|
2478
|
+
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
2479
|
}))
|
|
1077
2480
|
)))));
|
|
1078
2481
|
};
|
|
1079
2482
|
|
|
1080
2483
|
// src/components/ManagedBoardBlock.tsx
|
|
1081
|
-
var
|
|
2484
|
+
var import_react45 = __toESM(require("react"));
|
|
1082
2485
|
var import_image5 = __toESM(require("next/image"));
|
|
1083
|
-
var
|
|
1084
|
-
var
|
|
1085
|
-
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */
|
|
2486
|
+
var import_react46 = require("@hugeicons/react");
|
|
2487
|
+
var import_core_free_icons13 = require("@hugeicons/core-free-icons");
|
|
2488
|
+
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ import_react45.default.createElement(
|
|
1086
2489
|
"a",
|
|
1087
2490
|
{
|
|
1088
2491
|
href,
|
|
@@ -1091,7 +2494,7 @@ var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ import_r
|
|
|
1091
2494
|
className: "text-neutral-400 hover:text-black transition-colors",
|
|
1092
2495
|
"aria-label": `${name} on ${label}`
|
|
1093
2496
|
},
|
|
1094
|
-
/* @__PURE__ */
|
|
2497
|
+
/* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon, size: 16 })
|
|
1095
2498
|
);
|
|
1096
2499
|
var ManagedBoardBlock = ({
|
|
1097
2500
|
tagline,
|
|
@@ -1100,7 +2503,7 @@ var ManagedBoardBlock = ({
|
|
|
1100
2503
|
contactText,
|
|
1101
2504
|
contactEmail
|
|
1102
2505
|
}) => {
|
|
1103
|
-
return /* @__PURE__ */
|
|
2506
|
+
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
2507
|
"div",
|
|
1105
2508
|
{
|
|
1106
2509
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -1109,7 +2512,7 @@ var ManagedBoardBlock = ({
|
|
|
1109
2512
|
backgroundRepeat: "repeat"
|
|
1110
2513
|
}
|
|
1111
2514
|
}
|
|
1112
|
-
), /* @__PURE__ */
|
|
2515
|
+
), /* @__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
2516
|
import_image5.default,
|
|
1114
2517
|
{
|
|
1115
2518
|
src: member.imageSrc,
|
|
@@ -1118,101 +2521,44 @@ var ManagedBoardBlock = ({
|
|
|
1118
2521
|
sizes: "(max-width: 768px) 56px, 64px",
|
|
1119
2522
|
className: "object-cover grayscale opacity-100 transition-opacity"
|
|
1120
2523
|
}
|
|
1121
|
-
)), /* @__PURE__ */
|
|
2524
|
+
)), /* @__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
2525
|
MemberSocialLink,
|
|
1123
2526
|
{
|
|
1124
2527
|
href: `https://x.com/${member.twitterHandle}`,
|
|
1125
|
-
icon:
|
|
2528
|
+
icon: import_core_free_icons13.TwitterIcon,
|
|
1126
2529
|
label: "X",
|
|
1127
2530
|
name: member.name
|
|
1128
2531
|
}
|
|
1129
|
-
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */
|
|
2532
|
+
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */ import_react45.default.createElement(
|
|
1130
2533
|
MemberSocialLink,
|
|
1131
2534
|
{
|
|
1132
2535
|
href: member.linkedinHandle,
|
|
1133
|
-
icon:
|
|
2536
|
+
icon: import_core_free_icons13.LinkedinIcon,
|
|
1134
2537
|
label: "LinkedIn",
|
|
1135
2538
|
name: member.name
|
|
1136
2539
|
}
|
|
1137
|
-
))))))), (contactText || contactEmail) && /* @__PURE__ */
|
|
2540
|
+
))))))), (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
2541
|
};
|
|
1139
2542
|
|
|
1140
2543
|
// src/components/ManagedNotFoundBlock.tsx
|
|
1141
|
-
var
|
|
2544
|
+
var import_react47 = __toESM(require("react"));
|
|
1142
2545
|
var ManagedNotFoundBlock = ({
|
|
1143
2546
|
title = "404 - Page Not Found",
|
|
1144
2547
|
description = "The page you are looking for does not exist or has been moved."
|
|
1145
2548
|
}) => {
|
|
1146
|
-
return /* @__PURE__ */
|
|
2549
|
+
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
2550
|
"svg",
|
|
1148
2551
|
{
|
|
1149
2552
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1150
2553
|
viewBox: "0 0 24 24",
|
|
1151
2554
|
className: "w-12 h-12 fill-neutral-100"
|
|
1152
2555
|
},
|
|
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
|
-
);
|
|
2556
|
+
/* @__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" })
|
|
2557
|
+
)), /* @__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
2558
|
};
|
|
1213
2559
|
|
|
1214
2560
|
// src/components/ManagedNewsletterSplitBlock.tsx
|
|
1215
|
-
var
|
|
2561
|
+
var import_react48 = __toESM(require("react"));
|
|
1216
2562
|
var import_image6 = __toESM(require("next/image"));
|
|
1217
2563
|
var ManagedNewsletterSplitBlock = ({
|
|
1218
2564
|
tagline,
|
|
@@ -1226,7 +2572,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
1226
2572
|
ctaHref = "/contact",
|
|
1227
2573
|
children
|
|
1228
2574
|
}) => {
|
|
1229
|
-
return /* @__PURE__ */
|
|
2575
|
+
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
2576
|
import_image6.default,
|
|
1231
2577
|
{
|
|
1232
2578
|
src: imageSrc,
|
|
@@ -1236,7 +2582,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
1236
2582
|
className: "object-cover object-top grayscale opacity-60",
|
|
1237
2583
|
quality: 100
|
|
1238
2584
|
}
|
|
1239
|
-
), /* @__PURE__ */
|
|
2585
|
+
), /* @__PURE__ */ import_react48.default.createElement(
|
|
1240
2586
|
"div",
|
|
1241
2587
|
{
|
|
1242
2588
|
className: "absolute inset-0 z-10 pointer-events-none",
|
|
@@ -1244,7 +2590,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
1244
2590
|
background: "linear-gradient(to right, rgba(255,255,255,0) 30%, #ffffff 100%)"
|
|
1245
2591
|
}
|
|
1246
2592
|
}
|
|
1247
|
-
), /* @__PURE__ */
|
|
2593
|
+
), /* @__PURE__ */ import_react48.default.createElement(
|
|
1248
2594
|
"div",
|
|
1249
2595
|
{
|
|
1250
2596
|
className: "absolute inset-x-0 bottom-0 h-40 z-10 pointer-events-none",
|
|
@@ -1252,7 +2598,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
1252
2598
|
background: "linear-gradient(to bottom, rgba(255,255,255,0) 0%, #ffffff 100%)"
|
|
1253
2599
|
}
|
|
1254
2600
|
}
|
|
1255
|
-
)), /* @__PURE__ */
|
|
2601
|
+
)), /* @__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
2602
|
"div",
|
|
1257
2603
|
{
|
|
1258
2604
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -1261,7 +2607,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
1261
2607
|
backgroundRepeat: "repeat"
|
|
1262
2608
|
}
|
|
1263
2609
|
}
|
|
1264
|
-
), /* @__PURE__ */
|
|
2610
|
+
), /* @__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
2611
|
ThreeDButton,
|
|
1266
2612
|
{
|
|
1267
2613
|
href: ctaHref,
|
|
@@ -1272,14 +2618,14 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
1272
2618
|
};
|
|
1273
2619
|
|
|
1274
2620
|
// src/components/PortfolioHero.tsx
|
|
1275
|
-
var
|
|
1276
|
-
var
|
|
2621
|
+
var import_react49 = __toESM(require("react"));
|
|
2622
|
+
var import_link7 = __toESM(require("next/link"));
|
|
1277
2623
|
var import_image7 = __toESM(require("next/image"));
|
|
1278
|
-
var
|
|
1279
|
-
var
|
|
2624
|
+
var import_react50 = require("@hugeicons/react");
|
|
2625
|
+
var import_core_free_icons14 = require("@hugeicons/core-free-icons");
|
|
1280
2626
|
var useScrollAnimation = () => {
|
|
1281
|
-
const elementRef = (0,
|
|
1282
|
-
(0,
|
|
2627
|
+
const elementRef = (0, import_react49.useRef)(null);
|
|
2628
|
+
(0, import_react49.useEffect)(() => {
|
|
1283
2629
|
const el = elementRef.current;
|
|
1284
2630
|
if (!el) return;
|
|
1285
2631
|
const observer = new IntersectionObserver(
|
|
@@ -1315,13 +2661,13 @@ var PortfolioHero = ({
|
|
|
1315
2661
|
secondaryCtaHref
|
|
1316
2662
|
}) => {
|
|
1317
2663
|
const heroContentRef = useScrollAnimation();
|
|
1318
|
-
return /* @__PURE__ */
|
|
2664
|
+
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
2665
|
"div",
|
|
1320
2666
|
{
|
|
1321
2667
|
ref: heroContentRef,
|
|
1322
2668
|
className: "w-full opacity-0 translate-y-5 transition-all duration-1000 ease-out relative z-10"
|
|
1323
2669
|
},
|
|
1324
|
-
/* @__PURE__ */
|
|
2670
|
+
/* @__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
2671
|
import_image7.default,
|
|
1326
2672
|
{
|
|
1327
2673
|
src: imageSrc,
|
|
@@ -1332,7 +2678,7 @@ var PortfolioHero = ({
|
|
|
1332
2678
|
sizes: "(max-width: 640px) 80px, 128px",
|
|
1333
2679
|
quality: 100
|
|
1334
2680
|
}
|
|
1335
|
-
)), /* @__PURE__ */
|
|
2681
|
+
)), /* @__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
2682
|
"a",
|
|
1337
2683
|
{
|
|
1338
2684
|
href: socialLinkHref,
|
|
@@ -1342,31 +2688,31 @@ var PortfolioHero = ({
|
|
|
1342
2688
|
},
|
|
1343
2689
|
socialLinkText
|
|
1344
2690
|
))),
|
|
1345
|
-
/* @__PURE__ */
|
|
1346
|
-
/* @__PURE__ */
|
|
2691
|
+
/* @__PURE__ */ import_react49.default.createElement("p", { className: "text-[13px] leading-[1.8] max-w-4xl mb-12 text-neutral-600" }, bio),
|
|
2692
|
+
/* @__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
2693
|
ThreeDButton,
|
|
1348
2694
|
{
|
|
1349
2695
|
href: primaryCtaHref,
|
|
1350
2696
|
className: "py-3 tracking-widest text-[11px]"
|
|
1351
2697
|
},
|
|
1352
2698
|
primaryCtaText
|
|
1353
|
-
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */
|
|
1354
|
-
|
|
2699
|
+
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react49.default.createElement(
|
|
2700
|
+
import_link7.default,
|
|
1355
2701
|
{
|
|
1356
2702
|
href: secondaryCtaHref,
|
|
1357
2703
|
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
2704
|
},
|
|
1359
2705
|
secondaryCtaText,
|
|
1360
|
-
/* @__PURE__ */
|
|
2706
|
+
/* @__PURE__ */ import_react49.default.createElement(import_react50.HugeiconsIcon, { icon: import_core_free_icons14.ArrowRight01Icon, size: 16 })
|
|
1361
2707
|
))
|
|
1362
2708
|
));
|
|
1363
2709
|
};
|
|
1364
2710
|
|
|
1365
2711
|
// src/components/GifFeatureCard.tsx
|
|
1366
|
-
var
|
|
2712
|
+
var import_react51 = __toESM(require("react"));
|
|
1367
2713
|
var import_image8 = __toESM(require("next/image"));
|
|
1368
|
-
var
|
|
1369
|
-
var
|
|
2714
|
+
var import_react52 = require("@hugeicons/react");
|
|
2715
|
+
var import_core_free_icons15 = require("@hugeicons/core-free-icons");
|
|
1370
2716
|
var GifFeatureCard = ({
|
|
1371
2717
|
gifSrc,
|
|
1372
2718
|
title,
|
|
@@ -1374,20 +2720,20 @@ var GifFeatureCard = ({
|
|
|
1374
2720
|
alt = "Feature animation",
|
|
1375
2721
|
className = "aspect-video"
|
|
1376
2722
|
}) => {
|
|
1377
|
-
const [isLoading, setIsLoading] = (0,
|
|
1378
|
-
return /* @__PURE__ */
|
|
1379
|
-
|
|
2723
|
+
const [isLoading, setIsLoading] = (0, import_react51.useState)(true);
|
|
2724
|
+
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(
|
|
2725
|
+
import_react52.HugeiconsIcon,
|
|
1380
2726
|
{
|
|
1381
|
-
icon:
|
|
2727
|
+
icon: import_core_free_icons15.Loading03Icon,
|
|
1382
2728
|
size: 32,
|
|
1383
2729
|
className: "animate-spin text-white"
|
|
1384
2730
|
}
|
|
1385
|
-
)), /* @__PURE__ */
|
|
2731
|
+
)), /* @__PURE__ */ import_react51.default.createElement(
|
|
1386
2732
|
"div",
|
|
1387
2733
|
{
|
|
1388
2734
|
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
2735
|
},
|
|
1390
|
-
/* @__PURE__ */
|
|
2736
|
+
/* @__PURE__ */ import_react51.default.createElement(
|
|
1391
2737
|
import_image8.default,
|
|
1392
2738
|
{
|
|
1393
2739
|
src: gifSrc,
|
|
@@ -1398,16 +2744,16 @@ var GifFeatureCard = ({
|
|
|
1398
2744
|
className: "object-cover object-center pointer-events-none"
|
|
1399
2745
|
}
|
|
1400
2746
|
)
|
|
1401
|
-
), /* @__PURE__ */
|
|
2747
|
+
), /* @__PURE__ */ import_react51.default.createElement(
|
|
1402
2748
|
"div",
|
|
1403
2749
|
{
|
|
1404
2750
|
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
2751
|
}
|
|
1406
|
-
), /* @__PURE__ */
|
|
2752
|
+
), /* @__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
2753
|
};
|
|
1408
2754
|
|
|
1409
2755
|
// src/components/MedicalFeatureStatsBlock.tsx
|
|
1410
|
-
var
|
|
2756
|
+
var import_react53 = __toESM(require("react"));
|
|
1411
2757
|
var import_image9 = __toESM(require("next/image"));
|
|
1412
2758
|
var MedicalFeatureStatsBlock = ({
|
|
1413
2759
|
bottomHeadline,
|
|
@@ -1416,9 +2762,9 @@ var MedicalFeatureStatsBlock = ({
|
|
|
1416
2762
|
trustText,
|
|
1417
2763
|
stats
|
|
1418
2764
|
}) => {
|
|
1419
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
1420
|
-
const titleRef = (0,
|
|
1421
|
-
(0,
|
|
2765
|
+
const [isAnimating, setIsAnimating] = (0, import_react53.useState)(false);
|
|
2766
|
+
const titleRef = (0, import_react53.useRef)(null);
|
|
2767
|
+
(0, import_react53.useEffect)(() => {
|
|
1422
2768
|
const observer = new IntersectionObserver(
|
|
1423
2769
|
([entry]) => {
|
|
1424
2770
|
if (entry.isIntersecting) {
|
|
@@ -1436,7 +2782,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
1436
2782
|
}
|
|
1437
2783
|
return () => observer.disconnect();
|
|
1438
2784
|
}, []);
|
|
1439
|
-
return /* @__PURE__ */
|
|
2785
|
+
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
2786
|
"h2",
|
|
1441
2787
|
{
|
|
1442
2788
|
ref: titleRef,
|
|
@@ -1444,7 +2790,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
1444
2790
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
1445
2791
|
},
|
|
1446
2792
|
bottomHeadline
|
|
1447
|
-
), /* @__PURE__ */
|
|
2793
|
+
), /* @__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
2794
|
import_image9.default,
|
|
1449
2795
|
{
|
|
1450
2796
|
src,
|
|
@@ -1453,17 +2799,17 @@ var MedicalFeatureStatsBlock = ({
|
|
|
1453
2799
|
sizes: "48px",
|
|
1454
2800
|
className: "object-cover"
|
|
1455
2801
|
}
|
|
1456
|
-
)))), /* @__PURE__ */
|
|
2802
|
+
)))), /* @__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
2803
|
};
|
|
1458
2804
|
|
|
1459
2805
|
// src/components/ConsultantShowcase.tsx
|
|
1460
|
-
var
|
|
2806
|
+
var import_react54 = __toESM(require("react"));
|
|
1461
2807
|
var import_image10 = __toESM(require("next/image"));
|
|
1462
|
-
var
|
|
1463
|
-
var
|
|
2808
|
+
var import_react55 = require("@hugeicons/react");
|
|
2809
|
+
var import_core_free_icons16 = require("@hugeicons/core-free-icons");
|
|
1464
2810
|
var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
1465
|
-
const [isLoading, setIsLoading] = (0,
|
|
1466
|
-
return /* @__PURE__ */
|
|
2811
|
+
const [isLoading, setIsLoading] = (0, import_react54.useState)(true);
|
|
2812
|
+
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
2813
|
import_image10.default,
|
|
1468
2814
|
{
|
|
1469
2815
|
src,
|
|
@@ -1482,9 +2828,9 @@ var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
|
1482
2828
|
var ConsultantShowcase = ({
|
|
1483
2829
|
profiles
|
|
1484
2830
|
}) => {
|
|
1485
|
-
const [currentIndex, setCurrentIndex] = (0,
|
|
1486
|
-
const [touchStart, setTouchStart] = (0,
|
|
1487
|
-
const [touchEnd, setTouchEnd] = (0,
|
|
2831
|
+
const [currentIndex, setCurrentIndex] = (0, import_react54.useState)(0);
|
|
2832
|
+
const [touchStart, setTouchStart] = (0, import_react54.useState)(null);
|
|
2833
|
+
const [touchEnd, setTouchEnd] = (0, import_react54.useState)(null);
|
|
1488
2834
|
const nextSlide = () => {
|
|
1489
2835
|
setCurrentIndex((prev) => prev === profiles.length - 1 ? 0 : prev + 1);
|
|
1490
2836
|
};
|
|
@@ -1509,7 +2855,7 @@ var ConsultantShowcase = ({
|
|
|
1509
2855
|
}
|
|
1510
2856
|
};
|
|
1511
2857
|
if (!profiles || profiles.length === 0) return null;
|
|
1512
|
-
return /* @__PURE__ */
|
|
2858
|
+
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
2859
|
"div",
|
|
1514
2860
|
{
|
|
1515
2861
|
className: "relative w-full h-100 md:h-112.5 rounded-4xl overflow-hidden bg-neutral-900 group select-none",
|
|
@@ -1519,13 +2865,13 @@ var ConsultantShowcase = ({
|
|
|
1519
2865
|
},
|
|
1520
2866
|
profiles.map((profile, idx) => {
|
|
1521
2867
|
const isActive = idx === currentIndex;
|
|
1522
|
-
return /* @__PURE__ */
|
|
2868
|
+
return /* @__PURE__ */ import_react54.default.createElement(
|
|
1523
2869
|
"div",
|
|
1524
2870
|
{
|
|
1525
2871
|
key: profile.id,
|
|
1526
2872
|
className: `absolute inset-0 transition-opacity duration-700 ease-in-out ${isActive ? "opacity-100 z-10" : "opacity-0 z-0 pointer-events-none"}`
|
|
1527
2873
|
},
|
|
1528
|
-
/* @__PURE__ */
|
|
2874
|
+
/* @__PURE__ */ import_react54.default.createElement(
|
|
1529
2875
|
ImageWithLoader,
|
|
1530
2876
|
{
|
|
1531
2877
|
src: profile.imageSrc,
|
|
@@ -1533,14 +2879,14 @@ var ConsultantShowcase = ({
|
|
|
1533
2879
|
priority: idx === 0
|
|
1534
2880
|
}
|
|
1535
2881
|
),
|
|
1536
|
-
/* @__PURE__ */
|
|
1537
|
-
/* @__PURE__ */
|
|
1538
|
-
/* @__PURE__ */
|
|
2882
|
+
/* @__PURE__ */ import_react54.default.createElement("div", { className: "absolute inset-0 bg-black/20 z-10 pointer-events-none" }),
|
|
2883
|
+
/* @__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" }),
|
|
2884
|
+
/* @__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
2885
|
);
|
|
1540
2886
|
}),
|
|
1541
|
-
/* @__PURE__ */
|
|
1542
|
-
/* @__PURE__ */
|
|
1543
|
-
/* @__PURE__ */
|
|
2887
|
+
/* @__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" }),
|
|
2888
|
+
/* @__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" }),
|
|
2889
|
+
/* @__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
2890
|
"button",
|
|
1545
2891
|
{
|
|
1546
2892
|
key: idx,
|
|
@@ -1553,13 +2899,13 @@ var ConsultantShowcase = ({
|
|
|
1553
2899
|
};
|
|
1554
2900
|
|
|
1555
2901
|
// src/components/ContentGridBlock.tsx
|
|
1556
|
-
var
|
|
2902
|
+
var import_react56 = __toESM(require("react"));
|
|
1557
2903
|
var import_image11 = __toESM(require("next/image"));
|
|
1558
|
-
var
|
|
1559
|
-
var
|
|
2904
|
+
var import_react57 = require("@hugeicons/react");
|
|
2905
|
+
var import_core_free_icons17 = require("@hugeicons/core-free-icons");
|
|
1560
2906
|
var ImageWithLoader2 = ({ src, alt, className, sizes }) => {
|
|
1561
|
-
const [isLoading, setIsLoading] = (0,
|
|
1562
|
-
return /* @__PURE__ */
|
|
2907
|
+
const [isLoading, setIsLoading] = (0, import_react56.useState)(true);
|
|
2908
|
+
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
2909
|
import_image11.default,
|
|
1564
2910
|
{
|
|
1565
2911
|
src,
|
|
@@ -1581,30 +2927,30 @@ var ContentGridBlock = ({
|
|
|
1581
2927
|
middleBottomCard,
|
|
1582
2928
|
rightCards
|
|
1583
2929
|
}) => {
|
|
1584
|
-
return /* @__PURE__ */
|
|
2930
|
+
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
2931
|
ImageWithLoader2,
|
|
1586
2932
|
{
|
|
1587
2933
|
src: card.bgImageSrc,
|
|
1588
2934
|
alt: card.title,
|
|
1589
2935
|
className: "absolute inset-0 w-full h-full"
|
|
1590
2936
|
}
|
|
1591
|
-
), /* @__PURE__ */
|
|
2937
|
+
), /* @__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
2938
|
};
|
|
1593
2939
|
|
|
1594
2940
|
// src/components/ManagedProjectsBlock.tsx
|
|
1595
|
-
var
|
|
1596
|
-
var
|
|
2941
|
+
var import_react58 = __toESM(require("react"));
|
|
2942
|
+
var import_link8 = __toESM(require("next/link"));
|
|
1597
2943
|
var GridSection = ({
|
|
1598
2944
|
children,
|
|
1599
2945
|
isLast = false,
|
|
1600
2946
|
className = "py-8 md:py-10"
|
|
1601
|
-
}) => /* @__PURE__ */
|
|
2947
|
+
}) => /* @__PURE__ */ import_react58.default.createElement("div", { className: `relative px-5 md:px-12 ${className} ${!isLast ? "" : ""}` }, children);
|
|
1602
2948
|
var ManagedProjectsBlock = ({
|
|
1603
2949
|
tagline,
|
|
1604
2950
|
title,
|
|
1605
2951
|
projects
|
|
1606
2952
|
}) => {
|
|
1607
|
-
return /* @__PURE__ */
|
|
2953
|
+
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
2954
|
"div",
|
|
1609
2955
|
{
|
|
1610
2956
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -1613,10 +2959,10 @@ var ManagedProjectsBlock = ({
|
|
|
1613
2959
|
backgroundRepeat: "repeat"
|
|
1614
2960
|
}
|
|
1615
2961
|
}
|
|
1616
|
-
), /* @__PURE__ */
|
|
2962
|
+
), /* @__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
2963
|
const isLast = index === projects.length - 1;
|
|
1618
|
-
const projectContent = /* @__PURE__ */
|
|
1619
|
-
return /* @__PURE__ */
|
|
2964
|
+
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));
|
|
2965
|
+
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
2966
|
}))));
|
|
1621
2967
|
};
|
|
1622
2968
|
// Annotate the CommonJS export names for ESM import in node:
|
|
@@ -1639,12 +2985,22 @@ var ManagedProjectsBlock = ({
|
|
|
1639
2985
|
ManagedProjectsBlock,
|
|
1640
2986
|
ManagedToaster,
|
|
1641
2987
|
MedicalFeatureStatsBlock,
|
|
2988
|
+
MobileNav,
|
|
1642
2989
|
NumberInput,
|
|
1643
2990
|
PageSpinner,
|
|
2991
|
+
PipleAuth,
|
|
1644
2992
|
PlatformFeatures,
|
|
1645
2993
|
PortfolioHero,
|
|
1646
2994
|
TextInput,
|
|
1647
2995
|
ThreeDActionButton,
|
|
1648
2996
|
ThreeDButton,
|
|
2997
|
+
UniversalCardPage,
|
|
2998
|
+
UniversalErrorView,
|
|
2999
|
+
UniversalHomeView,
|
|
3000
|
+
UniversalOrganizationPage,
|
|
3001
|
+
UniversalProfilePage,
|
|
3002
|
+
UniversalProfileSettings,
|
|
3003
|
+
UniversalTransactionPage,
|
|
3004
|
+
UniversalWalletPage,
|
|
1649
3005
|
WaitlistDialog
|
|
1650
3006
|
});
|