@questpie/admin 0.0.1

package/dist/views/auth/forgot-password-form.mjs

@@ -0,0 +1,148 @@
+import * as React$1 from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "../../components/ui/button";
+import { Field, FieldContent, FieldError, FieldGroup, FieldLabel } from "../../components/ui/field";
+import { Input } from "../../components/ui/input";
+import { cn } from "../../lib/utils";
+import { CheckCircle, Envelope, SpinnerGap } from "@phosphor-icons/react";
+import { useForm } from "react-hook-form";
+
+//#region src/views/auth/forgot-password-form.tsx
+/**
+* Forgot Password Form - request password reset email
+*/
+/**
+* Forgot password form with email field
+*
+* @example
+* ```tsx
+* const authClient = createAdminAuthClient<typeof cms>({ baseURL: '...' })
+*
+* function ForgotPasswordPage() {
+*   const [error, setError] = useState<string | null>(null)
+*
+*   const handleSubmit = async (values: ForgotPasswordFormValues) => {
+*     const result = await authClient.forgetPassword({
+*       email: values.email,
+*       redirectTo: '/reset-password',
+*     })
+*     if (result.error) {
+*       setError(result.error.message)
+*     }
+*   }
+*
+*   return (
+*     <AuthLayout title="Forgot password">
+*       <ForgotPasswordForm onSubmit={handleSubmit} error={error} />
+*     </AuthLayout>
+*   )
+* }
+* ```
+*/
+function ForgotPasswordForm({ onSubmit, onBackToLoginClick, defaultValues, className, error }) {
+	const [isSuccess, setIsSuccess] = React$1.useState(false);
+	const { register, handleSubmit, formState: { errors, isSubmitting } } = useForm({ defaultValues: {
+		email: "",
+		...defaultValues
+	} });
+	const handleFormSubmit = handleSubmit(async (values) => {
+		await onSubmit(values);
+		if (!error) setIsSuccess(true);
+	});
+	if (isSuccess) return /* @__PURE__ */ jsxs("div", {
+		className: cn("space-y-4 text-center", className),
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: "bg-primary/10 mx-auto flex size-12 items-center justify-center rounded-full",
+				children: /* @__PURE__ */ jsx(CheckCircle, {
+					className: "text-primary size-6",
+					weight: "duotone"
+				})
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "space-y-2",
+				children: [/* @__PURE__ */ jsx("h3", {
+					className: "text-sm font-medium",
+					children: "Check your email"
+				}), /* @__PURE__ */ jsx("p", {
+					className: "text-muted-foreground text-xs",
+					children: "We've sent a password reset link to your email address. Please check your inbox and follow the instructions."
+				})]
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				type: "button",
+				variant: "outline",
+				className: "w-full",
+				onClick: onBackToLoginClick,
+				children: "Back to login"
+			})
+		]
+	});
+	return /* @__PURE__ */ jsxs("form", {
+		onSubmit: handleFormSubmit,
+		className: cn("space-y-4", className),
+		children: [
+			/* @__PURE__ */ jsx("p", {
+				className: "text-muted-foreground text-xs",
+				children: "Enter your email address and we'll send you a link to reset your password."
+			}),
+			/* @__PURE__ */ jsx(FieldGroup, { children: /* @__PURE__ */ jsxs(Field, {
+				"data-invalid": !!errors.email,
+				children: [/* @__PURE__ */ jsx(FieldLabel, {
+					htmlFor: "email",
+					children: "Email"
+				}), /* @__PURE__ */ jsxs(FieldContent, { children: [/* @__PURE__ */ jsxs("div", {
+					className: "relative",
+					children: [/* @__PURE__ */ jsx(Envelope, {
+						className: "text-muted-foreground absolute left-2 top-1/2 size-4 -translate-y-1/2",
+						weight: "duotone"
+					}), /* @__PURE__ */ jsx(Input, {
+						id: "email",
+						type: "email",
+						placeholder: "you@example.com",
+						className: "pl-8",
+						autoComplete: "email",
+						"aria-invalid": !!errors.email,
+						...register("email", {
+							required: "Email is required",
+							pattern: {
+								value: /^[^\s@]+@[^\s@]+\.[^\s@]+$/,
+								message: "Invalid email address"
+							}
+						})
+					})]
+				}), /* @__PURE__ */ jsx(FieldError, { children: errors.email?.message })] })]
+			}) }),
+			error && /* @__PURE__ */ jsx("div", {
+				className: "bg-destructive/10 text-destructive rounded-md p-3 text-xs",
+				children: error
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				type: "submit",
+				className: "w-full",
+				size: "lg",
+				disabled: isSubmitting,
+				children: isSubmitting ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerGap, {
+					className: "animate-spin",
+					weight: "bold"
+				}), "Sending..."] }) : "Send reset link"
+			}),
+			/* @__PURE__ */ jsxs("p", {
+				className: "text-muted-foreground text-center text-xs",
+				children: [
+					"Remember your password?",
+					" ",
+					/* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: onBackToLoginClick,
+						className: "text-primary hover:underline",
+						children: "Back to login"
+					})
+				]
+			})
+		]
+	});
+}
+
+//#endregion
+export { ForgotPasswordForm };

package/dist/views/auth/index.mjs

@@ -0,0 +1,6 @@
+import { AuthLayout } from "./auth-layout";
+import { LoginForm } from "./login-form";
+import { ForgotPasswordForm } from "./forgot-password-form";
+import { ResetPasswordForm } from "./reset-password-form";
+
+export { AuthLayout, ForgotPasswordForm, LoginForm, ResetPasswordForm };

package/dist/views/auth/login-form.mjs

@@ -0,0 +1,156 @@
+import "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "../../components/ui/button";
+import { Field, FieldContent, FieldError, FieldGroup, FieldLabel } from "../../components/ui/field";
+import { Input } from "../../components/ui/input";
+import { cn } from "../../lib/utils";
+import { Envelope, Lock, SpinnerGap } from "@phosphor-icons/react";
+import { useForm } from "react-hook-form";
+
+//#region src/views/auth/login-form.tsx
+/**
+* Login form with email and password fields
+*
+* @example
+* ```tsx
+* const authClient = createAdminAuthClient<typeof cms>({ baseURL: '...' })
+*
+* function LoginPage() {
+*   const [error, setError] = useState<string | null>(null)
+*
+*   const handleLogin = async (values: LoginFormValues) => {
+*     const result = await authClient.signIn.email({
+*       email: values.email,
+*       password: values.password,
+*     })
+*     if (result.error) {
+*       setError(result.error.message)
+*     }
+*   }
+*
+*   return (
+*     <AuthLayout title="Sign in">
+*       <LoginForm onSubmit={handleLogin} error={error} />
+*     </AuthLayout>
+*   )
+* }
+* ```
+*/
+function LoginForm({ onSubmit, onSignUpClick, onForgotPasswordClick, showRememberMe = false, showSignUp = true, showForgotPassword = true, defaultValues, className, error }) {
+	const { register, handleSubmit, formState: { errors, isSubmitting } } = useForm({ defaultValues: {
+		email: "",
+		password: "",
+		rememberMe: false,
+		...defaultValues
+	} });
+	return /* @__PURE__ */ jsxs("form", {
+		onSubmit: handleSubmit(async (values) => {
+			await onSubmit(values);
+		}),
+		className: cn("space-y-4", className),
+		children: [
+			/* @__PURE__ */ jsxs(FieldGroup, { children: [
+				/* @__PURE__ */ jsxs(Field, {
+					"data-invalid": !!errors.email,
+					children: [/* @__PURE__ */ jsx(FieldLabel, {
+						htmlFor: "email",
+						children: "Email"
+					}), /* @__PURE__ */ jsxs(FieldContent, { children: [/* @__PURE__ */ jsxs("div", {
+						className: "relative",
+						children: [/* @__PURE__ */ jsx(Envelope, {
+							className: "text-muted-foreground absolute left-2 top-1/2 size-4 -translate-y-1/2",
+							weight: "duotone"
+						}), /* @__PURE__ */ jsx(Input, {
+							id: "email",
+							type: "email",
+							placeholder: "you@example.com",
+							className: "pl-8",
+							autoComplete: "email",
+							"aria-invalid": !!errors.email,
+							...register("email", {
+								required: "Email is required",
+								pattern: {
+									value: /^[^\s@]+@[^\s@]+\.[^\s@]+$/,
+									message: "Invalid email address"
+								}
+							})
+						})]
+					}), /* @__PURE__ */ jsx(FieldError, { children: errors.email?.message })] })]
+				}),
+				/* @__PURE__ */ jsxs(Field, {
+					"data-invalid": !!errors.password,
+					children: [/* @__PURE__ */ jsx(FieldLabel, {
+						htmlFor: "password",
+						children: "Password"
+					}), /* @__PURE__ */ jsxs(FieldContent, { children: [/* @__PURE__ */ jsxs("div", {
+						className: "relative",
+						children: [/* @__PURE__ */ jsx(Lock, {
+							className: "text-muted-foreground absolute left-2 top-1/2 size-4 -translate-y-1/2",
+							weight: "duotone"
+						}), /* @__PURE__ */ jsx(Input, {
+							id: "password",
+							type: "password",
+							placeholder: "Enter your password",
+							className: "pl-8",
+							autoComplete: "current-password",
+							"aria-invalid": !!errors.password,
+							...register("password", {
+								required: "Password is required",
+								minLength: {
+									value: 6,
+									message: "Password must be at least 6 characters"
+								}
+							})
+						})]
+					}), /* @__PURE__ */ jsx(FieldError, { children: errors.password?.message })] })]
+				}),
+				(showRememberMe || showForgotPassword) && /* @__PURE__ */ jsxs("div", {
+					className: "flex items-center justify-between",
+					children: [showRememberMe && /* @__PURE__ */ jsxs("label", {
+						className: "text-muted-foreground flex items-center gap-2 text-xs",
+						children: [/* @__PURE__ */ jsx("input", {
+							type: "checkbox",
+							className: "rounded border-gray-300",
+							...register("rememberMe")
+						}), "Remember me"]
+					}), showForgotPassword && /* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: onForgotPasswordClick,
+						className: "text-primary text-xs hover:underline",
+						children: "Forgot password?"
+					})]
+				})
+			] }),
+			error && /* @__PURE__ */ jsx("div", {
+				className: "bg-destructive/10 text-destructive rounded-md p-3 text-xs",
+				children: error
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				type: "submit",
+				className: "w-full",
+				size: "lg",
+				disabled: isSubmitting,
+				children: isSubmitting ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerGap, {
+					className: "animate-spin",
+					weight: "bold"
+				}), "Signing in..."] }) : "Sign in"
+			}),
+			showSignUp && /* @__PURE__ */ jsxs("p", {
+				className: "text-muted-foreground text-center text-xs",
+				children: [
+					"Don't have an account?",
+					" ",
+					/* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: onSignUpClick,
+						className: "text-primary hover:underline",
+						children: "Sign up"
+					})
+				]
+			})
+		]
+	});
+}
+
+//#endregion
+export { LoginForm };

package/dist/views/auth/reset-password-form.mjs

@@ -0,0 +1,184 @@
+import * as React$1 from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "../../components/ui/button";
+import { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel } from "../../components/ui/field";
+import { Input } from "../../components/ui/input";
+import { cn } from "../../lib/utils";
+import { CheckCircle, Lock, SpinnerGap } from "@phosphor-icons/react";
+import { useForm } from "react-hook-form";
+
+//#region src/views/auth/reset-password-form.tsx
+/**
+* Reset Password Form - set new password with token
+*/
+/**
+* Reset password form with password confirmation
+*
+* @example
+* ```tsx
+* const authClient = createAdminAuthClient<typeof cms>({ baseURL: '...' })
+*
+* function ResetPasswordPage() {
+*   const token = useSearchParams().get('token')
+*   const [error, setError] = useState<string | null>(null)
+*
+*   const handleSubmit = async (values) => {
+*     const result = await authClient.resetPassword({
+*       token: values.token,
+*       newPassword: values.password,
+*     })
+*     if (result.error) {
+*       setError(result.error.message)
+*     }
+*   }
+*
+*   return (
+*     <AuthLayout title="Reset password">
+*       <ResetPasswordForm token={token} onSubmit={handleSubmit} error={error} />
+*     </AuthLayout>
+*   )
+* }
+* ```
+*/
+function ResetPasswordForm({ token, onSubmit, onBackToLoginClick, minPasswordLength = 8, className, error }) {
+	const [isSuccess, setIsSuccess] = React$1.useState(false);
+	const { register, handleSubmit, watch, formState: { errors, isSubmitting } } = useForm({ defaultValues: {
+		password: "",
+		confirmPassword: ""
+	} });
+	const password = watch("password");
+	const handleFormSubmit = handleSubmit(async (values) => {
+		await onSubmit({
+			...values,
+			token
+		});
+		if (!error) setIsSuccess(true);
+	});
+	if (isSuccess) return /* @__PURE__ */ jsxs("div", {
+		className: cn("space-y-4 text-center", className),
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: "bg-primary/10 mx-auto flex size-12 items-center justify-center rounded-full",
+				children: /* @__PURE__ */ jsx(CheckCircle, {
+					className: "text-primary size-6",
+					weight: "duotone"
+				})
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "space-y-2",
+				children: [/* @__PURE__ */ jsx("h3", {
+					className: "text-sm font-medium",
+					children: "Password reset successful"
+				}), /* @__PURE__ */ jsx("p", {
+					className: "text-muted-foreground text-xs",
+					children: "Your password has been reset successfully. You can now sign in with your new password."
+				})]
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				type: "button",
+				className: "w-full",
+				size: "lg",
+				onClick: onBackToLoginClick,
+				children: "Sign in"
+			})
+		]
+	});
+	return /* @__PURE__ */ jsxs("form", {
+		onSubmit: handleFormSubmit,
+		className: cn("space-y-4", className),
+		children: [
+			/* @__PURE__ */ jsx("p", {
+				className: "text-muted-foreground text-xs",
+				children: "Enter your new password below."
+			}),
+			/* @__PURE__ */ jsxs(FieldGroup, { children: [/* @__PURE__ */ jsxs(Field, {
+				"data-invalid": !!errors.password,
+				children: [/* @__PURE__ */ jsx(FieldLabel, {
+					htmlFor: "password",
+					children: "New password"
+				}), /* @__PURE__ */ jsxs(FieldContent, { children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "relative",
+						children: [/* @__PURE__ */ jsx(Lock, {
+							className: "text-muted-foreground absolute left-2 top-1/2 size-4 -translate-y-1/2",
+							weight: "duotone"
+						}), /* @__PURE__ */ jsx(Input, {
+							id: "password",
+							type: "password",
+							placeholder: "Enter new password",
+							className: "pl-8",
+							autoComplete: "new-password",
+							"aria-invalid": !!errors.password,
+							...register("password", {
+								required: "Password is required",
+								minLength: {
+									value: minPasswordLength,
+									message: `Password must be at least ${minPasswordLength} characters`
+								}
+							})
+						})]
+					}),
+					/* @__PURE__ */ jsxs(FieldDescription, { children: [
+						"Must be at least ",
+						minPasswordLength,
+						" characters"
+					] }),
+					/* @__PURE__ */ jsx(FieldError, { children: errors.password?.message })
+				] })]
+			}), /* @__PURE__ */ jsxs(Field, {
+				"data-invalid": !!errors.confirmPassword,
+				children: [/* @__PURE__ */ jsx(FieldLabel, {
+					htmlFor: "confirmPassword",
+					children: "Confirm password"
+				}), /* @__PURE__ */ jsxs(FieldContent, { children: [/* @__PURE__ */ jsxs("div", {
+					className: "relative",
+					children: [/* @__PURE__ */ jsx(Lock, {
+						className: "text-muted-foreground absolute left-2 top-1/2 size-4 -translate-y-1/2",
+						weight: "duotone"
+					}), /* @__PURE__ */ jsx(Input, {
+						id: "confirmPassword",
+						type: "password",
+						placeholder: "Confirm new password",
+						className: "pl-8",
+						autoComplete: "new-password",
+						"aria-invalid": !!errors.confirmPassword,
+						...register("confirmPassword", {
+							required: "Please confirm your password",
+							validate: (value) => value === password || "Passwords do not match"
+						})
+					})]
+				}), /* @__PURE__ */ jsx(FieldError, { children: errors.confirmPassword?.message })] })]
+			})] }),
+			error && /* @__PURE__ */ jsx("div", {
+				className: "bg-destructive/10 text-destructive rounded-md p-3 text-xs",
+				children: error
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				type: "submit",
+				className: "w-full",
+				size: "lg",
+				disabled: isSubmitting,
+				children: isSubmitting ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerGap, {
+					className: "animate-spin",
+					weight: "bold"
+				}), "Resetting..."] }) : "Reset password"
+			}),
+			/* @__PURE__ */ jsxs("p", {
+				className: "text-muted-foreground text-center text-xs",
+				children: [
+					"Remember your password?",
+					" ",
+					/* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: onBackToLoginClick,
+						className: "text-primary hover:underline",
+						children: "Back to login"
+					})
+				]
+			})
+		]
+	});
+}
+
+//#endregion
+export { ResetPasswordForm };