@better-auth-ui/heroui 1.6.0 → 1.6.2

package/dist/components/auth/auth-provider.d.ts

@@ -1,4 +1,4 @@
-import { type AuthProviderProps as AuthProviderPropsPrimitive } from "@better-auth-ui/react";
+import { AuthProviderProps as AuthProviderPropsPrimitive } from '@better-auth-ui/react';
 export type AuthProviderProps = Omit<AuthProviderPropsPrimitive, "Link">;
 /**
  * Provides an authentication context by rendering an auth provider with the sonner toast handler injected, forwarding remaining configuration and rendering `children` inside it.

package/dist/components/auth/auth-provider.js

@@ -1,12 +1,16 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { AuthProvider as AuthProviderPrimitive } from "@better-auth-ui/react";
-import { RouterProvider } from "@heroui/react";
-/**
- * Provides an authentication context by rendering an auth provider with the sonner toast handler injected, forwarding remaining configuration and rendering `children` inside it.
- *
- * @param children - React nodes to render inside the authentication provider
- * @returns A React element that renders an authentication provider configured with the provided props and toast handler
- */
-export function AuthProvider({ children, navigate, ...config }) {
-    return (_jsx(AuthProviderPrimitive, { navigate: navigate, ...config, children: _jsx(RouterProvider, { navigate: (path) => navigate({ to: path }), children: children }) }));
+import { AuthProvider as e } from "@better-auth-ui/react";
+import { RouterProvider as t } from "@heroui/react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/auth/auth-provider.tsx
+function r({ children: r, navigate: i, ...a }) {
+	return /* @__PURE__ */ n(e, {
+		navigate: i,
+		...a,
+		children: /* @__PURE__ */ n(t, {
+			navigate: (e) => i({ to: e }),
+			children: r
+		})
+	});
 }
+//#endregion
+export { r as AuthProvider };

package/dist/components/auth/auth.d.ts

@@ -1,6 +1,6 @@
-import type { AuthView } from "@better-auth-ui/react/core";
-import type { CardProps } from "@heroui/react";
-import type { SocialLayout } from "./provider-buttons";
+import { AuthView } from '@better-auth-ui/core';
+import { CardProps } from '@heroui/react';
+import { SocialLayout } from './provider-buttons';
 export type AuthProps = {
     className?: string;
     path?: string;

package/dist/components/auth/auth.js

@@ -1,42 +1,37 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useAuth } from "@better-auth-ui/react";
-import { ForgotPassword } from "./forgot-password";
-import { MagicLink } from "./magic-link";
-import { ResetPassword } from "./reset-password";
-import { SignIn } from "./sign-in";
-import { SignOut } from "./sign-out";
-import { SignUp } from "./sign-up";
-/**
- * Render the appropriate authentication view based on the provided `view` or `path`.
- *
- * @param path - Route path used to resolve an auth view when `view` is not provided
- * @param socialLayout - Social layout to apply to sign-in/sign-up/magic-link views
- * @param socialPosition - Position for social buttons ("top" or "bottom")
- * @param variant - Variant to apply to the card
- * @param view - Explicit auth view to render (e.g., "signIn", "signUp")
- * @returns The React element for the resolved authentication view
- */
-export function Auth({ path, socialLayout, socialPosition, view, ...props }) {
-    const { viewPaths } = useAuth();
-    if (!view && !path) {
-        throw new Error("[Better Auth UI] Either `view` or `path` must be provided");
-    }
-    const authPathViews = Object.fromEntries(Object.entries(viewPaths.auth).map(([k, v]) => [v, k]));
-    const currentView = view || (path ? authPathViews[path] : undefined);
-    switch (currentView) {
-        case "signIn":
-            return (_jsx(SignIn, { socialLayout: socialLayout, socialPosition: socialPosition, ...props }));
-        case "signUp":
-            return (_jsx(SignUp, { socialLayout: socialLayout, socialPosition: socialPosition, ...props }));
-        case "magicLink":
-            return (_jsx(MagicLink, { socialLayout: socialLayout, socialPosition: socialPosition, ...props }));
-        case "forgotPassword":
-            return _jsx(ForgotPassword, { ...props });
-        case "resetPassword":
-            return _jsx(ResetPassword, { ...props });
-        case "signOut":
-            return _jsx(SignOut, { ...props });
-        default:
-            throw new Error(`[Better Auth UI] Valid views are: ${Object.keys(viewPaths.auth).join(", ")}`);
-    }
+import { ForgotPassword as e } from "./forgot-password.js";
+import { MagicLink as t } from "./magic-link.js";
+import { ResetPassword as n } from "./reset-password.js";
+import { SignIn as r } from "./sign-in.js";
+import { SignOut as i } from "./sign-out.js";
+import { SignUp as a } from "./sign-up.js";
+import { useAuth as o } from "@better-auth-ui/react";
+import { jsx as s } from "react/jsx-runtime";
+//#region src/components/auth/auth.tsx
+function c({ path: c, socialLayout: l, socialPosition: u, view: d, ...f }) {
+	let { viewPaths: p } = o();
+	if (!d && !c) throw Error("[Better Auth UI] Either `view` or `path` must be provided");
+	let m = Object.fromEntries(Object.entries(p.auth).map(([e, t]) => [t, e]));
+	switch (d || (c ? m[c] : void 0)) {
+		case "signIn": return /* @__PURE__ */ s(r, {
+			socialLayout: l,
+			socialPosition: u,
+			...f
+		});
+		case "signUp": return /* @__PURE__ */ s(a, {
+			socialLayout: l,
+			socialPosition: u,
+			...f
+		});
+		case "magicLink": return /* @__PURE__ */ s(t, {
+			socialLayout: l,
+			socialPosition: u,
+			...f
+		});
+		case "forgotPassword": return /* @__PURE__ */ s(e, { ...f });
+		case "resetPassword": return /* @__PURE__ */ s(n, { ...f });
+		case "signOut": return /* @__PURE__ */ s(i, { ...f });
+		default: throw Error(`[Better Auth UI] Valid views are: ${Object.keys(p.auth).join(", ")}`);
+	}
 }
+//#endregion
+export { c as Auth };

package/dist/components/auth/field-separator.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from "react";
+import { ReactNode } from 'react';
 export declare function FieldSeparator({ children }: {
     children: ReactNode;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/auth/field-separator.js

@@ -1,5 +1,18 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Separator } from "@heroui/react";
-export function FieldSeparator({ children }) {
-    return (_jsxs("div", { className: "flex items-center gap-4", children: [_jsx(Separator, { className: "flex-1" }), _jsx("p", { className: "text-xs text-muted shrink-0", children: children }), _jsx(Separator, { className: "flex-1" })] }));
+import { Separator as e } from "@heroui/react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/auth/field-separator.tsx
+function r({ children: r }) {
+	return /* @__PURE__ */ n("div", {
+		className: "flex items-center gap-4",
+		children: [
+			/* @__PURE__ */ t(e, { className: "flex-1" }),
+			/* @__PURE__ */ t("p", {
+				className: "text-xs text-muted shrink-0",
+				children: r
+			}),
+			/* @__PURE__ */ t(e, { className: "flex-1" })
+		]
+	});
 }
+//#endregion
+export { r as FieldSeparator };

package/dist/components/auth/forgot-password.d.ts

@@ -1,4 +1,4 @@
-import { type CardProps } from "@heroui/react";
+import { CardProps } from '@heroui/react';
 export type ForgotPasswordProps = {
     className?: string;
     variant?: CardProps["variant"];

package/dist/components/auth/forgot-password.js

@@ -1,28 +1,70 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useRequestPasswordReset } from "@better-auth-ui/react";
-import { Button, Card, cn, Description, FieldError, Form, Input, Label, Link, Spinner, TextField, toast } from "@heroui/react";
-/**
- * Render a card-based "Forgot Password" form that sends a password-reset email.
- *
- * The form displays an email input, submit button, and a link back to sign-in.
- * Toasts are displayed on success or error via the `useForgotPassword` hook.
- *
- * @param className - Optional additional CSS class names applied to the card
- * @returns The forgot-password form UI as a JSX element
- */
-export function ForgotPassword({ className, variant, ...props }) {
-    const { basePaths, localization, viewPaths, navigate } = useAuth();
-    const { mutate: requestPasswordReset, isPending } = useRequestPasswordReset({
-        onError: (error) => toast.danger(error.error?.message || error.message),
-        onSuccess: () => {
-            toast.success(localization.auth.passwordResetEmailSent);
-            navigate({ to: `${basePaths.auth}/${viewPaths.auth.signIn}` });
-        }
-    });
-    function handleSubmit(e) {
-        e.preventDefault();
-        const formData = new FormData(e.currentTarget);
-        requestPasswordReset({ email: formData.get("email") });
-    }
-    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.forgotPassword }) }), _jsx(Card.Content, { children: _jsxs(Form, { onSubmit: handleSubmit, className: "flex flex-col gap-4", children: [_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(Button, { type: "submit", className: "w-full", isPending: isPending, children: [isPending && _jsx(Spinner, { color: "current", size: "sm" }), localization.auth.sendResetLink] })] }) }), _jsx(Card.Footer, { className: "flex-col", children: _jsxs(Description, { className: "text-sm", children: [localization.auth.rememberYourPassword, " ", _jsx(Link, { href: `${basePaths.auth}/${viewPaths.auth.signIn}`, className: "text-accent decoration-accent no-underline hover:underline", children: localization.auth.signIn })] }) })] }));
+import { useAuth as e, useRequestPasswordReset as t } from "@better-auth-ui/react";
+import { Button as n, Card as r, Description as i, FieldError as a, Form as o, Input as s, Label as c, Link as l, Spinner as u, TextField as d, cn as f, toast as p } from "@heroui/react";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+//#region src/components/auth/forgot-password.tsx
+function g({ className: g, variant: _, ...v }) {
+	let { basePaths: y, localization: b, viewPaths: x, navigate: S } = e(), { mutate: C, isPending: w } = t({
+		onError: (e) => p.danger(e.error?.message || e.message),
+		onSuccess: () => {
+			p.success(b.auth.passwordResetEmailSent), S({ to: `${y.auth}/${x.auth.signIn}` });
+		}
+	});
+	function T(e) {
+		e.preventDefault(), C({ email: new FormData(e.currentTarget).get("email") });
+	}
+	return /* @__PURE__ */ h(r, {
+		className: f("w-full max-w-sm p-4 md:p-6", g),
+		variant: _,
+		...v,
+		children: [
+			/* @__PURE__ */ m(r.Header, { children: /* @__PURE__ */ m(r.Title, {
+				className: "text-xl font-semibold mb-1",
+				children: b.auth.forgotPassword
+			}) }),
+			/* @__PURE__ */ m(r.Content, { children: /* @__PURE__ */ h(o, {
+				onSubmit: T,
+				className: "flex flex-col gap-4",
+				children: [/* @__PURE__ */ h(d, {
+					name: "email",
+					type: "email",
+					autoComplete: "email",
+					isDisabled: w,
+					children: [
+						/* @__PURE__ */ m(c, { children: b.auth.email }),
+						/* @__PURE__ */ m(s, {
+							placeholder: b.auth.emailPlaceholder,
+							required: !0,
+							variant: _ === "transparent" ? "primary" : "secondary"
+						}),
+						/* @__PURE__ */ m(a, {})
+					]
+				}), /* @__PURE__ */ h(n, {
+					type: "submit",
+					className: "w-full",
+					isPending: w,
+					children: [w && /* @__PURE__ */ m(u, {
+						color: "current",
+						size: "sm"
+					}), b.auth.sendResetLink]
+				})]
+			}) }),
+			/* @__PURE__ */ m(r.Footer, {
+				className: "flex-col",
+				children: /* @__PURE__ */ h(i, {
+					className: "text-sm",
+					children: [
+						b.auth.rememberYourPassword,
+						" ",
+						/* @__PURE__ */ m(l, {
+							href: `${y.auth}/${x.auth.signIn}`,
+							className: "text-accent decoration-accent no-underline hover:underline",
+							children: b.auth.signIn
+						})
+					]
+				})
+			})
+		]
+	});
 }
+//#endregion
+export { g as ForgotPassword };

package/dist/components/auth/magic-link-button.d.ts

@@ -1,4 +1,4 @@
-import type { AuthView } from "@better-auth-ui/core";
+import { AuthView } from '@better-auth-ui/core';
 export type MagicLinkButtonProps = {
     isPending: boolean;
     view?: AuthView;

package/dist/components/auth/magic-link-button.js

@@ -1,19 +1,16 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth } from "@better-auth-ui/react";
-import { Envelope, Lock } from "@gravity-ui/icons";
-import { cn, Link } from "@heroui/react";
-import { buttonVariants } from "@heroui/styles";
-/**
- * Renders a full-width tertiary link-style button that navigates to either the magic-link or sign-in route.
- *
- * @param isPending - If true, applies disabled styling and prevents interaction
- * @param view - Current auth view; when `"magicLink"`, the button targets the sign-in/password variant
- * @returns The rendered Link element with the appropriate href, icon, and label
- */
-export function MagicLinkButton({ isPending, view }) {
-    const { basePaths, viewPaths, localization } = useAuth();
-    const isMagicLinkView = view === "magicLink";
-    return (_jsxs(Link, { href: `${basePaths.auth}/${isMagicLinkView ? viewPaths.auth.signIn : viewPaths.auth.magicLink}`, className: cn(buttonVariants({ variant: "tertiary" }), "w-full gap-2", isPending && "status-disabled pointer-events-none"), children: [isMagicLinkView ? _jsx(Lock, {}) : _jsx(Envelope, {}), localization.auth.continueWith.replace("{{provider}}", isMagicLinkView
-                ? localization.auth.password
-                : localization.auth.magicLink)] }));
+import { useAuth as e } from "@better-auth-ui/react";
+import { Link as t, cn as n } from "@heroui/react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { Envelope as a, Lock as o } from "@gravity-ui/icons";
+import { buttonVariants as s } from "@heroui/styles";
+//#region src/components/auth/magic-link-button.tsx
+function c({ isPending: c, view: l }) {
+	let { basePaths: u, viewPaths: d, localization: f } = e(), p = l === "magicLink";
+	return /* @__PURE__ */ i(t, {
+		href: `${u.auth}/${p ? d.auth.signIn : d.auth.magicLink}`,
+		className: n(s({ variant: "tertiary" }), "w-full gap-2", c && "status-disabled pointer-events-none"),
+		children: [r(p ? o : a, {}), f.auth.continueWith.replace("{{provider}}", p ? f.auth.password : f.auth.magicLink)]
+	});
 }
+//#endregion
+export { c as MagicLinkButton };

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

@@ -1,5 +1,5 @@
-import { type CardProps } from "@heroui/react";
-import { type SocialLayout } from "./provider-buttons";
+import { CardProps } from '@heroui/react';
+import { SocialLayout } from './provider-buttons';
 export type MagicLinkProps = {
     className?: string;
     socialLayout?: SocialLayout;

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

@@ -1,43 +1,111 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useSignInMagicLink, useSignInSocial } from "@better-auth-ui/react";
-import { Button, Card, cn, Description, FieldError, Form, Input, 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 card-based sign-in form that sends an email magic link and optionally shows social provider buttons.
- *
- * @param className - Additional CSS class names applied to the card container
- * @param socialLayout - Layout style for social provider buttons
- * @param socialPosition - Position of social provider buttons; `"top"` or `"bottom"`. Defaults to `"bottom"`.
- * @returns The magic-link sign-in UI as a JSX element
- */
-export function MagicLink({ className, socialLayout, socialPosition = "bottom", variant, ...props }) {
-    const { basePaths, baseURL, localization, redirectTo, socialProviders, viewPaths } = useAuth();
-    const [email, setEmail] = useState("");
-    const { mutate: signInMagicLink, isPending: magicLinkPending } = useSignInMagicLink({
-        onError: (error) => toast.danger(error.error?.message || error.message),
-        onSuccess: () => {
-            setEmail("");
-            toast.success(localization.auth.magicLinkSent);
-        }
-    });
-    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 isPending = magicLinkPending || socialPending || socialRedirecting;
-    const handleSubmit = (e) => {
-        e.preventDefault();
-        signInMagicLink({ email, callbackURL: `${baseURL}${redirectTo}` });
-    };
-    const showSeparator = !!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.signIn }) }), _jsxs(Card.Content, { className: "gap-4", children: [socialPosition === "top" && (_jsxs(_Fragment, { children: [!!socialProviders?.length && (_jsx(ProviderButtons, { socialLayout: socialLayout, signInSocial: signInSocial, isPending: isPending })), showSeparator && (_jsx(FieldSeparator, { children: localization.auth.or }))] })), _jsxs(Form, { onSubmit: handleSubmit, className: "flex flex-col gap-4", children: [_jsxs(TextField, { name: "email", type: "email", autoComplete: "email", isDisabled: isPending, value: email, onChange: setEmail, children: [_jsx(Label, { children: localization.auth.email }), _jsx(Input, { placeholder: localization.auth.emailPlaceholder, required: true, variant: variant === "transparent" ? "primary" : "secondary" }), _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.sendMagicLink] }), _jsx(MagicLinkButton, { view: "magicLink", 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.needToCreateAnAccount, " ", _jsx(Link, { href: `${basePaths.auth}/${viewPaths.auth.signUp}`, className: "text-accent decoration-accent no-underline hover:underline", children: localization.auth.signUp })] }) })] }));
+import { FieldSeparator as e } from "./field-separator.js";
+import { MagicLinkButton as t } from "./magic-link-button.js";
+import { PasskeyButton as n } from "./passkey-button.js";
+import { ProviderButtons as r } from "./provider-buttons.js";
+import { useAuth as i, useSignInMagicLink as a, useSignInSocial as o } from "@better-auth-ui/react";
+import { Button as s, Card as c, Description as l, FieldError as u, Form as d, Input as f, Label as p, Link as m, Spinner as h, TextField as g, cn as _, toast as v } from "@heroui/react";
+import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
+import { useState as S } from "react";
+//#region src/components/auth/magic-link.tsx
+function C({ className: C, socialLayout: w, socialPosition: T = "bottom", variant: E, ...D }) {
+	let { basePaths: O, baseURL: k, localization: A, passkey: j, redirectTo: M, socialProviders: N, viewPaths: P } = i(), [F, I] = S(""), { mutate: L, isPending: R } = a({
+		onError: (e) => v.danger(e.error?.message || e.message),
+		onSuccess: () => {
+			I(""), v.success(A.auth.magicLinkSent);
+		}
+	}), [z, B] = S(!1), { mutate: V, isPending: H } = o({
+		onError: (e) => v.danger(e.error?.message || e.message),
+		onSuccess: () => {
+			B(!0), setTimeout(() => {
+				B(!1);
+			}, 5e3);
+		}
+	}), U = R || H || z, W = (e) => {
+		e.preventDefault(), L({
+			email: F,
+			callbackURL: `${k}${M}`
+		});
+	}, G = !!N?.length;
+	return /* @__PURE__ */ x(c, {
+		className: _("w-full max-w-sm p-4 md:p-6", C),
+		variant: E,
+		...D,
+		children: [
+			/* @__PURE__ */ b(c.Header, { children: /* @__PURE__ */ b(c.Title, {
+				className: "text-xl font-semibold mb-1",
+				children: A.auth.signIn
+			}) }),
+			/* @__PURE__ */ x(c.Content, {
+				className: "gap-4",
+				children: [
+					T === "top" && /* @__PURE__ */ x(y, { children: [!!N?.length && /* @__PURE__ */ b(r, {
+						socialLayout: w,
+						signInSocial: V,
+						isPending: U
+					}), G && /* @__PURE__ */ b(e, { children: A.auth.or })] }),
+					/* @__PURE__ */ x(d, {
+						onSubmit: W,
+						className: "flex flex-col gap-4",
+						children: [/* @__PURE__ */ x(g, {
+							name: "email",
+							type: "email",
+							autoComplete: "email",
+							isDisabled: U,
+							value: F,
+							onChange: I,
+							children: [
+								/* @__PURE__ */ b(p, { children: A.auth.email }),
+								/* @__PURE__ */ b(f, {
+									placeholder: A.auth.emailPlaceholder,
+									required: !0,
+									variant: E === "transparent" ? "primary" : "secondary"
+								}),
+								/* @__PURE__ */ b(u, {})
+							]
+						}), /* @__PURE__ */ x("div", {
+							className: "flex flex-col gap-3",
+							children: [
+								/* @__PURE__ */ x(s, {
+									type: "submit",
+									className: "w-full",
+									isPending: U,
+									children: [U && /* @__PURE__ */ b(h, {
+										color: "current",
+										size: "sm"
+									}), A.auth.sendMagicLink]
+								}),
+								/* @__PURE__ */ b(t, {
+									view: "magicLink",
+									isPending: U
+								}),
+								j && /* @__PURE__ */ b(n, { isPending: U })
+							]
+						})]
+					}),
+					T === "bottom" && /* @__PURE__ */ x(y, { children: [G && /* @__PURE__ */ b(e, { children: A.auth.or }), !!N?.length && /* @__PURE__ */ b(r, {
+						socialLayout: w,
+						signInSocial: V,
+						isPending: U
+					})] })
+				]
+			}),
+			/* @__PURE__ */ b(c.Footer, {
+				className: "flex-col",
+				children: /* @__PURE__ */ x(l, {
+					className: "text-sm",
+					children: [
+						A.auth.needToCreateAnAccount,
+						" ",
+						/* @__PURE__ */ b(m, {
+							href: `${O.auth}/${P.auth.signUp}`,
+							className: "text-accent decoration-accent no-underline hover:underline",
+							children: A.auth.signUp
+						})
+					]
+				})
+			})
+		]
+	});
 }
+//#endregion
+export { C as MagicLink };

package/dist/components/auth/passkey-button.d.ts

@@ -0,0 +1,4 @@
+export type PasskeyButtonProps = {
+    isPending: boolean;
+};
+export declare function PasskeyButton({ isPending }: PasskeyButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/auth/passkey-button.js

@@ -0,0 +1,24 @@
+import { useAuth as e, useSignInPasskey as t } from "@better-auth-ui/react";
+import { Button as n, Spinner as r, toast as i } from "@heroui/react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Fingerprint as s } from "@gravity-ui/icons";
+//#region src/components/auth/passkey-button.tsx
+function c({ isPending: c }) {
+	let { localization: l, redirectTo: u, navigate: d } = e(), { mutate: f, isPending: p } = t({
+		onError: (e) => i.danger(e.error?.message || e.message),
+		onSuccess: () => d({ to: u })
+	});
+	return /* @__PURE__ */ o(n, {
+		className: "w-full",
+		variant: "tertiary",
+		isDisabled: c || p,
+		isPending: p,
+		onPress: () => f(),
+		children: [p ? /* @__PURE__ */ a(r, {
+			color: "current",
+			size: "sm"
+		}) : /* @__PURE__ */ a(s, {}), l.auth.continueWith.replace("{{provider}}", l.auth.passkey)]
+	});
+}
+//#endregion
+export { c as PasskeyButton };

package/dist/components/auth/provider-buttons.d.ts

@@ -1,4 +1,4 @@
-import type { SocialProvider } from "better-auth/social-providers";
+import { SocialProvider } from 'better-auth/social-providers';
 export type ProviderButtonsProps = {
     isPending: boolean;
     socialLayout?: SocialLayout;

package/dist/components/auth/provider-buttons.js

@@ -1,34 +1,27 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { getProviderName } from "@better-auth-ui/core";
-import { providerIcons, useAuth } from "@better-auth-ui/react";
-import { Button, cn } from "@heroui/react";
-import { useMemo } from "react";
-/**
- * Render social provider sign-in buttons and handle initiation and pending state.
- *
- * @param isPending - Disables all provider buttons when true.
- * @param socialLayout - Preferred layout for the buttons; `"auto"` picks `"horizontal"` when there are four or more providers, otherwise `"vertical"`.
- * @param signInSocial - Callback invoked with the provider and callbackURL when a button is clicked.
- * @returns The JSX element that renders the configured social provider buttons.
- */
-export function ProviderButtons({ isPending, socialLayout = "auto", signInSocial }) {
-    const { baseURL, localization, redirectTo, socialProviders } = useAuth();
-    const callbackURL = `${baseURL}${redirectTo}`;
-    const resolvedSocialLayout = useMemo(() => {
-        if (socialLayout === "auto") {
-            if (socialProviders?.length && socialProviders.length >= 4) {
-                return "horizontal";
-            }
-            return "vertical";
-        }
-        return socialLayout;
-    }, [socialLayout, socialProviders?.length]);
-    return (_jsx("div", { className: cn("gap-3", resolvedSocialLayout === "grid" && "grid grid-cols-2", resolvedSocialLayout === "vertical" && "flex flex-col", resolvedSocialLayout === "horizontal" && "flex flex-wrap"), children: socialProviders?.map((provider) => {
-            const ProviderIcon = providerIcons[provider];
-            return (_jsxs(Button, { className: cn("w-full", resolvedSocialLayout === "horizontal" && "flex-1"), variant: "tertiary", isPending: isPending, onPress: () => signInSocial({ provider, callbackURL }), children: [_jsx(ProviderIcon, {}), resolvedSocialLayout === "vertical"
-                        ? localization.auth.continueWith.replace("{{provider}}", getProviderName(provider))
-                        : resolvedSocialLayout === "grid"
-                            ? getProviderName(provider)
-                            : null] }, provider));
-        }) }));
+import { providerIcons as e, useAuth as t } from "@better-auth-ui/react";
+import { Button as n, cn as r } from "@heroui/react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { useMemo as o } from "react";
+import { getProviderName as s } from "@better-auth-ui/core";
+//#region src/components/auth/provider-buttons.tsx
+function c({ isPending: c, socialLayout: l = "auto", signInSocial: u }) {
+	let { baseURL: d, localization: f, redirectTo: p, socialProviders: m } = t(), h = `${d}${p}`, g = o(() => l === "auto" ? m?.length && m.length >= 4 ? "horizontal" : "vertical" : l, [l, m?.length]);
+	return /* @__PURE__ */ i("div", {
+		className: r("gap-3", g === "grid" && "grid grid-cols-2", g === "vertical" && "flex flex-col", g === "horizontal" && "flex flex-wrap"),
+		children: m?.map((t) => {
+			let o = e[t];
+			return /* @__PURE__ */ a(n, {
+				className: r("w-full", g === "horizontal" && "flex-1"),
+				variant: "tertiary",
+				isPending: c,
+				onPress: () => u({
+					provider: t,
+					callbackURL: h
+				}),
+				children: [/* @__PURE__ */ i(o, {}), g === "vertical" ? f.auth.continueWith.replace("{{provider}}", s(t)) : g === "grid" ? s(t) : null]
+			}, t);
+		})
+	});
 }
+//#endregion
+export { c as ProviderButtons };

package/dist/components/auth/reset-password.d.ts

@@ -1,4 +1,4 @@
-import { type CardProps } from "@heroui/react";
+import { CardProps } from '@heroui/react';
 export type ResetPasswordProps = {
     className?: string;
     variant?: CardProps["variant"];