@retinalabsllc/zairusjs 13.0.30 → 13.0.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +32 -15
- package/dist/index.mjs +33 -17
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -390,13 +390,12 @@ function AuthFormInner({
|
|
|
390
390
|
const [mode, setMode] = (0, import_react6.useState)("LOGIN");
|
|
391
391
|
const [step, setStep] = (0, import_react6.useState)("INPUT");
|
|
392
392
|
const getInitialSignupStep = () => {
|
|
393
|
-
|
|
394
|
-
if (requireOrganization) return "ORGANIZATION";
|
|
395
|
-
return "EMAIL_ID";
|
|
393
|
+
return "INVITATION";
|
|
396
394
|
};
|
|
397
395
|
const [signupStep, setSignupStep] = (0, import_react6.useState)(getInitialSignupStep());
|
|
398
396
|
const [isSubmitting, setIsSubmitting] = (0, import_react6.useState)(false);
|
|
399
397
|
const [countdown, setCountdown] = (0, import_react6.useState)(0);
|
|
398
|
+
const [invitationCode, setInvitationCode] = (0, import_react6.useState)("");
|
|
400
399
|
const [emailId, setEmailId] = (0, import_react6.useState)("");
|
|
401
400
|
const [firstName, setFirstName] = (0, import_react6.useState)("");
|
|
402
401
|
const [lastName, setLastName] = (0, import_react6.useState)("");
|
|
@@ -457,6 +456,7 @@ function AuthFormInner({
|
|
|
457
456
|
firstName: mode === "SIGNUP" && requireNames ? firstName : void 0,
|
|
458
457
|
lastName: mode === "SIGNUP" && requireNames ? lastName : void 0,
|
|
459
458
|
organizationName: mode === "SIGNUP" && requireOrganization ? orgName : void 0,
|
|
459
|
+
r_c: mode === "SIGNUP" ? invitationCode.trim().toUpperCase() : void 0,
|
|
460
460
|
mode,
|
|
461
461
|
recaptchaToken
|
|
462
462
|
});
|
|
@@ -512,7 +512,11 @@ function AuthFormInner({
|
|
|
512
512
|
}
|
|
513
513
|
};
|
|
514
514
|
const handleNextSignupStep = () => {
|
|
515
|
-
if (signupStep === "
|
|
515
|
+
if (signupStep === "INVITATION") {
|
|
516
|
+
if (requireNames) setSignupStep("NAME");
|
|
517
|
+
else if (requireOrganization) setSignupStep("ORGANIZATION");
|
|
518
|
+
else setSignupStep("EMAIL_ID");
|
|
519
|
+
} else if (signupStep === "NAME") {
|
|
516
520
|
if (requireOrganization) setSignupStep("ORGANIZATION");
|
|
517
521
|
else setSignupStep("EMAIL_ID");
|
|
518
522
|
} else if (signupStep === "ORGANIZATION") {
|
|
@@ -523,6 +527,7 @@ function AuthFormInner({
|
|
|
523
527
|
if (isSubmitting) return true;
|
|
524
528
|
if (mode === "LOGIN") return emailId.length < 3;
|
|
525
529
|
if (mode === "SIGNUP") {
|
|
530
|
+
if (signupStep === "INVITATION") return invitationCode.trim().length < 3;
|
|
526
531
|
if (signupStep === "NAME") return firstName.trim() === "" || lastName.trim() === "";
|
|
527
532
|
if (signupStep === "ORGANIZATION") return orgName.trim().length < 3;
|
|
528
533
|
if (signupStep === "EMAIL_ID") return emailId.length < 3 || !agreedToTerms;
|
|
@@ -534,10 +539,22 @@ function AuthFormInner({
|
|
|
534
539
|
setSignupStep(getInitialSignupStep());
|
|
535
540
|
}, 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) => {
|
|
536
541
|
e.preventDefault();
|
|
537
|
-
if (mode === "SIGNUP" && signupStep === "
|
|
542
|
+
if (mode === "SIGNUP" && signupStep === "INVITATION") handleNextSignupStep();
|
|
543
|
+
else if (mode === "SIGNUP" && signupStep === "NAME") handleNextSignupStep();
|
|
538
544
|
else if (mode === "SIGNUP" && signupStep === "ORGANIZATION") handleNextSignupStep();
|
|
539
545
|
else handleAuthRequestSubmit();
|
|
540
|
-
} }, mode === "SIGNUP" && signupStep === "
|
|
546
|
+
} }, mode === "SIGNUP" && signupStep === "INVITATION" && /* @__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 " }, "Invitation Code"), /* @__PURE__ */ import_react6.default.createElement(
|
|
547
|
+
"input",
|
|
548
|
+
{
|
|
549
|
+
type: "text",
|
|
550
|
+
value: invitationCode,
|
|
551
|
+
onChange: (e) => setInvitationCode(e.target.value.toUpperCase().replace(/[^A-Z0-9]/g, "")),
|
|
552
|
+
required: true,
|
|
553
|
+
autoFocus: true,
|
|
554
|
+
className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300 tracking-widest",
|
|
555
|
+
placeholder: "Invitation Code"
|
|
556
|
+
}
|
|
557
|
+
))), 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("input", { type: "text", value: firstName, onChange: (e) => setFirstName(cleanAlpha(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "First name" })), /* @__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("input", { type: "text", value: lastName, onChange: (e) => setLastName(cleanAlpha(e.target.value)), required: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Last name" }))), 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("input", { type: "text", value: orgName, onChange: (e) => setOrgName(cleanOrgName(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Acme Corporation" }))), (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("input", { type: "email", value: emailId, onChange: (e) => setEmailId(cleanEmailId(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "name@company.com" })), mode === "SIGNUP" && /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex items-start gap-3 mt-4" }, /* @__PURE__ */ import_react6.default.createElement("input", { type: "checkbox", id: "zairus-terms", checked: agreedToTerms, onChange: (e) => setAgreedToTerms(e.target.checked), className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer", required: true }), /* @__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(ThreeDActionButton, { type: "submit", disabled: isContinueDisabled(), isLoading: isSubmitting, className: "w-full mt-10" }, "Continue"))), 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" }, userHas2FA ? "Enter the code from your authenticator app." : `Enter the code sent to ${emailId}`)), /* @__PURE__ */ import_react6.default.createElement("form", { className: "space-y-8", autoComplete: "off", onSubmit: (e) => {
|
|
541
558
|
e.preventDefault();
|
|
542
559
|
verifyOtpCode(otp.join(""));
|
|
543
560
|
} }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex justify-between gap-2", onPaste: handlePaste }, otp.map((digit, index) => /* @__PURE__ */ import_react6.default.createElement(
|
|
@@ -562,7 +579,7 @@ function AuthFormInner({
|
|
|
562
579
|
{
|
|
563
580
|
onClick: triggerPasskeyLogin,
|
|
564
581
|
disabled: isSubmitting,
|
|
565
|
-
className: "w-full py-2.5 rounded-full text-black border border-neutral-200 hover:bg-neutral-50 text-xs
|
|
582
|
+
className: "w-full py-2.5 rounded-full text-black border border-neutral-200 hover:bg-neutral-50 text-xs tracking-wide transition-colors outline-none disabled:opacity-50"
|
|
566
583
|
},
|
|
567
584
|
"Use Passkey / Biometrics"
|
|
568
585
|
))))));
|
|
@@ -3958,22 +3975,22 @@ var VerificationRow = ({
|
|
|
3958
3975
|
switch (status) {
|
|
3959
3976
|
case "APPROVED":
|
|
3960
3977
|
statusText = "Completed";
|
|
3961
|
-
statusColor = "text-
|
|
3962
|
-
StatusIcon = import_core_free_icons23.
|
|
3963
|
-
bg = "bg-
|
|
3978
|
+
statusColor = "text-neutral-600";
|
|
3979
|
+
StatusIcon = import_core_free_icons23.CheckmarkCircle01Icon;
|
|
3980
|
+
bg = "bg-neutral-50";
|
|
3964
3981
|
iconColor = "text-green-500";
|
|
3965
3982
|
break;
|
|
3966
3983
|
case "PENDING":
|
|
3967
3984
|
statusText = "Awaiting Approval";
|
|
3968
|
-
statusColor = "text-
|
|
3985
|
+
statusColor = "text-neutral-500";
|
|
3969
3986
|
StatusIcon = import_core_free_icons23.Time02Icon;
|
|
3970
|
-
bg = "bg-
|
|
3987
|
+
bg = "bg-neutral-50";
|
|
3971
3988
|
iconColor = "text-orange-500";
|
|
3972
3989
|
break;
|
|
3973
3990
|
case "REJECTED":
|
|
3974
3991
|
statusText = "Action required to fix issue";
|
|
3975
|
-
statusColor = "text-
|
|
3976
|
-
bg = "bg-
|
|
3992
|
+
statusColor = "text-neutral-500";
|
|
3993
|
+
bg = "bg-neutral-50";
|
|
3977
3994
|
StatusIcon = import_core_free_icons23.InformationCircleIcon;
|
|
3978
3995
|
iconColor = "text-red-500";
|
|
3979
3996
|
break;
|
|
@@ -3994,7 +4011,7 @@ var VerificationRow = ({
|
|
|
3994
4011
|
className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${isDisabled ? "opacity-70 cursor-default" : "cursor-pointer hover:bg-neutral-50"}`
|
|
3995
4012
|
},
|
|
3996
4013
|
/* @__PURE__ */ import_react69.default.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 bg-white flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon, size: 16, className: "text-black" })),
|
|
3997
|
-
/* @__PURE__ */ import_react69.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-[14px] truncate text-black" }, title), /* @__PURE__ */ import_react69.default.createElement("p", { className: `text-[
|
|
4014
|
+
/* @__PURE__ */ import_react69.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-[14px] truncate text-black" }, title), /* @__PURE__ */ import_react69.default.createElement("p", { className: `text-[10px] inline-flex items-center ${bg} rounded-full px-2 py-1 ${statusColor} mt-0.5` }, statusText)),
|
|
3998
4015
|
/* @__PURE__ */ import_react69.default.createElement("div", { className: "shrink-0 ml-2" }, isLoading ? /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: import_core_free_icons23.Loading03Icon, size: 20, className: "animate-spin text-black" }) : /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: StatusIcon, size: 20, className: iconColor }))
|
|
3999
4016
|
);
|
|
4000
4017
|
};
|
package/dist/index.mjs
CHANGED
|
@@ -317,13 +317,12 @@ function AuthFormInner({
|
|
|
317
317
|
const [mode, setMode] = useState3("LOGIN");
|
|
318
318
|
const [step, setStep] = useState3("INPUT");
|
|
319
319
|
const getInitialSignupStep = () => {
|
|
320
|
-
|
|
321
|
-
if (requireOrganization) return "ORGANIZATION";
|
|
322
|
-
return "EMAIL_ID";
|
|
320
|
+
return "INVITATION";
|
|
323
321
|
};
|
|
324
322
|
const [signupStep, setSignupStep] = useState3(getInitialSignupStep());
|
|
325
323
|
const [isSubmitting, setIsSubmitting] = useState3(false);
|
|
326
324
|
const [countdown, setCountdown] = useState3(0);
|
|
325
|
+
const [invitationCode, setInvitationCode] = useState3("");
|
|
327
326
|
const [emailId, setEmailId] = useState3("");
|
|
328
327
|
const [firstName, setFirstName] = useState3("");
|
|
329
328
|
const [lastName, setLastName] = useState3("");
|
|
@@ -384,6 +383,7 @@ function AuthFormInner({
|
|
|
384
383
|
firstName: mode === "SIGNUP" && requireNames ? firstName : void 0,
|
|
385
384
|
lastName: mode === "SIGNUP" && requireNames ? lastName : void 0,
|
|
386
385
|
organizationName: mode === "SIGNUP" && requireOrganization ? orgName : void 0,
|
|
386
|
+
r_c: mode === "SIGNUP" ? invitationCode.trim().toUpperCase() : void 0,
|
|
387
387
|
mode,
|
|
388
388
|
recaptchaToken
|
|
389
389
|
});
|
|
@@ -439,7 +439,11 @@ function AuthFormInner({
|
|
|
439
439
|
}
|
|
440
440
|
};
|
|
441
441
|
const handleNextSignupStep = () => {
|
|
442
|
-
if (signupStep === "
|
|
442
|
+
if (signupStep === "INVITATION") {
|
|
443
|
+
if (requireNames) setSignupStep("NAME");
|
|
444
|
+
else if (requireOrganization) setSignupStep("ORGANIZATION");
|
|
445
|
+
else setSignupStep("EMAIL_ID");
|
|
446
|
+
} else if (signupStep === "NAME") {
|
|
443
447
|
if (requireOrganization) setSignupStep("ORGANIZATION");
|
|
444
448
|
else setSignupStep("EMAIL_ID");
|
|
445
449
|
} else if (signupStep === "ORGANIZATION") {
|
|
@@ -450,6 +454,7 @@ function AuthFormInner({
|
|
|
450
454
|
if (isSubmitting) return true;
|
|
451
455
|
if (mode === "LOGIN") return emailId.length < 3;
|
|
452
456
|
if (mode === "SIGNUP") {
|
|
457
|
+
if (signupStep === "INVITATION") return invitationCode.trim().length < 3;
|
|
453
458
|
if (signupStep === "NAME") return firstName.trim() === "" || lastName.trim() === "";
|
|
454
459
|
if (signupStep === "ORGANIZATION") return orgName.trim().length < 3;
|
|
455
460
|
if (signupStep === "EMAIL_ID") return emailId.length < 3 || !agreedToTerms;
|
|
@@ -461,10 +466,22 @@ function AuthFormInner({
|
|
|
461
466
|
setSignupStep(getInitialSignupStep());
|
|
462
467
|
}, className: "text-black transition-colors ml-1" }, "Sign up")) : /* @__PURE__ */ React5.createElement(React5.Fragment, null, "Already have an account? ", /* @__PURE__ */ React5.createElement("button", { type: "button", onClick: () => setMode("LOGIN"), className: "text-black transition-colors ml-1" }, "Log in")))), /* @__PURE__ */ React5.createElement("form", { className: "space-y-6", autoComplete: "off", onSubmit: (e) => {
|
|
463
468
|
e.preventDefault();
|
|
464
|
-
if (mode === "SIGNUP" && signupStep === "
|
|
469
|
+
if (mode === "SIGNUP" && signupStep === "INVITATION") handleNextSignupStep();
|
|
470
|
+
else if (mode === "SIGNUP" && signupStep === "NAME") handleNextSignupStep();
|
|
465
471
|
else if (mode === "SIGNUP" && signupStep === "ORGANIZATION") handleNextSignupStep();
|
|
466
472
|
else handleAuthRequestSubmit();
|
|
467
|
-
} }, mode === "SIGNUP" && signupStep === "
|
|
473
|
+
} }, mode === "SIGNUP" && signupStep === "INVITATION" && /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Invitation Code"), /* @__PURE__ */ React5.createElement(
|
|
474
|
+
"input",
|
|
475
|
+
{
|
|
476
|
+
type: "text",
|
|
477
|
+
value: invitationCode,
|
|
478
|
+
onChange: (e) => setInvitationCode(e.target.value.toUpperCase().replace(/[^A-Z0-9]/g, "")),
|
|
479
|
+
required: true,
|
|
480
|
+
autoFocus: true,
|
|
481
|
+
className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300 tracking-widest",
|
|
482
|
+
placeholder: "Invitation Code"
|
|
483
|
+
}
|
|
484
|
+
))), mode === "SIGNUP" && signupStep === "NAME" && requireNames && /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "First Name"), /* @__PURE__ */ React5.createElement("input", { type: "text", value: firstName, onChange: (e) => setFirstName(cleanAlpha(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "First name" })), /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Last Name"), /* @__PURE__ */ React5.createElement("input", { type: "text", value: lastName, onChange: (e) => setLastName(cleanAlpha(e.target.value)), required: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Last name" }))), mode === "SIGNUP" && signupStep === "ORGANIZATION" && requireOrganization && /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Organization Name"), /* @__PURE__ */ React5.createElement("input", { type: "text", value: orgName, onChange: (e) => setOrgName(cleanOrgName(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "Acme Corporation" }))), (mode === "LOGIN" || mode === "SIGNUP" && signupStep === "EMAIL_ID") && /* @__PURE__ */ React5.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ React5.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React5.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block " }, "Email ID"), /* @__PURE__ */ React5.createElement("input", { type: "email", value: emailId, onChange: (e) => setEmailId(cleanEmailId(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "name@company.com" })), mode === "SIGNUP" && /* @__PURE__ */ React5.createElement("div", { className: "flex items-start gap-3 mt-4" }, /* @__PURE__ */ React5.createElement("input", { type: "checkbox", id: "zairus-terms", checked: agreedToTerms, onChange: (e) => setAgreedToTerms(e.target.checked), className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer", required: true }), /* @__PURE__ */ React5.createElement("label", { htmlFor: "zairus-terms", className: "text-[11px] text-neutral-500 cursor-pointer leading-snug" }, "I agree to ", companyName, "'s ", /* @__PURE__ */ React5.createElement("a", { href: termsUrl, target: "_blank", rel: "noreferrer", className: "text-black underline " }, "Terms of Service"), " and ", /* @__PURE__ */ React5.createElement("a", { href: privacyUrl, target: "_blank", rel: "noreferrer", className: "text-black underline " }, "Privacy Policy"), "."))), /* @__PURE__ */ React5.createElement(ThreeDActionButton, { type: "submit", disabled: isContinueDisabled(), isLoading: isSubmitting, className: "w-full mt-10" }, "Continue"))), step === "OTP" && /* @__PURE__ */ React5.createElement("div", { className: "animate-in fade-in duration-300" }, /* @__PURE__ */ React5.createElement("div", { className: "text-center mb-10 mt-2" }, /* @__PURE__ */ React5.createElement("h2", { className: "text-xl text-black mb-2 tracking-tight" }, "Security Check"), /* @__PURE__ */ React5.createElement("p", { className: "text-[13px] text-neutral-500" }, userHas2FA ? "Enter the code from your authenticator app." : `Enter the code sent to ${emailId}`)), /* @__PURE__ */ React5.createElement("form", { className: "space-y-8", autoComplete: "off", onSubmit: (e) => {
|
|
468
485
|
e.preventDefault();
|
|
469
486
|
verifyOtpCode(otp.join(""));
|
|
470
487
|
} }, /* @__PURE__ */ React5.createElement("div", { className: "flex justify-between gap-2", onPaste: handlePaste }, otp.map((digit, index) => /* @__PURE__ */ React5.createElement(
|
|
@@ -489,7 +506,7 @@ function AuthFormInner({
|
|
|
489
506
|
{
|
|
490
507
|
onClick: triggerPasskeyLogin,
|
|
491
508
|
disabled: isSubmitting,
|
|
492
|
-
className: "w-full py-2.5 rounded-full text-black border border-neutral-200 hover:bg-neutral-50 text-xs
|
|
509
|
+
className: "w-full py-2.5 rounded-full text-black border border-neutral-200 hover:bg-neutral-50 text-xs tracking-wide transition-colors outline-none disabled:opacity-50"
|
|
493
510
|
},
|
|
494
511
|
"Use Passkey / Biometrics"
|
|
495
512
|
))))));
|
|
@@ -3945,8 +3962,7 @@ import {
|
|
|
3945
3962
|
Mail01Icon,
|
|
3946
3963
|
SmartPhone01Icon,
|
|
3947
3964
|
UserIcon as UserIcon3,
|
|
3948
|
-
|
|
3949
|
-
Cancel01Icon as Cancel01Icon2,
|
|
3965
|
+
CheckmarkCircle01Icon,
|
|
3950
3966
|
Time02Icon,
|
|
3951
3967
|
InformationCircleIcon as InformationCircleIcon2,
|
|
3952
3968
|
Loading03Icon as Loading03Icon16
|
|
@@ -3967,22 +3983,22 @@ var VerificationRow = ({
|
|
|
3967
3983
|
switch (status) {
|
|
3968
3984
|
case "APPROVED":
|
|
3969
3985
|
statusText = "Completed";
|
|
3970
|
-
statusColor = "text-
|
|
3971
|
-
StatusIcon =
|
|
3972
|
-
bg = "bg-
|
|
3986
|
+
statusColor = "text-neutral-600";
|
|
3987
|
+
StatusIcon = CheckmarkCircle01Icon;
|
|
3988
|
+
bg = "bg-neutral-50";
|
|
3973
3989
|
iconColor = "text-green-500";
|
|
3974
3990
|
break;
|
|
3975
3991
|
case "PENDING":
|
|
3976
3992
|
statusText = "Awaiting Approval";
|
|
3977
|
-
statusColor = "text-
|
|
3993
|
+
statusColor = "text-neutral-500";
|
|
3978
3994
|
StatusIcon = Time02Icon;
|
|
3979
|
-
bg = "bg-
|
|
3995
|
+
bg = "bg-neutral-50";
|
|
3980
3996
|
iconColor = "text-orange-500";
|
|
3981
3997
|
break;
|
|
3982
3998
|
case "REJECTED":
|
|
3983
3999
|
statusText = "Action required to fix issue";
|
|
3984
|
-
statusColor = "text-
|
|
3985
|
-
bg = "bg-
|
|
4000
|
+
statusColor = "text-neutral-500";
|
|
4001
|
+
bg = "bg-neutral-50";
|
|
3986
4002
|
StatusIcon = InformationCircleIcon2;
|
|
3987
4003
|
iconColor = "text-red-500";
|
|
3988
4004
|
break;
|
|
@@ -4003,7 +4019,7 @@ var VerificationRow = ({
|
|
|
4003
4019
|
className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${isDisabled ? "opacity-70 cursor-default" : "cursor-pointer hover:bg-neutral-50"}`
|
|
4004
4020
|
},
|
|
4005
4021
|
/* @__PURE__ */ React42.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 bg-white flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React42.createElement(HugeiconsIcon28, { icon, size: 16, className: "text-black" })),
|
|
4006
|
-
/* @__PURE__ */ React42.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React42.createElement("p", { className: "text-[14px] truncate text-black" }, title), /* @__PURE__ */ React42.createElement("p", { className: `text-[
|
|
4022
|
+
/* @__PURE__ */ React42.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React42.createElement("p", { className: "text-[14px] truncate text-black" }, title), /* @__PURE__ */ React42.createElement("p", { className: `text-[10px] inline-flex items-center ${bg} rounded-full px-2 py-1 ${statusColor} mt-0.5` }, statusText)),
|
|
4007
4023
|
/* @__PURE__ */ React42.createElement("div", { className: "shrink-0 ml-2" }, isLoading ? /* @__PURE__ */ React42.createElement(HugeiconsIcon28, { icon: Loading03Icon16, size: 20, className: "animate-spin text-black" }) : /* @__PURE__ */ React42.createElement(HugeiconsIcon28, { icon: StatusIcon, size: 20, className: iconColor }))
|
|
4008
4024
|
);
|
|
4009
4025
|
};
|