@insforge/react 0.4.7 → 0.4.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +55 -95
- package/dist/atoms.cjs +81 -93
- package/dist/atoms.cjs.map +1 -1
- package/dist/atoms.d.cts +4 -4
- package/dist/atoms.d.ts +4 -4
- package/dist/atoms.js +81 -93
- package/dist/atoms.js.map +1 -1
- package/dist/components.cjs +128 -130
- package/dist/components.cjs.map +1 -1
- package/dist/components.js +128 -130
- package/dist/components.js.map +1 -1
- package/dist/forms.cjs +108 -124
- package/dist/forms.cjs.map +1 -1
- package/dist/forms.d.cts +2 -4
- package/dist/forms.d.ts +2 -4
- package/dist/forms.js +108 -124
- package/dist/forms.js.map +1 -1
- package/dist/hooks.cjs.map +1 -1
- package/dist/hooks.js.map +1 -1
- package/dist/index.cjs +148 -155
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -4
- package/dist/index.d.ts +1 -4
- package/dist/index.js +148 -155
- package/dist/index.js.map +1 -1
- package/dist/router.cjs +11 -21
- package/dist/router.cjs.map +1 -1
- package/dist/router.d.cts +5 -4
- package/dist/router.d.ts +5 -4
- package/dist/router.js +11 -21
- package/dist/router.js.map +1 -1
- package/dist/styles.css +43 -71
- package/package.json +1 -1
package/dist/forms.d.cts
CHANGED
|
@@ -12,7 +12,6 @@ interface SignInFormProps {
|
|
|
12
12
|
error?: string;
|
|
13
13
|
loading?: boolean;
|
|
14
14
|
oauthLoading?: OAuthProvidersSchema | null;
|
|
15
|
-
availableProviders?: OAuthProvidersSchema[];
|
|
16
15
|
onOAuthClick?: (provider: OAuthProvidersSchema) => void;
|
|
17
16
|
authConfig: AuthConfig;
|
|
18
17
|
title?: string;
|
|
@@ -35,7 +34,7 @@ interface SignInFormProps {
|
|
|
35
34
|
/**
|
|
36
35
|
* Pre-built sign-in form component (UI only, no business logic).
|
|
37
36
|
*/
|
|
38
|
-
declare function SignInForm({ email, password, onEmailChange, onPasswordChange, onSubmit, error, loading, oauthLoading,
|
|
37
|
+
declare function SignInForm({ email, password, onEmailChange, onPasswordChange, onSubmit, error, loading, oauthLoading, onOAuthClick, authConfig, title, subtitle, emailLabel, emailPlaceholder, passwordLabel, passwordPlaceholder, forgotPasswordText, forgotPasswordUrl, submitButtonText, loadingButtonText, signUpText, signUpLinkText, signUpUrl, dividerText, showVerificationStep, onVerifyCode, }: SignInFormProps): react_jsx_runtime.JSX.Element;
|
|
39
38
|
|
|
40
39
|
interface SignUpFormProps {
|
|
41
40
|
email: string;
|
|
@@ -46,7 +45,6 @@ interface SignUpFormProps {
|
|
|
46
45
|
error?: string;
|
|
47
46
|
loading?: boolean;
|
|
48
47
|
oauthLoading?: OAuthProvidersSchema | null;
|
|
49
|
-
availableProviders?: OAuthProvidersSchema[];
|
|
50
48
|
onOAuthClick?: (provider: OAuthProvidersSchema) => void;
|
|
51
49
|
authConfig: AuthConfig;
|
|
52
50
|
title?: string;
|
|
@@ -67,7 +65,7 @@ interface SignUpFormProps {
|
|
|
67
65
|
/**
|
|
68
66
|
* Pre-built sign-up form component (UI only, no business logic).
|
|
69
67
|
*/
|
|
70
|
-
declare function SignUpForm({ email, password, onEmailChange, onPasswordChange, onSubmit, error, loading, oauthLoading,
|
|
68
|
+
declare function SignUpForm({ email, password, onEmailChange, onPasswordChange, onSubmit, error, loading, oauthLoading, onOAuthClick, authConfig, title, subtitle, emailLabel, emailPlaceholder, passwordLabel, passwordPlaceholder, submitButtonText, loadingButtonText, signInText, signInLinkText, signInUrl, dividerText, showVerificationStep, onVerifyCode, }: SignUpFormProps): react_jsx_runtime.JSX.Element;
|
|
71
69
|
|
|
72
70
|
type ResetPasswordMethod = 'code' | 'link';
|
|
73
71
|
interface ForgotPasswordFormProps {
|
package/dist/forms.d.ts
CHANGED
|
@@ -12,7 +12,6 @@ interface SignInFormProps {
|
|
|
12
12
|
error?: string;
|
|
13
13
|
loading?: boolean;
|
|
14
14
|
oauthLoading?: OAuthProvidersSchema | null;
|
|
15
|
-
availableProviders?: OAuthProvidersSchema[];
|
|
16
15
|
onOAuthClick?: (provider: OAuthProvidersSchema) => void;
|
|
17
16
|
authConfig: AuthConfig;
|
|
18
17
|
title?: string;
|
|
@@ -35,7 +34,7 @@ interface SignInFormProps {
|
|
|
35
34
|
/**
|
|
36
35
|
* Pre-built sign-in form component (UI only, no business logic).
|
|
37
36
|
*/
|
|
38
|
-
declare function SignInForm({ email, password, onEmailChange, onPasswordChange, onSubmit, error, loading, oauthLoading,
|
|
37
|
+
declare function SignInForm({ email, password, onEmailChange, onPasswordChange, onSubmit, error, loading, oauthLoading, onOAuthClick, authConfig, title, subtitle, emailLabel, emailPlaceholder, passwordLabel, passwordPlaceholder, forgotPasswordText, forgotPasswordUrl, submitButtonText, loadingButtonText, signUpText, signUpLinkText, signUpUrl, dividerText, showVerificationStep, onVerifyCode, }: SignInFormProps): react_jsx_runtime.JSX.Element;
|
|
39
38
|
|
|
40
39
|
interface SignUpFormProps {
|
|
41
40
|
email: string;
|
|
@@ -46,7 +45,6 @@ interface SignUpFormProps {
|
|
|
46
45
|
error?: string;
|
|
47
46
|
loading?: boolean;
|
|
48
47
|
oauthLoading?: OAuthProvidersSchema | null;
|
|
49
|
-
availableProviders?: OAuthProvidersSchema[];
|
|
50
48
|
onOAuthClick?: (provider: OAuthProvidersSchema) => void;
|
|
51
49
|
authConfig: AuthConfig;
|
|
52
50
|
title?: string;
|
|
@@ -67,7 +65,7 @@ interface SignUpFormProps {
|
|
|
67
65
|
/**
|
|
68
66
|
* Pre-built sign-up form component (UI only, no business logic).
|
|
69
67
|
*/
|
|
70
|
-
declare function SignUpForm({ email, password, onEmailChange, onPasswordChange, onSubmit, error, loading, oauthLoading,
|
|
68
|
+
declare function SignUpForm({ email, password, onEmailChange, onPasswordChange, onSubmit, error, loading, oauthLoading, onOAuthClick, authConfig, title, subtitle, emailLabel, emailPlaceholder, passwordLabel, passwordPlaceholder, submitButtonText, loadingButtonText, signInText, signInLinkText, signInUrl, dividerText, showVerificationStep, onVerifyCode, }: SignUpFormProps): react_jsx_runtime.JSX.Element;
|
|
71
69
|
|
|
72
70
|
type ResetPasswordMethod = 'code' | 'link';
|
|
73
71
|
interface ForgotPasswordFormProps {
|
package/dist/forms.js
CHANGED
|
@@ -106,34 +106,27 @@ function AuthPasswordStrengthIndicator({
|
|
|
106
106
|
config
|
|
107
107
|
}) {
|
|
108
108
|
const requirements = createRequirements(config);
|
|
109
|
-
return /* @__PURE__ */ jsx("div", { className: "if-passwordStrength if-internal-ps6w3k", children: /* @__PURE__ */ jsx("div", { className: "if-passwordStrength-requirements", children: requirements.map((req) => /* @__PURE__ */ jsxs(
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
"
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
}
|
|
131
|
-
),
|
|
132
|
-
/* @__PURE__ */ jsx("span", { children: req.label })
|
|
133
|
-
]
|
|
134
|
-
},
|
|
135
|
-
req.label
|
|
136
|
-
)) }) });
|
|
109
|
+
return /* @__PURE__ */ jsx("div", { className: "if-passwordStrength if-internal-ps6w3k", children: /* @__PURE__ */ jsx("div", { className: "if-passwordStrength-requirements", children: requirements.map((req) => /* @__PURE__ */ jsxs("div", { className: "if-passwordStrength-requirement", children: [
|
|
110
|
+
/* @__PURE__ */ jsx(
|
|
111
|
+
"div",
|
|
112
|
+
{
|
|
113
|
+
style: {
|
|
114
|
+
display: "flex",
|
|
115
|
+
alignItems: "center",
|
|
116
|
+
justifyContent: "center",
|
|
117
|
+
width: "1rem",
|
|
118
|
+
height: "1rem",
|
|
119
|
+
borderRadius: "50%",
|
|
120
|
+
border: "2px solid",
|
|
121
|
+
borderColor: req.test(password) ? "transparent" : "#9ca3af",
|
|
122
|
+
backgroundColor: req.test(password) ? "#059669" : "white",
|
|
123
|
+
transition: "all 0.2s"
|
|
124
|
+
},
|
|
125
|
+
children: req.test(password) && /* @__PURE__ */ jsx(Check, { style: { width: "0.75rem", height: "0.75rem", color: "white" } })
|
|
126
|
+
}
|
|
127
|
+
),
|
|
128
|
+
/* @__PURE__ */ jsx("span", { children: req.label })
|
|
129
|
+
] }, req.label)) }) });
|
|
137
130
|
}
|
|
138
131
|
function createRequirements(config) {
|
|
139
132
|
const requirements = [];
|
|
@@ -201,11 +194,12 @@ function AuthPasswordField({
|
|
|
201
194
|
onFocus,
|
|
202
195
|
...props
|
|
203
196
|
}) {
|
|
197
|
+
const [searchParams] = useSearchParams();
|
|
204
198
|
const [showPassword, setShowPassword] = useState(false);
|
|
205
199
|
const [showStrength, setShowStrength] = useState(false);
|
|
206
200
|
const resolvedForgotPasswordHref = useMemo(
|
|
207
|
-
() => forgotPasswordLink ?
|
|
208
|
-
[forgotPasswordLink]
|
|
201
|
+
() => forgotPasswordLink ? resolveAuthUrl(forgotPasswordLink.href, searchParams) : void 0,
|
|
202
|
+
[forgotPasswordLink, searchParams]
|
|
209
203
|
);
|
|
210
204
|
const handleFocus = (e) => {
|
|
211
205
|
if (showStrengthIndicator) {
|
|
@@ -543,7 +537,6 @@ function AuthOAuthProviders({
|
|
|
543
537
|
function AuthVerificationCodeInput({
|
|
544
538
|
length = 6,
|
|
545
539
|
value,
|
|
546
|
-
email,
|
|
547
540
|
onChange,
|
|
548
541
|
disabled = false,
|
|
549
542
|
onComplete
|
|
@@ -591,33 +584,25 @@ function AuthVerificationCodeInput({
|
|
|
591
584
|
}
|
|
592
585
|
}
|
|
593
586
|
};
|
|
594
|
-
return /* @__PURE__ */
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
". Enter it below to proceed."
|
|
600
|
-
] }),
|
|
601
|
-
/* @__PURE__ */ jsx("div", { className: "if-verificationCode-inputContainer", children: Array.from({ length }).map((_, index) => /* @__PURE__ */ jsx(
|
|
602
|
-
"input",
|
|
603
|
-
{
|
|
604
|
-
ref: (el) => {
|
|
605
|
-
inputRefs.current[index] = el;
|
|
606
|
-
},
|
|
607
|
-
type: "text",
|
|
608
|
-
inputMode: "numeric",
|
|
609
|
-
maxLength: 1,
|
|
610
|
-
value: value[index] || "",
|
|
611
|
-
onChange: (e) => handleChange(index, e.target.value),
|
|
612
|
-
onKeyDown: (e) => handleKeyDown(index, e),
|
|
613
|
-
onPaste: handlePaste,
|
|
614
|
-
disabled,
|
|
615
|
-
className: "if-verificationCode-input",
|
|
616
|
-
autoComplete: "one-time-code"
|
|
587
|
+
return /* @__PURE__ */ jsx("div", { className: "if-verificationCode-inputContainer", children: Array.from({ length }).map((_, index) => /* @__PURE__ */ jsx(
|
|
588
|
+
"input",
|
|
589
|
+
{
|
|
590
|
+
ref: (el) => {
|
|
591
|
+
inputRefs.current[index] = el;
|
|
617
592
|
},
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
593
|
+
type: "text",
|
|
594
|
+
inputMode: "numeric",
|
|
595
|
+
maxLength: 1,
|
|
596
|
+
value: value[index] || "",
|
|
597
|
+
onChange: (e) => handleChange(index, e.target.value),
|
|
598
|
+
onKeyDown: (e) => handleKeyDown(index, e),
|
|
599
|
+
onPaste: handlePaste,
|
|
600
|
+
disabled,
|
|
601
|
+
className: "if-verificationCode-input",
|
|
602
|
+
autoComplete: "one-time-code"
|
|
603
|
+
},
|
|
604
|
+
index
|
|
605
|
+
)) });
|
|
621
606
|
}
|
|
622
607
|
var InsforgeContext = createContext(void 0);
|
|
623
608
|
function useInsforge() {
|
|
@@ -629,28 +614,20 @@ function useInsforge() {
|
|
|
629
614
|
}
|
|
630
615
|
function AuthEmailVerificationStep({
|
|
631
616
|
email,
|
|
632
|
-
method
|
|
633
|
-
onVerifyCode
|
|
617
|
+
method,
|
|
618
|
+
onVerifyCode,
|
|
619
|
+
emailSent = false
|
|
634
620
|
}) {
|
|
635
621
|
const { sendVerificationEmail } = useInsforge();
|
|
636
622
|
const [resendDisabled, setResendDisabled] = useState(true);
|
|
637
|
-
const [resendCountdown, setResendCountdown] = useState(60);
|
|
623
|
+
const [resendCountdown, setResendCountdown] = useState(emailSent ? 60 : 0);
|
|
638
624
|
const [isSending, setIsSending] = useState(false);
|
|
639
625
|
const [verificationCode, setVerificationCode] = useState("");
|
|
640
626
|
const [isVerifying, setIsVerifying] = useState(false);
|
|
641
|
-
const
|
|
642
|
-
|
|
643
|
-
const sendInitialEmail = async () => {
|
|
644
|
-
try {
|
|
645
|
-
await sendVerificationEmail(email);
|
|
646
|
-
} catch (error) {
|
|
647
|
-
console.error("Failed to send verification email:", error);
|
|
648
|
-
}
|
|
649
|
-
};
|
|
650
|
-
void sendInitialEmail();
|
|
651
|
-
}, [email, sendVerificationEmail]);
|
|
627
|
+
const isLinkMethod = method === "link";
|
|
628
|
+
const displayDescription = isLinkMethod ? "We've sent an email to {email}. Please check your email to confirm your account before signing in. The confirmation link expires in 10 minutes." : "We've sent a verification code to your inbox at {email}. Enter it below to proceed.";
|
|
652
629
|
useEffect(() => {
|
|
653
|
-
if (resendCountdown > 0) {
|
|
630
|
+
if (emailSent && resendCountdown > 0) {
|
|
654
631
|
const timer = setInterval(() => {
|
|
655
632
|
setResendCountdown((prev) => {
|
|
656
633
|
if (prev <= 1) {
|
|
@@ -662,7 +639,7 @@ function AuthEmailVerificationStep({
|
|
|
662
639
|
}, 1e3);
|
|
663
640
|
return () => clearInterval(timer);
|
|
664
641
|
}
|
|
665
|
-
}, [resendCountdown]);
|
|
642
|
+
}, [emailSent, resendCountdown]);
|
|
666
643
|
const handleResend = async () => {
|
|
667
644
|
setResendDisabled(true);
|
|
668
645
|
setResendCountdown(60);
|
|
@@ -688,23 +665,29 @@ function AuthEmailVerificationStep({
|
|
|
688
665
|
setVerificationCode("");
|
|
689
666
|
}
|
|
690
667
|
};
|
|
691
|
-
const displayDescription = defaultDescription;
|
|
692
|
-
const isLinkMethod = method === "link";
|
|
693
668
|
return /* @__PURE__ */ jsxs("div", { className: "if-verificationStep", children: [
|
|
694
|
-
/* @__PURE__ */
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
669
|
+
isLinkMethod && /* @__PURE__ */ jsxs("div", { className: "if-verificationStep-descriptionContainer", children: [
|
|
670
|
+
/* @__PURE__ */ jsx("p", { className: "if-verificationStep-descriptionTitle", children: "Verify Your Email" }),
|
|
671
|
+
/* @__PURE__ */ jsx("p", { className: "if-verificationStep-description", children: displayDescription.split("{email}").map((part, index, array) => /* @__PURE__ */ jsxs("span", { children: [
|
|
672
|
+
part,
|
|
673
|
+
index < array.length - 1 && /* @__PURE__ */ jsx("span", { className: "if-verificationLink-email", children: email })
|
|
674
|
+
] }, index)) })
|
|
675
|
+
] }),
|
|
698
676
|
!isLinkMethod && /* @__PURE__ */ jsxs("div", { className: "if-verificationStep-codeContainer", children: [
|
|
699
|
-
/* @__PURE__ */
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
677
|
+
/* @__PURE__ */ jsxs("div", { className: "if-verificationStep-codeInputWrapper", children: [
|
|
678
|
+
/* @__PURE__ */ jsx("p", { className: "if-verificationStep-codeDescription", children: displayDescription.split("{email}").map((part, index, array) => /* @__PURE__ */ jsxs("span", { children: [
|
|
679
|
+
part,
|
|
680
|
+
index < array.length - 1 && /* @__PURE__ */ jsx("span", { className: "if-verificationCode-email", children: email })
|
|
681
|
+
] }, index)) }),
|
|
682
|
+
/* @__PURE__ */ jsx(
|
|
683
|
+
AuthVerificationCodeInput,
|
|
684
|
+
{
|
|
685
|
+
value: verificationCode,
|
|
686
|
+
onChange: setVerificationCode,
|
|
687
|
+
disabled: isVerifying
|
|
688
|
+
}
|
|
689
|
+
)
|
|
690
|
+
] }),
|
|
708
691
|
/* @__PURE__ */ jsx(
|
|
709
692
|
AuthSubmitButton,
|
|
710
693
|
{
|
|
@@ -714,7 +697,7 @@ function AuthEmailVerificationStep({
|
|
|
714
697
|
onClick: () => {
|
|
715
698
|
void handleSubmit();
|
|
716
699
|
},
|
|
717
|
-
children: isVerifying ? "Verifying..." : "
|
|
700
|
+
children: isVerifying ? "Verifying..." : "Continue"
|
|
718
701
|
}
|
|
719
702
|
)
|
|
720
703
|
] }),
|
|
@@ -746,6 +729,8 @@ function AuthResetPasswordVerificationStep({
|
|
|
746
729
|
const [isSending, setIsSending] = useState(false);
|
|
747
730
|
const [verificationCode, setVerificationCode] = useState("");
|
|
748
731
|
const [isVerifying, setIsVerifying] = useState(false);
|
|
732
|
+
const isLinkMethod = method === "link";
|
|
733
|
+
const displayDescription = isLinkMethod ? "We have sent an email to {email}. Please check your email to reset your password. The link expires in 10 minutes." : "We've sent a reset password code to your inbox at {email}. Enter it below to proceed.";
|
|
749
734
|
useEffect(() => {
|
|
750
735
|
if (resendCountdown > 0) {
|
|
751
736
|
const timer = setInterval(() => {
|
|
@@ -785,17 +770,20 @@ function AuthResetPasswordVerificationStep({
|
|
|
785
770
|
setVerificationCode("");
|
|
786
771
|
}
|
|
787
772
|
};
|
|
788
|
-
const isLinkMethod = method === "link";
|
|
789
|
-
const description = isLinkMethod ? `We've sent a password reset link to ${email}. Please check your email and click the link to reset your password. The link will expire in 10 minutes.` : `We've sent a 6-digit verification code to ${email}. Please enter it below to reset your password. The code will expire in 10 minutes.`;
|
|
790
773
|
return /* @__PURE__ */ jsxs("div", { className: "if-verificationStep", children: [
|
|
791
|
-
/* @__PURE__ */
|
|
774
|
+
isLinkMethod && /* @__PURE__ */ jsxs("div", { className: "if-verificationStep-descriptionContainer", children: [
|
|
775
|
+
/* @__PURE__ */ jsx("p", { className: "if-verificationStep-descriptionTitle", children: "Check Your Email" }),
|
|
776
|
+
/* @__PURE__ */ jsx("p", { className: "if-verificationStep-description", children: displayDescription.split("{email}").map((part, index, array) => /* @__PURE__ */ jsxs("span", { children: [
|
|
777
|
+
part,
|
|
778
|
+
index < array.length - 1 && /* @__PURE__ */ jsx("span", { className: "if-verificationLink-email", children: email })
|
|
779
|
+
] }, index)) })
|
|
780
|
+
] }),
|
|
792
781
|
!isLinkMethod && /* @__PURE__ */ jsxs("div", { className: "if-verificationStep-codeContainer", children: [
|
|
793
782
|
/* @__PURE__ */ jsx("div", { className: "if-verificationStep-codeInputWrapper", children: /* @__PURE__ */ jsx(
|
|
794
783
|
AuthVerificationCodeInput,
|
|
795
784
|
{
|
|
796
785
|
value: verificationCode,
|
|
797
786
|
onChange: setVerificationCode,
|
|
798
|
-
email,
|
|
799
787
|
disabled: isVerifying
|
|
800
788
|
}
|
|
801
789
|
) }),
|
|
@@ -838,7 +826,6 @@ function SignInForm({
|
|
|
838
826
|
error,
|
|
839
827
|
loading = false,
|
|
840
828
|
oauthLoading = null,
|
|
841
|
-
availableProviders = [],
|
|
842
829
|
onOAuthClick,
|
|
843
830
|
authConfig,
|
|
844
831
|
title = "Welcome Back",
|
|
@@ -848,7 +835,7 @@ function SignInForm({
|
|
|
848
835
|
passwordLabel = "Password",
|
|
849
836
|
passwordPlaceholder = "\u2022\u2022\u2022\u2022\u2022\u2022",
|
|
850
837
|
forgotPasswordText = "Forget Password?",
|
|
851
|
-
forgotPasswordUrl,
|
|
838
|
+
forgotPasswordUrl = "/forgot-password",
|
|
852
839
|
submitButtonText = "Sign In",
|
|
853
840
|
loadingButtonText = "Signing in...",
|
|
854
841
|
signUpText = "Don't have an account?",
|
|
@@ -859,15 +846,17 @@ function SignInForm({
|
|
|
859
846
|
onVerifyCode
|
|
860
847
|
}) {
|
|
861
848
|
return /* @__PURE__ */ jsxs(AuthContainer, { children: [
|
|
862
|
-
/* @__PURE__ */ jsx(
|
|
863
|
-
|
|
849
|
+
/* @__PURE__ */ jsx(AuthHeader, { title, subtitle }),
|
|
850
|
+
/* @__PURE__ */ jsx(AuthErrorBanner, { error: error || "" }),
|
|
851
|
+
showVerificationStep ? /* @__PURE__ */ jsx(
|
|
852
|
+
AuthEmailVerificationStep,
|
|
864
853
|
{
|
|
865
|
-
|
|
866
|
-
|
|
854
|
+
email,
|
|
855
|
+
method: authConfig.verifyEmailMethod,
|
|
856
|
+
onVerifyCode,
|
|
857
|
+
emailSent: false
|
|
867
858
|
}
|
|
868
|
-
),
|
|
869
|
-
/* @__PURE__ */ jsx(AuthErrorBanner, { error: error || "" }),
|
|
870
|
-
showVerificationStep ? /* @__PURE__ */ jsx(AuthEmailVerificationStep, { email, onVerifyCode }) : /* @__PURE__ */ jsxs("form", { onSubmit, noValidate: true, className: "if-form if-internal-fm9k2p", children: [
|
|
859
|
+
) : /* @__PURE__ */ jsxs("form", { onSubmit, noValidate: true, className: "if-form if-internal-fm9k2p", children: [
|
|
871
860
|
/* @__PURE__ */ jsx(
|
|
872
861
|
AuthFormField,
|
|
873
862
|
{
|
|
@@ -902,12 +891,12 @@ function SignInForm({
|
|
|
902
891
|
] }),
|
|
903
892
|
!showVerificationStep && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
904
893
|
/* @__PURE__ */ jsx(AuthLink, { text: signUpText, linkText: signUpLinkText, href: signUpUrl }),
|
|
905
|
-
|
|
894
|
+
authConfig.oAuthProviders.length > 0 && onOAuthClick && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
906
895
|
/* @__PURE__ */ jsx(AuthDivider, { text: dividerText }),
|
|
907
896
|
/* @__PURE__ */ jsx(
|
|
908
897
|
AuthOAuthProviders,
|
|
909
898
|
{
|
|
910
|
-
providers:
|
|
899
|
+
providers: authConfig.oAuthProviders,
|
|
911
900
|
onClick: onOAuthClick,
|
|
912
901
|
disabled: loading || oauthLoading !== null,
|
|
913
902
|
loading: oauthLoading
|
|
@@ -926,7 +915,6 @@ function SignUpForm({
|
|
|
926
915
|
error,
|
|
927
916
|
loading = false,
|
|
928
917
|
oauthLoading = null,
|
|
929
|
-
availableProviders = [],
|
|
930
918
|
onOAuthClick,
|
|
931
919
|
authConfig,
|
|
932
920
|
title = "Get Started",
|
|
@@ -945,15 +933,17 @@ function SignUpForm({
|
|
|
945
933
|
onVerifyCode
|
|
946
934
|
}) {
|
|
947
935
|
return /* @__PURE__ */ jsxs(AuthContainer, { children: [
|
|
948
|
-
/* @__PURE__ */ jsx(
|
|
949
|
-
|
|
936
|
+
/* @__PURE__ */ jsx(AuthHeader, { title, subtitle }),
|
|
937
|
+
/* @__PURE__ */ jsx(AuthErrorBanner, { error: error || "" }),
|
|
938
|
+
showVerificationStep ? /* @__PURE__ */ jsx(
|
|
939
|
+
AuthEmailVerificationStep,
|
|
950
940
|
{
|
|
951
|
-
|
|
952
|
-
|
|
941
|
+
email,
|
|
942
|
+
method: authConfig.verifyEmailMethod,
|
|
943
|
+
onVerifyCode,
|
|
944
|
+
emailSent: true
|
|
953
945
|
}
|
|
954
|
-
),
|
|
955
|
-
/* @__PURE__ */ jsx(AuthErrorBanner, { error: error || "" }),
|
|
956
|
-
showVerificationStep ? /* @__PURE__ */ jsx(AuthEmailVerificationStep, { email, onVerifyCode }) : /* @__PURE__ */ jsxs("form", { onSubmit, noValidate: true, className: "if-form if-internal-fm9k2p", children: [
|
|
946
|
+
) : /* @__PURE__ */ jsxs("form", { onSubmit, noValidate: true, className: "if-form if-internal-fm9k2p", children: [
|
|
957
947
|
/* @__PURE__ */ jsx(
|
|
958
948
|
AuthFormField,
|
|
959
949
|
{
|
|
@@ -976,7 +966,6 @@ function SignUpForm({
|
|
|
976
966
|
value: password,
|
|
977
967
|
onChange: (e) => onPasswordChange(e.target.value),
|
|
978
968
|
required: true,
|
|
979
|
-
minLength: authConfig.passwordMinLength,
|
|
980
969
|
autoComplete: "new-password",
|
|
981
970
|
showStrengthIndicator: true,
|
|
982
971
|
authConfig
|
|
@@ -986,12 +975,12 @@ function SignUpForm({
|
|
|
986
975
|
] }),
|
|
987
976
|
!showVerificationStep && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
988
977
|
/* @__PURE__ */ jsx(AuthLink, { text: signInText, linkText: signInLinkText, href: signInUrl }),
|
|
989
|
-
|
|
978
|
+
authConfig.oAuthProviders.length > 0 && onOAuthClick && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
990
979
|
/* @__PURE__ */ jsx(AuthDivider, { text: dividerText }),
|
|
991
980
|
/* @__PURE__ */ jsx(
|
|
992
981
|
AuthOAuthProviders,
|
|
993
982
|
{
|
|
994
|
-
providers:
|
|
983
|
+
providers: authConfig.oAuthProviders,
|
|
995
984
|
onClick: onOAuthClick,
|
|
996
985
|
disabled: loading || oauthLoading !== null,
|
|
997
986
|
loading: oauthLoading
|
|
@@ -1008,10 +997,10 @@ function ForgotPasswordForm({
|
|
|
1008
997
|
error,
|
|
1009
998
|
loading = false,
|
|
1010
999
|
title = "Forgot Password?",
|
|
1011
|
-
subtitle = "Enter your email address and we'll send you a
|
|
1000
|
+
subtitle = "Enter your email address and we'll send you a {method} to reset your password.",
|
|
1012
1001
|
emailLabel = "Email",
|
|
1013
1002
|
emailPlaceholder = "example@email.com",
|
|
1014
|
-
submitButtonText = "
|
|
1003
|
+
submitButtonText = "Reset Password",
|
|
1015
1004
|
loadingButtonText = "Sending...",
|
|
1016
1005
|
backToSignInText = "Remember your password?",
|
|
1017
1006
|
backToSignInUrl = "/sign-in",
|
|
@@ -1020,14 +1009,9 @@ function ForgotPasswordForm({
|
|
|
1020
1009
|
onVerifyCode,
|
|
1021
1010
|
onResendEmail
|
|
1022
1011
|
}) {
|
|
1012
|
+
const displaySubtitle = subtitle.replace("{method}", resetPasswordMethod);
|
|
1023
1013
|
return /* @__PURE__ */ jsxs(AuthContainer, { children: [
|
|
1024
|
-
/* @__PURE__ */ jsx(
|
|
1025
|
-
AuthHeader,
|
|
1026
|
-
{
|
|
1027
|
-
title: showVerificationStep ? resetPasswordMethod === "link" ? "Check Your Email" : "Enter Reset Code" : title,
|
|
1028
|
-
subtitle: showVerificationStep ? "" : subtitle
|
|
1029
|
-
}
|
|
1030
|
-
),
|
|
1014
|
+
/* @__PURE__ */ jsx(AuthHeader, { title, subtitle: displaySubtitle }),
|
|
1031
1015
|
/* @__PURE__ */ jsx(AuthErrorBanner, { error: error || "" }),
|
|
1032
1016
|
showVerificationStep ? /* @__PURE__ */ jsx(
|
|
1033
1017
|
AuthResetPasswordVerificationStep,
|