@insforge/react 0.4.8 → 0.4.9

package/dist/components.cjs

@@ -136,34 +136,27 @@ function AuthPasswordStrengthIndicator({
   config
 }) {
   const requirements = createRequirements(config);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "if-passwordStrength if-internal-ps6w3k", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "if-passwordStrength-requirements", children: requirements.map((req) => /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: `if-passwordStrength-requirement ${req.test(password) ? "met" : "unmet"}`,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            style: {
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "center",
-              width: "1rem",
-              height: "1rem",
-              borderRadius: "50%",
-              border: "2px solid",
-              borderColor: req.test(password) ? "transparent" : "#9ca3af",
-              backgroundColor: req.test(password) ? "#059669" : "white",
-              transition: "all 0.2s"
-            },
-            children: req.test(password) && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { style: { width: "0.75rem", height: "0.75rem", color: "white" } })
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { children: req.label })
-      ]
-    },
-    req.label
-  )) }) });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "if-passwordStrength if-internal-ps6w3k", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "if-passwordStrength-requirements", children: requirements.map((req) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "if-passwordStrength-requirement", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          width: "1rem",
+          height: "1rem",
+          borderRadius: "50%",
+          border: "2px solid",
+          borderColor: req.test(password) ? "transparent" : "#9ca3af",
+          backgroundColor: req.test(password) ? "#059669" : "white",
+          transition: "all 0.2s"
+        },
+        children: req.test(password) && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { style: { width: "0.75rem", height: "0.75rem", color: "white" } })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { children: req.label })
+  ] }, req.label)) }) });
 }
 function createRequirements(config) {
   const requirements = [];
@@ -231,11 +224,12 @@ function AuthPasswordField({
   onFocus,
   ...props
 }) {
+  const [searchParams] = reactRouterDom.useSearchParams();
   const [showPassword, setShowPassword] = react.useState(false);
   const [showStrength, setShowStrength] = react.useState(false);
   const resolvedForgotPasswordHref = react.useMemo(
-    () => forgotPasswordLink ? resolveAuthPath(forgotPasswordLink.href) : void 0,
-    [forgotPasswordLink]
+    () => forgotPasswordLink ? resolveAuthUrl(forgotPasswordLink.href, searchParams) : void 0,
+    [forgotPasswordLink, searchParams]
   );
   const handleFocus = (e) => {
     if (showStrengthIndicator) {
@@ -642,29 +636,20 @@ function AuthVerificationCodeInput({
 }
 function AuthEmailVerificationStep({
   email,
-  method = "code",
-  onVerifyCode
+  method,
+  onVerifyCode,
+  emailSent = false
 }) {
   const { sendVerificationEmail } = useInsforge();
   const [resendDisabled, setResendDisabled] = react.useState(true);
-  const [resendCountdown, setResendCountdown] = react.useState(60);
+  const [resendCountdown, setResendCountdown] = react.useState(emailSent ? 60 : 0);
   const [isSending, setIsSending] = react.useState(false);
   const [verificationCode, setVerificationCode] = react.useState("");
   const [isVerifying, setIsVerifying] = react.useState(false);
   const isLinkMethod = method === "link";
-  const displayDescription = isLinkMethod ? "We have 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.";
+  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.";
   react.useEffect(() => {
-    const sendInitialEmail = async () => {
-      try {
-        await sendVerificationEmail(email);
-      } catch (error) {
-        console.error("Failed to send verification email:", error);
-      }
-    };
-    void sendInitialEmail();
-  }, [email, sendVerificationEmail]);
-  react.useEffect(() => {
-    if (resendCountdown > 0) {
+    if (emailSent && resendCountdown > 0) {
       const timer = setInterval(() => {
         setResendCountdown((prev) => {
           if (prev <= 1) {
@@ -676,7 +661,7 @@ function AuthEmailVerificationStep({
       }, 1e3);
       return () => clearInterval(timer);
     }
-  }, [resendCountdown]);
+  }, [emailSent, resendCountdown]);
   const handleResend = async () => {
     setResendDisabled(true);
     setResendCountdown(60);
@@ -863,7 +848,6 @@ function SignInForm({
   error,
   loading = false,
   oauthLoading = null,
-  availableProviders = [],
   onOAuthClick,
   authConfig,
   title = "Welcome Back",
@@ -886,7 +870,15 @@ function SignInForm({
   return /* @__PURE__ */ jsxRuntime.jsxs(AuthContainer, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(AuthHeader, { title, subtitle }),
     /* @__PURE__ */ jsxRuntime.jsx(AuthErrorBanner, { error: error || "" }),
-    showVerificationStep ? /* @__PURE__ */ jsxRuntime.jsx(AuthEmailVerificationStep, { email, onVerifyCode }) : /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit, noValidate: true, className: "if-form if-internal-fm9k2p", children: [
+    showVerificationStep ? /* @__PURE__ */ jsxRuntime.jsx(
+      AuthEmailVerificationStep,
+      {
+        email,
+        method: authConfig.verifyEmailMethod,
+        onVerifyCode,
+        emailSent: false
+      }
+    ) : /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit, noValidate: true, className: "if-form if-internal-fm9k2p", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         AuthFormField,
         {
@@ -921,12 +913,12 @@ function SignInForm({
     ] }),
     !showVerificationStep && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(AuthLink, { text: signUpText, linkText: signUpLinkText, href: signUpUrl }),
-      availableProviders.length > 0 && onOAuthClick && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      authConfig.oAuthProviders.length > 0 && onOAuthClick && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         /* @__PURE__ */ jsxRuntime.jsx(AuthDivider, { text: dividerText }),
         /* @__PURE__ */ jsxRuntime.jsx(
           AuthOAuthProviders,
           {
-            providers: availableProviders,
+            providers: authConfig.oAuthProviders,
             onClick: onOAuthClick,
             disabled: loading || oauthLoading !== null,
             loading: oauthLoading
@@ -1001,7 +993,15 @@ function SignIn({ onError, ...uiProps }) {
     }
   }
   function handleOAuth(provider) {
-    loginWithOAuth(provider, redirectUrl || "");
+    try {
+      loginWithOAuth(provider, redirectUrl || "");
+    } catch (err) {
+      const errorMessage = err instanceof Error ? err.message : "OAuth login failed";
+      setError(errorMessage);
+      if (onError) {
+        onError(new Error(errorMessage));
+      }
+    }
   }
   if (!authConfig) {
     return null;
@@ -1017,7 +1017,6 @@ function SignIn({ onError, ...uiProps }) {
       error,
       loading,
       oauthLoading,
-      availableProviders: authConfig?.oAuthProviders || [],
       onOAuthClick: handleOAuth,
       authConfig,
       showVerificationStep: step === "awaiting-verification",
@@ -1035,7 +1034,6 @@ function SignUpForm({
   error,
   loading = false,
   oauthLoading = null,
-  availableProviders = [],
   onOAuthClick,
   authConfig,
   title = "Get Started",
@@ -1056,7 +1054,15 @@ function SignUpForm({
   return /* @__PURE__ */ jsxRuntime.jsxs(AuthContainer, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(AuthHeader, { title, subtitle }),
     /* @__PURE__ */ jsxRuntime.jsx(AuthErrorBanner, { error: error || "" }),
-    showVerificationStep ? /* @__PURE__ */ jsxRuntime.jsx(AuthEmailVerificationStep, { email, onVerifyCode }) : /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit, noValidate: true, className: "if-form if-internal-fm9k2p", children: [
+    showVerificationStep ? /* @__PURE__ */ jsxRuntime.jsx(
+      AuthEmailVerificationStep,
+      {
+        email,
+        method: authConfig.verifyEmailMethod,
+        onVerifyCode,
+        emailSent: true
+      }
+    ) : /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit, noValidate: true, className: "if-form if-internal-fm9k2p", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         AuthFormField,
         {
@@ -1079,7 +1085,6 @@ function SignUpForm({
           value: password,
           onChange: (e) => onPasswordChange(e.target.value),
           required: true,
-          minLength: authConfig.passwordMinLength,
           autoComplete: "new-password",
           showStrengthIndicator: true,
           authConfig
@@ -1089,12 +1094,12 @@ function SignUpForm({
     ] }),
     !showVerificationStep && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(AuthLink, { text: signInText, linkText: signInLinkText, href: signInUrl }),
-      availableProviders.length > 0 && onOAuthClick && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      authConfig.oAuthProviders.length > 0 && onOAuthClick && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         /* @__PURE__ */ jsxRuntime.jsx(AuthDivider, { text: dividerText }),
         /* @__PURE__ */ jsxRuntime.jsx(
           AuthOAuthProviders,
           {
-            providers: availableProviders,
+            providers: authConfig.oAuthProviders,
             onClick: onOAuthClick,
             disabled: loading || oauthLoading !== null,
             loading: oauthLoading
@@ -1222,7 +1227,15 @@ function SignUp({ onError, ...uiProps }) {
     }
   }
   function handleOAuth(provider) {
-    loginWithOAuth(provider, redirectUrl || "");
+    try {
+      loginWithOAuth(provider, redirectUrl || "");
+    } catch (err) {
+      const errorMessage = err instanceof Error ? err.message : "OAuth login failed";
+      setError(errorMessage);
+      if (onError) {
+        onError(new Error(errorMessage));
+      }
+    }
   }
   if (!authConfig) {
     return null;
@@ -1238,7 +1251,6 @@ function SignUp({ onError, ...uiProps }) {
       error,
       loading,
       oauthLoading,
-      availableProviders: authConfig?.oAuthProviders || [],
       onOAuthClick: handleOAuth,
       authConfig,
       showVerificationStep: step === "awaiting-verification",