@better-auth-ui/heroui 1.6.1 → 1.6.3

package/dist/components/auth/sign-up.js

@@ -1,71 +1,232 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useSignInSocial, useSignUpEmail } from "@better-auth-ui/react";
-import { Eye, EyeSlash } from "@gravity-ui/icons";
-import { Button, Card, cn, Description, FieldError, Form, Input, InputGroup, Label, Link, Spinner, TextField, toast } from "@heroui/react";
-import { useState } from "react";
-import { FieldSeparator } from "./field-separator";
-import { MagicLinkButton } from "./magic-link-button";
-import { ProviderButtons } from "./provider-buttons";
-/**
- * Render a sign-up form with name, email, password (and optional confirm password) fields, optional social provider buttons, and password visibility controls.
- *
- * The component reflects request state by disabling inputs and showing a pending indicator during sign-up or social sign-in.
- *
- * @param className - Additional CSS classes applied to the outer card container
- * @param socialLayout - Social layout to apply to the provider buttons component
- * @param socialPosition - Position of social provider buttons relative to the form; `"top"` or `"bottom"` (default `"bottom"`)
- * @returns The sign-up form React element
- */
-export function SignUp({ className, socialLayout, socialPosition = "bottom", variant, ...props }) {
-    const { basePaths, emailAndPassword, localization, magicLink, redirectTo, socialProviders, viewPaths, navigate } = useAuth();
-    const [password, setPassword] = useState("");
-    const [confirmPassword, setConfirmPassword] = useState("");
-    const { mutate: signUpEmail, isPending: signUpPending } = useSignUpEmail({
-        onError: (error) => {
-            setPassword("");
-            setConfirmPassword("");
-            toast.danger(error.error?.message || error.message);
-        },
-        onSuccess: () => {
-            if (emailAndPassword?.requireEmailVerification) {
-                toast.success(localization.auth.verifyYourEmail);
-                navigate({ to: `${basePaths.auth}/${viewPaths.auth.signIn}` });
-            }
-            else {
-                navigate({ to: redirectTo });
-            }
-        }
-    });
-    const [socialRedirecting, setSocialRedirecting] = useState(false);
-    const { mutate: signInSocial, isPending: socialPending } = useSignInSocial({
-        onError: (error) => toast.danger(error.error?.message || error.message),
-        onSuccess: () => {
-            setSocialRedirecting(true);
-            setTimeout(() => {
-                setSocialRedirecting(false);
-            }, 5000);
-        }
-    });
-    const [isPasswordVisible, setIsPasswordVisible] = useState(false);
-    const [isConfirmPasswordVisible, setIsConfirmPasswordVisible] = useState(false);
-    const isPending = signUpPending || socialPending || socialRedirecting;
-    const handleSubmit = (e) => {
-        e.preventDefault();
-        const formData = new FormData(e.currentTarget);
-        const name = formData.get("name");
-        const email = formData.get("email");
-        if (emailAndPassword?.confirmPassword && password !== confirmPassword) {
-            toast.danger(localization.auth.passwordsDoNotMatch);
-            setPassword("");
-            setConfirmPassword("");
-            return;
-        }
-        signUpEmail({ name, email, password });
-    };
-    const showSeparator = emailAndPassword?.enabled && !!socialProviders?.length;
-    return (_jsxs(Card, { className: cn("w-full max-w-sm p-4 md:p-6", className), variant: variant, ...props, children: [_jsx(Card.Header, { children: _jsx(Card.Title, { className: "text-xl font-semibold mb-1", children: localization.auth.signUp }) }), _jsxs(Card.Content, { className: "gap-4", children: [socialPosition === "top" && (_jsxs(_Fragment, { children: [!!socialProviders?.length && (_jsx(ProviderButtons, { isPending: isPending, socialLayout: socialLayout, signInSocial: signInSocial })), showSeparator && (_jsx(FieldSeparator, { children: localization.auth.or }))] })), emailAndPassword?.enabled && (_jsxs(Form, { onSubmit: handleSubmit, className: "flex flex-col gap-4", children: [_jsxs(TextField, { name: "name", type: "text", autoComplete: "name", isDisabled: isPending, children: [_jsx(Label, { children: localization.auth.name }), _jsx(Input, { placeholder: localization.auth.namePlaceholder, required: true, variant: variant === "transparent" ? "primary" : "secondary" }), _jsx(FieldError, {})] }), _jsxs(TextField, { name: "email", type: "email", autoComplete: "email", isDisabled: isPending, children: [_jsx(Label, { children: localization.auth.email }), _jsx(Input, { placeholder: localization.auth.emailPlaceholder, required: true, variant: variant === "transparent" ? "primary" : "secondary" }), _jsx(FieldError, {})] }), _jsxs(TextField, { minLength: emailAndPassword?.minPasswordLength, maxLength: emailAndPassword?.maxPasswordLength, name: "password", autoComplete: "new-password", isDisabled: isPending, value: password, onChange: setPassword, children: [_jsx(Label, { children: localization.auth.password }), _jsxs(InputGroup, { variant: variant === "transparent" ? "primary" : "secondary", children: [_jsx(InputGroup.Input, { placeholder: localization.auth.passwordPlaceholder, type: isPasswordVisible ? "text" : "password", name: "password", required: true }), _jsx(InputGroup.Suffix, { className: "px-0", children: _jsx(Button, { isIconOnly: true, "aria-label": isPasswordVisible
-                                                        ? localization.auth.hidePassword
-                                                        : localization.auth.showPassword, size: "sm", variant: "ghost", onPress: () => setIsPasswordVisible(!isPasswordVisible), isDisabled: isPending, children: isPasswordVisible ? _jsx(EyeSlash, {}) : _jsx(Eye, {}) }) })] }), _jsx(FieldError, {})] }), emailAndPassword?.confirmPassword && (_jsxs(TextField, { minLength: emailAndPassword?.minPasswordLength, maxLength: emailAndPassword?.maxPasswordLength, name: "confirmPassword", autoComplete: "new-password", isDisabled: isPending, value: confirmPassword, onChange: setConfirmPassword, children: [_jsx(Label, { children: localization.auth.confirmPassword }), _jsxs(InputGroup, { variant: variant === "transparent" ? "primary" : "secondary", children: [_jsx(InputGroup.Input, { name: "confirmPassword", placeholder: localization.auth.confirmPasswordPlaceholder, type: isConfirmPasswordVisible ? "text" : "password", required: true }), _jsx(InputGroup.Suffix, { className: "px-0", children: _jsx(Button, { isIconOnly: true, "aria-label": isConfirmPasswordVisible
-                                                        ? localization.auth.hidePassword
-                                                        : localization.auth.showPassword, size: "sm", variant: "ghost", onPress: () => setIsConfirmPasswordVisible(!isConfirmPasswordVisible), isDisabled: isPending, children: isConfirmPasswordVisible ? _jsx(EyeSlash, {}) : _jsx(Eye, {}) }) })] }), _jsx(FieldError, {})] })), _jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs(Button, { type: "submit", className: "w-full", isPending: isPending, children: [isPending && _jsx(Spinner, { color: "current", size: "sm" }), localization.auth.signUp] }), magicLink && (_jsx(MagicLinkButton, { view: "signUp", isPending: isPending }))] })] })), socialPosition === "bottom" && (_jsxs(_Fragment, { children: [showSeparator && (_jsx(FieldSeparator, { children: localization.auth.or })), !!socialProviders?.length && (_jsx(ProviderButtons, { socialLayout: socialLayout, signInSocial: signInSocial, isPending: isPending }))] }))] }), _jsx(Card.Footer, { className: "flex-col", children: _jsxs(Description, { className: "text-sm", children: [localization.auth.alreadyHaveAnAccount, " ", _jsx(Link, { href: `${basePaths.auth}/${viewPaths.auth.signIn}`, className: "text-accent decoration-accent no-underline hover:underline", children: localization.auth.signIn })] }) })] }));
+import { FieldSeparator as e } from "./field-separator.js";
+import { MagicLinkButton as t } from "./magic-link-button.js";
+import { ProviderButtons as n } from "./provider-buttons.js";
+import { useAuth as r, useIsUsernameAvailable as i, useSignUpEmail as ee } from "@better-auth-ui/react";
+import { Button as a, Card as o, Description as te, FieldError as s, Form as ne, Input as c, InputGroup as l, Label as u, Link as re, Spinner as d, TextField as f, cn as p, toast as m } from "@heroui/react";
+import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { useState as v } from "react";
+import { Check as y, Eye as b, EyeSlash as x, Xmark as S } from "@gravity-ui/icons";
+import { useDebouncer as C } from "@tanstack/react-pacer";
+//#region src/components/auth/sign-up.tsx
+function w({ className: w, socialLayout: T, socialPosition: E = "bottom", variant: D, ...O }) {
+	let { basePaths: k, emailAndPassword: A, localization: j, magicLink: M, redirectTo: N, socialProviders: P, username: F, viewPaths: I, navigate: L } = r(), [R, z] = v(""), [B, V] = v(""), [H, U] = v(""), { mutate: W, data: G, error: K, reset: q } = i(), J = C((e) => {
+		if (!e.trim()) {
+			q();
+			return;
+		}
+		W({ username: e.trim() });
+	}, { wait: 500 });
+	function Y(e) {
+		U(e), q(), F?.isUsernameAvailable && J.maybeExecute(e);
+	}
+	let { mutate: ie, isPending: ae } = ee({
+		onError: (e) => {
+			z(""), V(""), m.danger(e.error?.message || e.message);
+		},
+		onSuccess: () => {
+			A?.requireEmailVerification ? (m.success(j.auth.verifyYourEmail), L({ to: `${k.auth}/${I.auth.signIn}` })) : L({ to: N });
+		}
+	}), [X, oe] = v(!1), [Z, se] = v(!1), Q = ae, ce = (e) => {
+		e.preventDefault();
+		let t = new FormData(e.currentTarget), n = t.get("name"), r = t.get("email");
+		if (A?.confirmPassword && R !== B) {
+			m.danger(j.auth.passwordsDoNotMatch), z(""), V("");
+			return;
+		}
+		ie({
+			name: n,
+			email: r,
+			password: R,
+			...F?.enabled ? {
+				username: H.trim(),
+				...F.displayUsername ? { displayUsername: H.trim() } : {}
+			} : {}
+		});
+	}, $ = A?.enabled && !!P?.length;
+	return /* @__PURE__ */ _(o, {
+		className: p("w-full max-w-sm p-4 md:p-6", w),
+		variant: D,
+		...O,
+		children: [
+			/* @__PURE__ */ g(o.Header, { children: /* @__PURE__ */ g(o.Title, {
+				className: "text-xl font-semibold mb-1",
+				children: j.auth.signUp
+			}) }),
+			/* @__PURE__ */ _(o.Content, {
+				className: "gap-4",
+				children: [
+					E === "top" && /* @__PURE__ */ _(h, { children: [!!P?.length && /* @__PURE__ */ g(n, {
+						isPending: Q,
+						socialLayout: T
+					}), $ && /* @__PURE__ */ g(e, { children: j.auth.or })] }),
+					A?.enabled && /* @__PURE__ */ _(ne, {
+						onSubmit: ce,
+						className: "flex flex-col gap-4",
+						children: [
+							/* @__PURE__ */ _(f, {
+								name: "name",
+								type: "text",
+								autoComplete: "name",
+								isDisabled: Q,
+								children: [
+									/* @__PURE__ */ g(u, { children: j.auth.name }),
+									/* @__PURE__ */ g(c, {
+										placeholder: j.auth.namePlaceholder,
+										required: !0,
+										variant: D === "transparent" ? "primary" : "secondary"
+									}),
+									/* @__PURE__ */ g(s, {})
+								]
+							}),
+							F?.enabled && /* @__PURE__ */ _(f, {
+								name: "username",
+								type: "text",
+								autoComplete: "username",
+								minLength: F.minUsernameLength,
+								maxLength: F.maxUsernameLength,
+								isDisabled: Q,
+								value: H,
+								onChange: Y,
+								isInvalid: !!K || G && !G.available,
+								children: [
+									/* @__PURE__ */ g(u, { children: j.auth.username }),
+									/* @__PURE__ */ _(l, {
+										variant: D === "transparent" ? "primary" : "secondary",
+										children: [/* @__PURE__ */ g(l.Input, {
+											placeholder: j.auth.usernamePlaceholder,
+											required: !0
+										}), F.isUsernameAvailable && H.trim() && /* @__PURE__ */ g(l.Suffix, {
+											className: "px-2",
+											children: G?.available ? /* @__PURE__ */ g(y, { className: "text-success" }) : K || G?.available === !1 ? /* @__PURE__ */ g(S, { className: "text-danger" }) : /* @__PURE__ */ g(d, {
+												size: "sm",
+												color: "current"
+											})
+										})]
+									}),
+									/* @__PURE__ */ g(s, { children: K?.error?.message || K?.message || (G?.available === !1 ? j.auth.usernameTaken : null) })
+								]
+							}),
+							/* @__PURE__ */ _(f, {
+								name: "email",
+								type: "email",
+								autoComplete: "email",
+								isDisabled: Q,
+								children: [
+									/* @__PURE__ */ g(u, { children: j.auth.email }),
+									/* @__PURE__ */ g(c, {
+										placeholder: j.auth.emailPlaceholder,
+										required: !0,
+										variant: D === "transparent" ? "primary" : "secondary"
+									}),
+									/* @__PURE__ */ g(s, {})
+								]
+							}),
+							/* @__PURE__ */ _(f, {
+								minLength: A?.minPasswordLength,
+								maxLength: A?.maxPasswordLength,
+								name: "password",
+								autoComplete: "new-password",
+								isDisabled: Q,
+								value: R,
+								onChange: z,
+								children: [
+									/* @__PURE__ */ g(u, { children: j.auth.password }),
+									/* @__PURE__ */ _(l, {
+										variant: D === "transparent" ? "primary" : "secondary",
+										children: [/* @__PURE__ */ g(l.Input, {
+											placeholder: j.auth.passwordPlaceholder,
+											type: X ? "text" : "password",
+											name: "password",
+											required: !0
+										}), /* @__PURE__ */ g(l.Suffix, {
+											className: "px-0",
+											children: /* @__PURE__ */ g(a, {
+												isIconOnly: !0,
+												"aria-label": X ? j.auth.hidePassword : j.auth.showPassword,
+												size: "sm",
+												variant: "ghost",
+												onPress: () => oe(!X),
+												isDisabled: Q,
+												children: g(X ? x : b, {})
+											})
+										})]
+									}),
+									/* @__PURE__ */ g(s, {})
+								]
+							}),
+							A?.confirmPassword && /* @__PURE__ */ _(f, {
+								minLength: A?.minPasswordLength,
+								maxLength: A?.maxPasswordLength,
+								name: "confirmPassword",
+								autoComplete: "new-password",
+								isDisabled: Q,
+								value: B,
+								onChange: V,
+								children: [
+									/* @__PURE__ */ g(u, { children: j.auth.confirmPassword }),
+									/* @__PURE__ */ _(l, {
+										variant: D === "transparent" ? "primary" : "secondary",
+										children: [/* @__PURE__ */ g(l.Input, {
+											name: "confirmPassword",
+											placeholder: j.auth.confirmPasswordPlaceholder,
+											type: Z ? "text" : "password",
+											required: !0
+										}), /* @__PURE__ */ g(l.Suffix, {
+											className: "px-0",
+											children: /* @__PURE__ */ g(a, {
+												isIconOnly: !0,
+												"aria-label": Z ? j.auth.hidePassword : j.auth.showPassword,
+												size: "sm",
+												variant: "ghost",
+												onPress: () => se(!Z),
+												isDisabled: Q,
+												children: g(Z ? x : b, {})
+											})
+										})]
+									}),
+									/* @__PURE__ */ g(s, {})
+								]
+							}),
+							/* @__PURE__ */ _("div", {
+								className: "flex flex-col gap-3",
+								children: [/* @__PURE__ */ _(a, {
+									type: "submit",
+									className: "w-full",
+									isPending: Q,
+									children: [Q && /* @__PURE__ */ g(d, {
+										color: "current",
+										size: "sm"
+									}), j.auth.signUp]
+								}), M && /* @__PURE__ */ g(t, {
+									view: "signUp",
+									isPending: Q
+								})]
+							})
+						]
+					}),
+					E === "bottom" && /* @__PURE__ */ _(h, { children: [$ && /* @__PURE__ */ g(e, { children: j.auth.or }), !!P?.length && /* @__PURE__ */ g(n, {
+						socialLayout: T,
+						isPending: Q
+					})] })
+				]
+			}),
+			/* @__PURE__ */ g(o.Footer, {
+				className: "flex-col",
+				children: /* @__PURE__ */ _(te, {
+					className: "text-sm",
+					children: [
+						j.auth.alreadyHaveAnAccount,
+						" ",
+						/* @__PURE__ */ g(re, {
+							href: `${k.auth}/${I.auth.signIn}`,
+							className: "text-accent decoration-accent no-underline hover:underline",
+							children: j.auth.signIn
+						})
+					]
+				})
+			})
+		]
+	});
 }
+//#endregion
+export { w as SignUp };

package/dist/components/email/email-changed-email.d.ts

@@ -1,3 +1,3 @@
-import { type EmailChangedEmailProps } from "@better-auth-ui/react";
-export type { EmailChangedEmailProps } from "@better-auth-ui/react";
+import { EmailChangedEmailProps } from '@better-auth-ui/react';
+export type { EmailChangedEmailProps } from '@better-auth-ui/react';
 export declare function EmailChangedEmail({ colors, classNames, ...props }: EmailChangedEmailProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/email/email-changed-email.js

@@ -1,23 +1,30 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { EmailChangedEmail as EmailChangedEmailPrimitive } from "@better-auth-ui/react";
-import { cn } from "@heroui/react";
-export function EmailChangedEmail({ colors, classNames, ...props }) {
-    return (_jsx(EmailChangedEmailPrimitive, { colors: {
-            light: {
-                background: "#F5F5F5",
-                primary: "#0285F7",
-                primaryForeground: "#FCFCFC",
-                ...colors?.light
-            },
-            dark: {
-                background: "#060607",
-                primary: "#0584F6",
-                primaryForeground: "#FCFCFC",
-                ...colors?.dark
-            }
-        }, classNames: {
-            ...classNames,
-            card: cn("border-none rounded-3xl", classNames?.card),
-            button: cn("rounded-full", classNames?.button)
-        }, ...props }));
+import { EmailChangedEmail as e } from "@better-auth-ui/react";
+import { cn as t } from "@heroui/react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/email/email-changed-email.tsx
+function r({ colors: r, classNames: i, ...a }) {
+	return /* @__PURE__ */ n(e, {
+		colors: {
+			light: {
+				background: "#F5F5F5",
+				primary: "#0285F7",
+				primaryForeground: "#FCFCFC",
+				...r?.light
+			},
+			dark: {
+				background: "#060607",
+				primary: "#0584F6",
+				primaryForeground: "#FCFCFC",
+				...r?.dark
+			}
+		},
+		classNames: {
+			...i,
+			card: t("border-none rounded-3xl", i?.card),
+			button: t("rounded-full", i?.button)
+		},
+		...a
+	});
 }
+//#endregion
+export { r as EmailChangedEmail };

package/dist/components/email/email-verification-email.d.ts

@@ -1,3 +1,3 @@
-import { type EmailVerificationEmailProps } from "@better-auth-ui/react";
-export type { EmailVerificationEmailProps } from "@better-auth-ui/react";
+import { EmailVerificationEmailProps } from '@better-auth-ui/react';
+export type { EmailVerificationEmailProps } from '@better-auth-ui/react';
 export declare function EmailVerificationEmail({ colors, classNames, ...props }: EmailVerificationEmailProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/email/email-verification-email.js

@@ -1,23 +1,30 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { EmailVerificationEmail as EmailVerificationEmailPrimitive } from "@better-auth-ui/react";
-import { cn } from "@heroui/react";
-export function EmailVerificationEmail({ colors, classNames, ...props }) {
-    return (_jsx(EmailVerificationEmailPrimitive, { colors: {
-            light: {
-                background: "#F5F5F5",
-                primary: "#0285F7",
-                primaryForeground: "#FCFCFC",
-                ...colors?.light
-            },
-            dark: {
-                background: "#060607",
-                primary: "#0584F6",
-                primaryForeground: "#FCFCFC",
-                ...colors?.dark
-            }
-        }, classNames: {
-            ...classNames,
-            card: cn("border-none rounded-3xl", classNames?.card),
-            button: cn("rounded-full", classNames?.button)
-        }, ...props }));
+import { EmailVerificationEmail as e } from "@better-auth-ui/react";
+import { cn as t } from "@heroui/react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/email/email-verification-email.tsx
+function r({ colors: r, classNames: i, ...a }) {
+	return /* @__PURE__ */ n(e, {
+		colors: {
+			light: {
+				background: "#F5F5F5",
+				primary: "#0285F7",
+				primaryForeground: "#FCFCFC",
+				...r?.light
+			},
+			dark: {
+				background: "#060607",
+				primary: "#0584F6",
+				primaryForeground: "#FCFCFC",
+				...r?.dark
+			}
+		},
+		classNames: {
+			...i,
+			card: t("border-none rounded-3xl", i?.card),
+			button: t("rounded-full", i?.button)
+		},
+		...a
+	});
 }
+//#endregion
+export { r as EmailVerificationEmail };

package/dist/components/email/magic-link-email.d.ts

@@ -1,3 +1,3 @@
-import { type MagicLinkEmailProps } from "@better-auth-ui/react";
-export type { MagicLinkEmailProps } from "@better-auth-ui/react";
+import { MagicLinkEmailProps } from '@better-auth-ui/react';
+export type { MagicLinkEmailProps } from '@better-auth-ui/react';
 export declare function MagicLinkEmail({ colors, classNames, ...props }: MagicLinkEmailProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/email/magic-link-email.js

@@ -1,23 +1,30 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { MagicLinkEmail as MagicLinkEmailPrimitive } from "@better-auth-ui/react";
-import { cn } from "@heroui/react";
-export function MagicLinkEmail({ colors, classNames, ...props }) {
-    return (_jsx(MagicLinkEmailPrimitive, { colors: {
-            light: {
-                background: "#F5F5F5",
-                primary: "#0285F7",
-                primaryForeground: "#FCFCFC",
-                ...colors?.light
-            },
-            dark: {
-                background: "#060607",
-                primary: "#0584F6",
-                primaryForeground: "#FCFCFC",
-                ...colors?.dark
-            }
-        }, classNames: {
-            ...classNames,
-            card: cn("border-none rounded-3xl", classNames?.card),
-            button: cn("rounded-full", classNames?.button)
-        }, ...props }));
+import { MagicLinkEmail as e } from "@better-auth-ui/react";
+import { cn as t } from "@heroui/react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/email/magic-link-email.tsx
+function r({ colors: r, classNames: i, ...a }) {
+	return /* @__PURE__ */ n(e, {
+		colors: {
+			light: {
+				background: "#F5F5F5",
+				primary: "#0285F7",
+				primaryForeground: "#FCFCFC",
+				...r?.light
+			},
+			dark: {
+				background: "#060607",
+				primary: "#0584F6",
+				primaryForeground: "#FCFCFC",
+				...r?.dark
+			}
+		},
+		classNames: {
+			...i,
+			card: t("border-none rounded-3xl", i?.card),
+			button: t("rounded-full", i?.button)
+		},
+		...a
+	});
 }
+//#endregion
+export { r as MagicLinkEmail };

package/dist/components/email/new-device-email.d.ts

@@ -1,3 +1,3 @@
-import { type NewDeviceEmailProps } from "@better-auth-ui/react";
-export type { NewDeviceEmailProps } from "@better-auth-ui/react";
+import { NewDeviceEmailProps } from '@better-auth-ui/react';
+export type { NewDeviceEmailProps } from '@better-auth-ui/react';
 export declare function NewDeviceEmail({ colors, classNames, ...props }: NewDeviceEmailProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/email/new-device-email.js

@@ -1,23 +1,30 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { NewDeviceEmail as NewDeviceEmailPrimitive } from "@better-auth-ui/react";
-import { cn } from "@heroui/react";
-export function NewDeviceEmail({ colors, classNames, ...props }) {
-    return (_jsx(NewDeviceEmailPrimitive, { colors: {
-            light: {
-                background: "#F5F5F5",
-                primary: "#0285F7",
-                primaryForeground: "#FCFCFC",
-                ...colors?.light
-            },
-            dark: {
-                background: "#060607",
-                primary: "#0584F6",
-                primaryForeground: "#FCFCFC",
-                ...colors?.dark
-            }
-        }, classNames: {
-            ...classNames,
-            card: cn("border-none rounded-3xl", classNames?.card),
-            button: cn("rounded-full", classNames?.button)
-        }, ...props }));
+import { NewDeviceEmail as e } from "@better-auth-ui/react";
+import { cn as t } from "@heroui/react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/email/new-device-email.tsx
+function r({ colors: r, classNames: i, ...a }) {
+	return /* @__PURE__ */ n(e, {
+		colors: {
+			light: {
+				background: "#F5F5F5",
+				primary: "#0285F7",
+				primaryForeground: "#FCFCFC",
+				...r?.light
+			},
+			dark: {
+				background: "#060607",
+				primary: "#0584F6",
+				primaryForeground: "#FCFCFC",
+				...r?.dark
+			}
+		},
+		classNames: {
+			...i,
+			card: t("border-none rounded-3xl", i?.card),
+			button: t("rounded-full", i?.button)
+		},
+		...a
+	});
 }
+//#endregion
+export { r as NewDeviceEmail };

package/dist/components/email/otp-email.d.ts

@@ -1,3 +1,3 @@
-import { type OtpEmailProps } from "@better-auth-ui/react";
-export type { OtpEmailProps } from "@better-auth-ui/react";
+import { OtpEmailProps } from '@better-auth-ui/react';
+export type { OtpEmailProps } from '@better-auth-ui/react';
 export declare function OtpEmail({ colors, classNames, ...props }: OtpEmailProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/email/otp-email.js

@@ -1,22 +1,29 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { OtpEmail as OtpEmailPrimitive } from "@better-auth-ui/react";
-import { cn } from "@heroui/react";
-export function OtpEmail({ colors, classNames, ...props }) {
-    return (_jsx(OtpEmailPrimitive, { colors: {
-            light: {
-                background: "#F5F5F5",
-                primary: "#0285F7",
-                primaryForeground: "#FCFCFC",
-                ...colors?.light
-            },
-            dark: {
-                background: "#060607",
-                primary: "#0584F6",
-                primaryForeground: "#FCFCFC",
-                ...colors?.dark
-            }
-        }, classNames: {
-            ...classNames,
-            card: cn("border-none rounded-3xl", classNames?.card)
-        }, ...props }));
+import { OtpEmail as e } from "@better-auth-ui/react";
+import { cn as t } from "@heroui/react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/email/otp-email.tsx
+function r({ colors: r, classNames: i, ...a }) {
+	return /* @__PURE__ */ n(e, {
+		colors: {
+			light: {
+				background: "#F5F5F5",
+				primary: "#0285F7",
+				primaryForeground: "#FCFCFC",
+				...r?.light
+			},
+			dark: {
+				background: "#060607",
+				primary: "#0584F6",
+				primaryForeground: "#FCFCFC",
+				...r?.dark
+			}
+		},
+		classNames: {
+			...i,
+			card: t("border-none rounded-3xl", i?.card)
+		},
+		...a
+	});
 }
+//#endregion
+export { r as OtpEmail };

package/dist/components/email/password-changed-email.d.ts

@@ -1,3 +1,3 @@
-import { type PasswordChangedEmailProps } from "@better-auth-ui/react";
-export type { PasswordChangedEmailProps } from "@better-auth-ui/react";
+import { PasswordChangedEmailProps } from '@better-auth-ui/react';
+export type { PasswordChangedEmailProps } from '@better-auth-ui/react';
 export declare function PasswordChangedEmail({ colors, classNames, ...props }: PasswordChangedEmailProps): import("react/jsx-runtime").JSX.Element;