@main12/auth-login 0.1.0 → 0.1.2

package/dist/components/pages/LoginPageTailwind.js

@@ -0,0 +1,222 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React, { Suspense } from 'react';
+import { useSearchParams } from 'next/navigation';
+import { Button, Input, Divider, Spinner } from '../ui/index.js';
+import { useLoginFlow } from '../../auth/application/hooks/useLoginFlow.js';
+import { AuthLayout } from '../AuthLayout.js';
+function LoginContent({ onPasswordLogin, redirectTo = '/', showGoogleOAuth = true, signupUrl = '/signup', logo, poweredBy, cardClassName, backgroundClass }) {
+    const searchParams = useSearchParams();
+    const resolvedRedirect = searchParams.get('redirect') || redirectTo;
+    const { step, email, password, error, isLoading, isSendingOtp, showPassword, setEmail, setPassword, setShowPassword, handleEmailSubmit, handlePasswordSubmit, handleSendOtp, handleEditEmail, handleGoogleLogin } = useLoginFlow({
+        redirectTo: resolvedRedirect,
+        onPasswordLogin
+    });
+    const stepTitle = step === 'otp-prompt' ? 'Verify Identity' : step === 'email' ? 'Welcome Back' : 'Enter Password';
+    const stepSubtitle = step === 'otp-prompt' ? "We need to verify it's you." : step === 'email' ? 'Sign in with your email to continue.' : 'Enter your password to sign in.';
+    return /*#__PURE__*/ _jsxs(AuthLayout, {
+        logo: logo,
+        title: stepTitle,
+        subtitle: stepSubtitle,
+        poweredBy: poweredBy,
+        cardClassName: cardClassName,
+        backgroundClass: backgroundClass,
+        footer: /*#__PURE__*/ _jsxs("p", {
+            className: "text-center text-gray-600 text-sm",
+            children: [
+                "Don't have an account?",
+                ' ',
+                /*#__PURE__*/ _jsx("a", {
+                    href: signupUrl,
+                    className: "text-gray-900 font-medium hover:underline",
+                    children: "Sign up"
+                })
+            ]
+        }),
+        children: [
+            step === 'email' && /*#__PURE__*/ _jsxs("div", {
+                className: "animate-[fadeIn_0.3s_ease-out]",
+                children: [
+                    showGoogleOAuth && /*#__PURE__*/ _jsxs(_Fragment, {
+                        children: [
+                            /*#__PURE__*/ _jsxs(Button, {
+                                fullWidth: true,
+                                variant: "bordered",
+                                size: "lg",
+                                className: "mb-4",
+                                onPress: handleGoogleLogin,
+                                children: [
+                                    /*#__PURE__*/ _jsx("span", {
+                                        className: "text-lg",
+                                        children: "G"
+                                    }),
+                                    " Continue with Google"
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                className: "flex items-center gap-4 my-4",
+                                children: [
+                                    /*#__PURE__*/ _jsx(Divider, {
+                                        className: "flex-1"
+                                    }),
+                                    /*#__PURE__*/ _jsx("span", {
+                                        className: "text-gray-500 text-sm",
+                                        children: "or"
+                                    }),
+                                    /*#__PURE__*/ _jsx(Divider, {
+                                        className: "flex-1"
+                                    })
+                                ]
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs("form", {
+                        onSubmit: handleEmailSubmit,
+                        className: "space-y-4",
+                        children: [
+                            error && /*#__PURE__*/ _jsx("div", {
+                                className: "bg-red-50 text-red-600 border border-red-200 rounded-lg p-3 text-sm",
+                                children: error
+                            }),
+                            /*#__PURE__*/ _jsx(Input, {
+                                type: "email",
+                                label: "Email",
+                                value: email,
+                                onValueChange: setEmail,
+                                isRequired: true
+                            }),
+                            /*#__PURE__*/ _jsx(Button, {
+                                type: "submit",
+                                variant: "primary",
+                                isLoading: isLoading,
+                                children: "Continue"
+                            })
+                        ]
+                    })
+                ]
+            }),
+            step === 'password' && /*#__PURE__*/ _jsxs("div", {
+                className: "animate-[fadeIn_0.3s_ease-out]",
+                children: [
+                    /*#__PURE__*/ _jsxs("div", {
+                        className: "flex items-center justify-between border border-gray-300 rounded-xl px-4 py-3 mb-4",
+                        children: [
+                            /*#__PURE__*/ _jsx("span", {
+                                className: "text-gray-900 text-sm",
+                                children: email
+                            }),
+                            /*#__PURE__*/ _jsx("button", {
+                                type: "button",
+                                onClick: handleEditEmail,
+                                className: "text-gray-600 text-sm font-medium hover:text-gray-900",
+                                children: "Edit"
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs("form", {
+                        onSubmit: handlePasswordSubmit,
+                        className: "space-y-4",
+                        children: [
+                            error && /*#__PURE__*/ _jsx("div", {
+                                className: "bg-red-50 text-red-600 border border-red-200 rounded-lg p-3 text-sm",
+                                children: error
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                className: "relative",
+                                children: [
+                                    /*#__PURE__*/ _jsx(Input, {
+                                        type: showPassword ? 'text' : 'password',
+                                        label: "Password",
+                                        value: password,
+                                        onValueChange: setPassword,
+                                        isRequired: true,
+                                        autoFocus: true
+                                    }),
+                                    /*#__PURE__*/ _jsx("button", {
+                                        type: "button",
+                                        onClick: ()=>setShowPassword(!showPassword),
+                                        className: "absolute right-4 top-9 text-gray-400 hover:text-gray-600",
+                                        children: showPassword ? '🙈' : '👁'
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsx("div", {
+                                className: "text-left",
+                                children: /*#__PURE__*/ _jsx("a", {
+                                    href: "/forgot-password",
+                                    className: "text-sm text-gray-700 hover:text-gray-900 hover:underline",
+                                    children: "Forgot password?"
+                                })
+                            }),
+                            /*#__PURE__*/ _jsx(Button, {
+                                type: "submit",
+                                variant: "primary",
+                                isLoading: isLoading,
+                                children: "Continue"
+                            })
+                        ]
+                    })
+                ]
+            }),
+            step === 'otp-prompt' && /*#__PURE__*/ _jsxs("div", {
+                className: "animate-[fadeIn_0.3s_ease-out]",
+                children: [
+                    /*#__PURE__*/ _jsxs("div", {
+                        className: "flex items-center justify-between border border-gray-300 rounded-xl px-4 py-3 mb-4",
+                        children: [
+                            /*#__PURE__*/ _jsx("span", {
+                                className: "text-gray-900 text-sm",
+                                children: email
+                            }),
+                            /*#__PURE__*/ _jsx("button", {
+                                type: "button",
+                                onClick: handleEditEmail,
+                                className: "text-gray-600 text-sm font-medium hover:text-gray-900",
+                                children: "Edit"
+                            })
+                        ]
+                    }),
+                    error && /*#__PURE__*/ _jsx("div", {
+                        className: "bg-red-50 text-red-600 border border-red-200 rounded-lg p-3 text-sm mb-4",
+                        children: error
+                    }),
+                    /*#__PURE__*/ _jsx("div", {
+                        className: "bg-blue-50 border border-blue-200 rounded-lg p-4 mb-4",
+                        children: /*#__PURE__*/ _jsxs("div", {
+                            className: "flex gap-3",
+                            children: [
+                                /*#__PURE__*/ _jsx("span", {
+                                    className: "text-blue-500 text-lg",
+                                    children: "✉"
+                                }),
+                                /*#__PURE__*/ _jsx("p", {
+                                    className: "text-sm text-blue-700",
+                                    children: "We'll send a verification code to this email."
+                                })
+                            ]
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(Button, {
+                        variant: "primary",
+                        isLoading: isSendingOtp,
+                        onPress: handleSendOtp,
+                        children: isSendingOtp ? 'Sending...' : 'Send Code'
+                    })
+                ]
+            })
+        ]
+    });
+}
+export default function LoginPage(props) {
+    return /*#__PURE__*/ _jsx(Suspense, {
+        fallback: /*#__PURE__*/ _jsx("div", {
+            className: "min-h-screen flex items-center justify-center",
+            children: /*#__PURE__*/ _jsx(Spinner, {
+                size: "lg"
+            })
+        }),
+        children: /*#__PURE__*/ _jsx(LoginContent, {
+            ...props
+        })
+    });
+}

package/dist/components/pages/SetPasswordPage.d.ts

@@ -2,4 +2,4 @@ import type { AuthLayoutConfig } from '../AuthLayout.js';
 export interface SetPasswordPageProps extends AuthLayoutConfig {
     redirectTo?: string;
 }
-export default function SetPasswordPage({ redirectTo, logo, poweredBy, cardClassName, backgroundClass, }: SetPasswordPageProps): import("react/jsx-runtime").JSX.Element;
+export default function SetPasswordPage(props: SetPasswordPageProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/pages/SetPasswordPage.js

@@ -1,74 +1,12 @@
 'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { Button, Input } from '../ui/index.js';
-import { useSetPasswordFlow } from '../../auth/application/hooks/useSetPasswordFlow.js';
-import { AuthLayout } from '../AuthLayout.js';
-export default function SetPasswordPage({ redirectTo = '/', logo, poweredBy, cardClassName, backgroundClass }) {
-    const { password, confirmPassword, error, isLoading, showPassword, strength, setPassword, setConfirmPassword, setShowPassword, handleSubmit } = useSetPasswordFlow({
-        redirectTo
-    });
-    const strengthBars = Array.from({
-        length: 5
-    }, (_, i)=>i < strength.score);
-    return /*#__PURE__*/ _jsx(AuthLayout, {
-        logo: logo,
-        title: "Set Your Password",
-        subtitle: "Create a secure password for your account",
-        poweredBy: poweredBy,
-        cardClassName: cardClassName,
-        backgroundClass: backgroundClass,
-        children: /*#__PURE__*/ _jsxs("form", {
-            onSubmit: handleSubmit,
-            className: "space-y-4",
-            children: [
-                error && /*#__PURE__*/ _jsx("div", {
-                    className: "bg-red-50 text-red-600 border border-red-200 rounded-lg p-3 text-sm animate-[fadeIn_0.2s_ease-out]",
-                    children: error
-                }),
-                /*#__PURE__*/ _jsxs("div", {
-                    className: "relative",
-                    children: [
-                        /*#__PURE__*/ _jsx(Input, {
-                            type: showPassword ? 'text' : 'password',
-                            label: "New Password",
-                            value: password,
-                            onValueChange: setPassword,
-                            isRequired: true,
-                            autoFocus: true
-                        }),
-                        /*#__PURE__*/ _jsx("button", {
-                            type: "button",
-                            onClick: ()=>setShowPassword(!showPassword),
-                            className: "absolute right-4 top-9 text-gray-400 hover:text-gray-600",
-                            children: showPassword ? '🙈' : '👁'
-                        })
-                    ]
-                }),
-                password.length > 0 && /*#__PURE__*/ _jsx("div", {
-                    className: "flex gap-1",
-                    children: strengthBars.map((active, i)=>/*#__PURE__*/ _jsx("div", {
-                            className: `h-1 flex-1 rounded-full ${active ? 'bg-[#D5E855]' : 'bg-gray-200'}`
-                        }, i))
-                }),
-                password.length > 0 && !strength.isValid && /*#__PURE__*/ _jsx("p", {
-                    className: "text-xs text-gray-500",
-                    children: "At least 8 chars with 3 of: uppercase, lowercase, number, special character"
-                }),
-                /*#__PURE__*/ _jsx(Input, {
-                    type: showPassword ? 'text' : 'password',
-                    label: "Confirm Password",
-                    value: confirmPassword,
-                    onValueChange: setConfirmPassword,
-                    isRequired: true
-                }),
-                /*#__PURE__*/ _jsx(Button, {
-                    type: "submit",
-                    variant: "primary",
-                    isLoading: isLoading,
-                    children: "Set Password"
-                })
-            ]
-        })
+import { jsx as _jsx } from "react/jsx-runtime";
+import { pluginConfig } from '../../config.js';
+import SetPasswordPageTailwind from './SetPasswordPageTailwind.js';
+import SetPasswordPageHero from './SetPasswordPageHero.js';
+export default function SetPasswordPage(props) {
+    return pluginConfig.style === 'hero-ui' ? /*#__PURE__*/ _jsx(SetPasswordPageHero, {
+        ...props
+    }) : /*#__PURE__*/ _jsx(SetPasswordPageTailwind, {
+        ...props
     });
 }

package/dist/components/pages/SetPasswordPageHero.d.ts

@@ -0,0 +1,5 @@
+import type { AuthLayoutConfig } from '../AuthLayout.js';
+export interface SetPasswordPageHeroProps extends AuthLayoutConfig {
+    redirectTo?: string;
+}
+export default function SetPasswordPageHero({ redirectTo, logo, poweredBy, cardClassName, backgroundClass }: SetPasswordPageHeroProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/pages/SetPasswordPageHero.js

@@ -0,0 +1,93 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { Button, Input } from '@heroui/react';
+import { Icon } from '@iconify/react';
+import { motion } from 'framer-motion';
+import { useSetPasswordFlow } from '../../auth/application/hooks/useSetPasswordFlow.js';
+import { AuthLayout } from '../AuthLayout.js';
+export default function SetPasswordPageHero({ redirectTo = '/', logo, poweredBy, cardClassName, backgroundClass }) {
+    const { password, confirmPassword, error, isLoading, showPassword, strength, setPassword, setConfirmPassword, setShowPassword, handleSubmit } = useSetPasswordFlow({
+        redirectTo
+    });
+    const bars = Array.from({
+        length: 5
+    }, (_, i)=>i < strength.score);
+    return /*#__PURE__*/ _jsx(AuthLayout, {
+        logo: logo,
+        title: "Set Your Password",
+        subtitle: "Create a secure password for your account",
+        poweredBy: poweredBy,
+        cardClassName: cardClassName,
+        backgroundClass: backgroundClass,
+        children: /*#__PURE__*/ _jsxs("form", {
+            onSubmit: handleSubmit,
+            className: "space-y-4",
+            children: [
+                error && /*#__PURE__*/ _jsx(motion.div, {
+                    className: "bg-red-50 text-red-600 border border-red-200 rounded-lg p-3 text-sm",
+                    initial: {
+                        opacity: 0
+                    },
+                    animate: {
+                        opacity: 1
+                    },
+                    children: error
+                }),
+                /*#__PURE__*/ _jsx(Input, {
+                    type: showPassword ? 'text' : 'password',
+                    label: "New Password",
+                    value: password,
+                    onValueChange: setPassword,
+                    variant: "bordered",
+                    size: "lg",
+                    isRequired: true,
+                    autoFocus: true,
+                    classNames: {
+                        input: 'text-gray-900',
+                        label: 'text-gray-600',
+                        inputWrapper: 'border-gray-300 bg-white'
+                    },
+                    endContent: /*#__PURE__*/ _jsx("button", {
+                        type: "button",
+                        onClick: ()=>setShowPassword(!showPassword),
+                        children: /*#__PURE__*/ _jsx(Icon, {
+                            icon: showPassword ? 'lucide:eye-off' : 'lucide:eye',
+                            className: "text-gray-400",
+                            width: 20
+                        })
+                    })
+                }),
+                password.length > 0 && /*#__PURE__*/ _jsx("div", {
+                    className: "flex gap-1",
+                    children: bars.map((a, i)=>/*#__PURE__*/ _jsx("div", {
+                            className: `h-1 flex-1 rounded-full ${a ? 'bg-[#D5E855]' : 'bg-gray-200'}`
+                        }, i))
+                }),
+                /*#__PURE__*/ _jsx(Input, {
+                    type: showPassword ? 'text' : 'password',
+                    label: "Confirm Password",
+                    value: confirmPassword,
+                    onValueChange: setConfirmPassword,
+                    variant: "bordered",
+                    size: "lg",
+                    isRequired: true,
+                    classNames: {
+                        input: 'text-gray-900',
+                        label: 'text-gray-600',
+                        inputWrapper: 'border-gray-300 bg-white'
+                    }
+                }),
+                /*#__PURE__*/ _jsx(Button, {
+                    type: "submit",
+                    fullWidth: true,
+                    size: "lg",
+                    color: "primary",
+                    isLoading: isLoading,
+                    className: "h-12 font-semibold",
+                    children: "Set Password"
+                })
+            ]
+        })
+    });
+}

package/dist/components/pages/SetPasswordPageTailwind.d.ts

@@ -0,0 +1,5 @@
+import type { AuthLayoutConfig } from '../AuthLayout.js';
+export interface SetPasswordPageProps extends AuthLayoutConfig {
+    redirectTo?: string;
+}
+export default function SetPasswordPage({ redirectTo, logo, poweredBy, cardClassName, backgroundClass, }: SetPasswordPageProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/pages/SetPasswordPageTailwind.js

@@ -0,0 +1,74 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { Button, Input } from '../ui/index.js';
+import { useSetPasswordFlow } from '../../auth/application/hooks/useSetPasswordFlow.js';
+import { AuthLayout } from '../AuthLayout.js';
+export default function SetPasswordPage({ redirectTo = '/', logo, poweredBy, cardClassName, backgroundClass }) {
+    const { password, confirmPassword, error, isLoading, showPassword, strength, setPassword, setConfirmPassword, setShowPassword, handleSubmit } = useSetPasswordFlow({
+        redirectTo
+    });
+    const strengthBars = Array.from({
+        length: 5
+    }, (_, i)=>i < strength.score);
+    return /*#__PURE__*/ _jsx(AuthLayout, {
+        logo: logo,
+        title: "Set Your Password",
+        subtitle: "Create a secure password for your account",
+        poweredBy: poweredBy,
+        cardClassName: cardClassName,
+        backgroundClass: backgroundClass,
+        children: /*#__PURE__*/ _jsxs("form", {
+            onSubmit: handleSubmit,
+            className: "space-y-4",
+            children: [
+                error && /*#__PURE__*/ _jsx("div", {
+                    className: "bg-red-50 text-red-600 border border-red-200 rounded-lg p-3 text-sm animate-[fadeIn_0.2s_ease-out]",
+                    children: error
+                }),
+                /*#__PURE__*/ _jsxs("div", {
+                    className: "relative",
+                    children: [
+                        /*#__PURE__*/ _jsx(Input, {
+                            type: showPassword ? 'text' : 'password',
+                            label: "New Password",
+                            value: password,
+                            onValueChange: setPassword,
+                            isRequired: true,
+                            autoFocus: true
+                        }),
+                        /*#__PURE__*/ _jsx("button", {
+                            type: "button",
+                            onClick: ()=>setShowPassword(!showPassword),
+                            className: "absolute right-4 top-9 text-gray-400 hover:text-gray-600",
+                            children: showPassword ? '🙈' : '👁'
+                        })
+                    ]
+                }),
+                password.length > 0 && /*#__PURE__*/ _jsx("div", {
+                    className: "flex gap-1",
+                    children: strengthBars.map((active, i)=>/*#__PURE__*/ _jsx("div", {
+                            className: `h-1 flex-1 rounded-full ${active ? 'bg-[#D5E855]' : 'bg-gray-200'}`
+                        }, i))
+                }),
+                password.length > 0 && !strength.isValid && /*#__PURE__*/ _jsx("p", {
+                    className: "text-xs text-gray-500",
+                    children: "At least 8 chars with 3 of: uppercase, lowercase, number, special character"
+                }),
+                /*#__PURE__*/ _jsx(Input, {
+                    type: showPassword ? 'text' : 'password',
+                    label: "Confirm Password",
+                    value: confirmPassword,
+                    onValueChange: setConfirmPassword,
+                    isRequired: true
+                }),
+                /*#__PURE__*/ _jsx(Button, {
+                    type: "submit",
+                    variant: "primary",
+                    isLoading: isLoading,
+                    children: "Set Password"
+                })
+            ]
+        })
+    });
+}

package/dist/components/pages/SignupPage.d.ts

@@ -7,4 +7,4 @@ export interface SignupPageProps extends AuthLayoutConfig {
     showGoogleOAuth?: boolean;
     loginUrl?: string;
 }
-export default function SignupPage({ onSignup, showGoogleOAuth, loginUrl, logo, poweredBy, cardClassName, backgroundClass, }: SignupPageProps): import("react/jsx-runtime").JSX.Element;
+export default function SignupPage(props: SignupPageProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/pages/SignupPage.js

@@ -1,129 +1,12 @@
 'use client';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import React from 'react';
-import { Button, Input, Divider } from '../ui/index.js';
-import { AuthLayout } from '../AuthLayout.js';
-export default function SignupPage({ onSignup, showGoogleOAuth = true, loginUrl = '/login', logo, poweredBy, cardClassName, backgroundClass }) {
-    const [name, setName] = React.useState('');
-    const [email, setEmail] = React.useState('');
-    const [isLoading, setIsLoading] = React.useState(false);
-    const [error, setError] = React.useState(null);
-    const handleSubmit = async (e)=>{
-        e.preventDefault();
-        setIsLoading(true);
-        setError(null);
-        try {
-            await onSignup({
-                name,
-                email
-            });
-            window.location.href = `/verify-otp?email=${encodeURIComponent(email)}&purpose=signup`;
-        } catch (err) {
-            setError(err.message || 'Signup failed');
-        } finally{
-            setIsLoading(false);
-        }
-    };
-    return /*#__PURE__*/ _jsxs(AuthLayout, {
-        logo: logo,
-        title: "Create Account",
-        subtitle: "Enter your details to get started",
-        poweredBy: poweredBy,
-        cardClassName: cardClassName,
-        backgroundClass: backgroundClass,
-        footer: /*#__PURE__*/ _jsxs("p", {
-            className: "text-center text-gray-600 text-sm",
-            children: [
-                "Already have an account?",
-                ' ',
-                /*#__PURE__*/ _jsx("a", {
-                    href: loginUrl,
-                    className: "text-gray-900 font-medium hover:underline",
-                    children: "Sign in"
-                })
-            ]
-        }),
-        children: [
-            showGoogleOAuth && /*#__PURE__*/ _jsxs(_Fragment, {
-                children: [
-                    /*#__PURE__*/ _jsxs(Button, {
-                        fullWidth: true,
-                        variant: "bordered",
-                        size: "lg",
-                        className: "mb-4",
-                        children: [
-                            /*#__PURE__*/ _jsx("span", {
-                                className: "text-lg",
-                                children: "G"
-                            }),
-                            " Continue with Google"
-                        ]
-                    }),
-                    /*#__PURE__*/ _jsxs("div", {
-                        className: "flex items-center gap-4 my-4",
-                        children: [
-                            /*#__PURE__*/ _jsx(Divider, {
-                                className: "flex-1"
-                            }),
-                            /*#__PURE__*/ _jsx("span", {
-                                className: "text-gray-500 text-sm",
-                                children: "or"
-                            }),
-                            /*#__PURE__*/ _jsx(Divider, {
-                                className: "flex-1"
-                            })
-                        ]
-                    })
-                ]
-            }),
-            /*#__PURE__*/ _jsxs("form", {
-                onSubmit: handleSubmit,
-                className: "space-y-4",
-                children: [
-                    error && /*#__PURE__*/ _jsx("div", {
-                        className: "bg-red-50 text-red-600 border border-red-200 rounded-lg p-3 text-sm animate-[fadeIn_0.2s_ease-out]",
-                        children: error
-                    }),
-                    /*#__PURE__*/ _jsx(Input, {
-                        label: "Full Name",
-                        value: name,
-                        onValueChange: setName,
-                        isRequired: true
-                    }),
-                    /*#__PURE__*/ _jsx(Input, {
-                        type: "email",
-                        label: "Email",
-                        value: email,
-                        onValueChange: setEmail,
-                        isRequired: true
-                    }),
-                    /*#__PURE__*/ _jsxs("p", {
-                        className: "text-xs text-gray-600 text-center",
-                        children: [
-                            "By signing up, you agree to our",
-                            ' ',
-                            /*#__PURE__*/ _jsx("a", {
-                                href: "/terms",
-                                className: "text-gray-900 hover:underline",
-                                children: "Terms of Service"
-                            }),
-                            " and",
-                            ' ',
-                            /*#__PURE__*/ _jsx("a", {
-                                href: "/privacy",
-                                className: "text-gray-900 hover:underline",
-                                children: "Privacy Policy"
-                            })
-                        ]
-                    }),
-                    /*#__PURE__*/ _jsx(Button, {
-                        type: "submit",
-                        variant: "primary",
-                        isLoading: isLoading,
-                        children: "Create Account"
-                    })
-                ]
-            })
-        ]
+import { jsx as _jsx } from "react/jsx-runtime";
+import { pluginConfig } from '../../config.js';
+import SignupPageTailwind from './SignupPageTailwind.js';
+import SignupPageHero from './SignupPageHero.js';
+export default function SignupPage(props) {
+    return pluginConfig.style === 'hero-ui' ? /*#__PURE__*/ _jsx(SignupPageHero, {
+        ...props
+    }) : /*#__PURE__*/ _jsx(SignupPageTailwind, {
+        ...props
     });
 }

package/dist/components/pages/SignupPageHero.d.ts

@@ -0,0 +1,10 @@
+import type { AuthLayoutConfig } from '../AuthLayout.js';
+export interface SignupPageHeroProps extends AuthLayoutConfig {
+    onSignup: (data: {
+        name: string;
+        email: string;
+    }) => Promise<void>;
+    showGoogleOAuth?: boolean;
+    loginUrl?: string;
+}
+export default function SignupPageHero({ onSignup, showGoogleOAuth, loginUrl, logo, poweredBy, cardClassName, backgroundClass }: SignupPageHeroProps): import("react/jsx-runtime").JSX.Element;