@better-auth-ui/heroui 1.6.9 → 1.6.10

package/dist/components/auth/theme/appearance.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ThemePreviewDark, ThemePreviewLight, ThemePreviewSystem, useAuthPlugin } from "@better-auth-ui/react";
-import { Display, Moon, Sun } from "@gravity-ui/icons";
-import { Card, cn, Label, Radio, RadioGroup, useIsHydrated } from "@heroui/react";
-import { themePlugin } from "../../../lib/auth/theme-plugin";
-/**
- * Renders a theme selector card with visual theme previews.
- *
- * Displays a card containing radio buttons for selecting between system, light,
- * and dark themes. Each option shows a visual preview of the theme. Theme options
- * are conditionally shown based on the `themes` array provided via the theme plugin.
- */
-export function Appearance({ className, variant, ...props }) {
-    const { useTheme, localization } = useAuthPlugin(themePlugin);
-    const { theme, setTheme, themes = [] } = useTheme();
-    const hydrated = useIsHydrated();
-    return (_jsxs("div", { children: [_jsx("h2", { className: cn("text-sm font-semibold mb-3"), children: localization.appearance }), _jsx(Card, { className: cn("p-4 gap-4", className), variant: variant, ...props, children: _jsxs(Card.Content, { children: [_jsx(Label, { children: localization.theme }), _jsx(RadioGroup, { variant: variant === "transparent" ? "secondary" : "primary", value: hydrated ? theme : "", onChange: setTheme, isDisabled: !hydrated || !theme, children: _jsxs("div", { className: "grid gap-3 grid-cols-2 sm:grid-cols-3", children: [themes.includes("system") && (_jsx(Radio, { value: "system", className: cn("mt-0 px-4 pb-4 pt-3 rounded-xl", "border border-transparent data-[selected=true]:border-accent data-[selected=true]:bg-accent/10", "data-[focus-visible=true]:border-accent data-[focus-visible=true]:bg-accent/10", variant === "transparent"
-                                            ? "bg-surface"
-                                            : "bg-surface-secondary"), children: _jsxs(Radio.Content, { className: "gap-2", children: [_jsxs("div", { className: "flex gap-2 justify-between", children: [_jsxs(Label, { className: "flex gap-2 items-center", children: [_jsx(Display, { className: "text-muted" }), localization.system] }), _jsx(Radio.Control, { children: _jsx(Radio.Indicator, {}) })] }), _jsx(ThemePreviewSystem, { className: "w-full" })] }) })), themes.includes("light") && (_jsx(Radio, { value: "light", className: cn("mt-0 px-4 pb-4 pt-3 rounded-xl", "border border-transparent data-[selected=true]:border-accent data-[selected=true]:bg-accent/10", "data-[focus-visible=true]:border-accent data-[focus-visible=true]:bg-accent/10", variant === "transparent"
-                                            ? "bg-surface"
-                                            : "bg-surface-secondary"), children: _jsxs(Radio.Content, { className: "gap-2", children: [_jsxs("div", { className: "flex gap-2 justify-between", children: [_jsxs(Label, { className: "flex gap-2 items-center", children: [_jsx(Sun, { className: "text-muted" }), localization.light] }), _jsx(Radio.Control, { children: _jsx(Radio.Indicator, {}) })] }), _jsx(ThemePreviewLight, { className: "w-full" })] }) })), themes.includes("dark") && (_jsx(Radio, { value: "dark", className: cn("mt-0 px-4 pb-4 pt-3 rounded-xl", "border border-transparent data-[selected=true]:border-accent data-[selected=true]:bg-accent/10", "data-[focus-visible=true]:border-accent data-[focus-visible=true]:bg-accent/10", variant === "transparent"
-                                            ? "bg-surface"
-                                            : "bg-surface-secondary"), children: _jsxs(Radio.Content, { className: "gap-2", children: [_jsxs("div", { className: "flex gap-2 justify-between", children: [_jsxs(Label, { className: "flex gap-2 items-center", children: [_jsx(Moon, { className: "text-muted" }), localization.dark] }), _jsx(Radio.Control, { children: _jsx(Radio.Indicator, {}) })] }), _jsx(ThemePreviewDark, { className: "w-full" })] }) }))] }) })] }) })] }));
-}

package/dist/components/auth/theme/theme-toggle-item.js

@@ -1,57 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuthPlugin } from "@better-auth-ui/react";
-import { Display, Moon, Palette, Sun } from "@gravity-ui/icons";
-import { Dropdown, Label, Tabs } from "@heroui/react";
-import { themePlugin } from "../../../lib/auth/theme-plugin";
-const ACTIVE_TAB_SELECTOR = '[role="tab"][aria-selected="true"]';
-/**
- * Theme toggle dropdown item used inside `UserButton`. Callers are responsible
- * for ensuring theming is configured before rendering this component.
- */
-export function ThemeToggleItem() {
-    const { useTheme, localization } = useAuthPlugin(themePlugin);
-    const { theme, setTheme, themes = [] } = useTheme();
-    // The Tabs aren't part of the menu's keyboard-navigation list, so arrow-key
-    // nav can't reach them on its own. When the wrapper menu item receives focus
-    // we delegate focus to the active Tab so the user can switch themes with the
-    // Left/Right arrows. React's synthetic `onFocus` bubbles (it's wired to
-    // `focusin`), so we must guard against child-originated events: without the
-    // `target === currentTarget` check, an arrow-key focus move between tabs
-    // bubbles up here and the still-stale `aria-selected="true"` lookup yanks
-    // focus back to the previously selected tab.
-    const focusActiveTab = (event) => {
-        if (event.target !== event.currentTarget)
-            return;
-        const activeTab = event.currentTarget.querySelector(ACTIVE_TAB_SELECTOR);
-        activeTab?.focus({ preventScroll: true });
-    };
-    // Up/Down on a Tab escapes back to the previous/next sibling menu item so
-    // users can keep navigating the menu with the arrow keys after they've
-    // entered the Tabs.
-    const handleTabsKeyDown = (event) => {
-        if (event.key !== "ArrowUp" && event.key !== "ArrowDown")
-            return;
-        const target = event.target;
-        if (target.getAttribute("role") !== "tab")
-            return;
-        const wrapper = target.closest('[role="menuitem"]');
-        const menu = wrapper?.closest('[role="menu"]');
-        if (!wrapper || !menu)
-            return;
-        const items = Array.from(menu.querySelectorAll('[role="menuitem"]:not([data-disabled])'));
-        const currentIndex = items.indexOf(wrapper);
-        if (currentIndex === -1)
-            return;
-        const nextIndex = event.key === "ArrowDown" ? currentIndex + 1 : currentIndex - 1;
-        const next = items[nextIndex];
-        if (!next)
-            return;
-        event.preventDefault();
-        next.focus();
-    };
-    return (_jsxs(Dropdown.Item, { className: "py-1 pe-2", onFocus: focusActiveTab, 
-        // Without `shouldCloseOnSelect={false}` the menu auto-closes after the
-        // user changes themes, because clicking on a Tab bubbles up as a
-        // menu-item activation.
-        shouldCloseOnSelect: false, children: [_jsx(Palette, { className: "text-muted" }), _jsx(Label, { children: localization.theme }), _jsx(Tabs, { className: "ml-auto", selectedKey: theme, onSelectionChange: (key) => setTheme(key), children: _jsx(Tabs.ListContainer, { onKeyDown: handleTabsKeyDown, children: _jsxs(Tabs.List, { "aria-label": localization.theme, className: "*:h-5 *:w-5 *:p-0", children: [themes.includes("system") && (_jsxs(Tabs.Tab, { id: "system", "aria-label": localization.system, children: [_jsx(Display, { className: "size-3" }), _jsx(Tabs.Indicator, {})] })), themes.includes("light") && (_jsxs(Tabs.Tab, { id: "light", "aria-label": localization.light, children: [_jsx(Sun, { className: "size-3" }), _jsx(Tabs.Indicator, {})] })), themes.includes("dark") && (_jsxs(Tabs.Tab, { id: "dark", "aria-label": localization.dark, children: [_jsx(Moon, { className: "size-3" }), _jsx(Tabs.Indicator, {})] }))] }) }) })] }));
-}

package/dist/components/auth/user/user-avatar.js

@@ -1,32 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useSession } from "@better-auth-ui/react";
-import { Person } from "@gravity-ui/icons";
-import { Avatar, cn, Skeleton } from "@heroui/react";
-/**
- * Render a user avatar that shows the user's image, initials, or a custom fallback; displays a circular skeleton while the session (or explicit pending flag) is pending.
- *
- * @param className - Additional CSS classes applied to the outer avatar container
- * @param fallback - Custom fallback content to render when no image or initials are available
- * @param isPending - When true, force rendering of the loading skeleton (unless an explicit `user` prop is provided)
- * @param user - Optional user object to display; when omitted the current session user is used if available
- * @param size - Visual size of the avatar; one of `"sm"`, `"md"`, or `"lg"` (default: `"sm"`)
- * @returns A React element that displays the user's avatar image, initials, or the provided fallback; renders a circular skeleton while loading
- */
-export function UserAvatar({ className, fallback, isPending, user, size = "sm", style, ...props }) {
-    const { authClient } = useAuth();
-    const { data: session, isPending: sessionPending } = useSession(authClient, {
-        enabled: !user && !isPending
-    });
-    if ((isPending || sessionPending) && !user) {
-        return (_jsx(Skeleton, { className: cn("rounded-full", size === "sm" ? "size-8" : size === "md" ? "size-10" : "size-12", className), style: style }));
-    }
-    const resolvedUser = user ?? session?.user;
-    const initials = (resolvedUser?.username ||
-        resolvedUser?.name ||
-        resolvedUser?.email)
-        ?.slice(0, 2)
-        .toUpperCase();
-    return (_jsxs(Avatar, { size: size, className: cn("rounded-full", className), style: style, ...props, children: [_jsx(Avatar.Image, { alt: resolvedUser?.displayUsername ||
-                    resolvedUser?.name ||
-                    resolvedUser?.email, src: resolvedUser?.image ?? undefined }), _jsx(Avatar.Fallback, { className: cn(size === "lg" ? "text-xl" : size === "md" ? "text-base" : "text-sm"), delayMs: resolvedUser?.image ? 600 : undefined, children: fallback || initials || _jsx(Person, { className: "size-4" }) })] }));
-}

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

@@ -1,40 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useAuth, useSession } from "@better-auth-ui/react";
-import { ArrowRightFromSquare, ArrowRightToSquare, ChevronsExpandVertical, Gear, PersonPlus } from "@gravity-ui/icons";
-import { Button, cn, Dropdown, Label } from "@heroui/react";
-import { isValidElement } from "react";
-import { UserAvatar } from "./user-avatar";
-import { UserView } from "./user-view";
-function renderUserLink(link, fallbackKey) {
-    if (isValidElement(link))
-        return link;
-    const { label, href, icon, variant } = link;
-    return (_jsxs(Dropdown.Item, { href: href, variant: variant, textValue: typeof label === "string" ? label : undefined, children: [icon, _jsx(Label, { children: label })] }, fallbackKey));
-}
-/**
- * Render a user account dropdown button that shows account actions.
- *
- * @param className - Additional CSS classes applied to the trigger element
- * @param placement - Dropdown popover placement (e.g., "bottom", "top-start", "bottom-end")
- * @param size - "icon" renders an avatar-only trigger; "default" renders a button with label and chevron
- * @param variant - Button visual variant passed to the underlying Button component
- * @param links - Additional menu entries rendered above the built-in items
- * @param hideSettings - Hide the built-in "Settings" link
- * @returns The user button and its dropdown menu as a JSX element
- */
-export function UserButton({ className, placement, size = "default", variant = "ghost", links, hideSettings, hideSubtitle }) {
-    const { authClient, basePaths, viewPaths, localization, plugins } = useAuth();
-    const { data: session, isPending: sessionPending } = useSession(authClient);
-    const userMenuItems = plugins.flatMap((plugin) => plugin.userMenuItems?.map((Item, index) => (_jsx(Item, { hideSubtitle: hideSubtitle }, `${plugin.id}-${index.toString()}`))) ?? []);
-    const userLinks = links?.flatMap((link, index) => {
-        if (!isValidElement(link)) {
-            const visibility = link.visibility ?? "always";
-            if (visibility === "authenticated" && !session)
-                return [];
-            if (visibility === "unauthenticated" && session)
-                return [];
-        }
-        return [renderUserLink(link, `user-button-link-${index.toString()}`)];
-    });
-    return (_jsxs(Dropdown, { children: [size === "icon" ? (_jsx(Dropdown.Trigger, { className: cn("rounded-full", className), children: _jsx(UserAvatar, {}) })) : (_jsxs(Button, { variant: variant, className: cn("h-auto font-normal justify-start px-2 py-2 text-left", className), children: [session || sessionPending ? (_jsx(UserView, { isPending: sessionPending, hideSubtitle: hideSubtitle })) : (_jsxs(_Fragment, { children: [_jsx(UserAvatar, {}), _jsx("p", { className: "text-sm font-medium", children: localization.auth.account })] })), _jsx(ChevronsExpandVertical, { className: "ml-auto size-3 text-muted" })] })), _jsxs(Dropdown.Popover, { placement: placement, className: "min-w-40 md:min-w-56 max-w-[48svw]", children: [session && (_jsx("div", { className: "px-3 pt-3 pb-1", children: _jsx(UserView, { hideSubtitle: hideSubtitle }) })), _jsx(Dropdown.Menu, { children: session ? (_jsxs(_Fragment, { children: [userLinks, !hideSettings && (_jsxs(Dropdown.Item, { textValue: localization.settings.settings, href: `${basePaths.settings}/${viewPaths.settings.account}`, children: [_jsx(Gear, { className: "text-muted" }), _jsx(Label, { children: localization.settings.settings })] })), userMenuItems, _jsxs(Dropdown.Item, { textValue: localization.auth.signOut, href: `${basePaths.auth}/${viewPaths.auth.signOut}`, variant: "danger", children: [_jsx(ArrowRightFromSquare, { className: "text-danger" }), _jsx(Label, { children: localization.auth.signOut })] })] })) : (_jsxs(_Fragment, { children: [userLinks, _jsxs(Dropdown.Item, { textValue: localization.auth.signIn, href: `${basePaths.auth}/${viewPaths.auth.signIn}`, children: [_jsx(ArrowRightToSquare, { className: "text-muted" }), _jsx(Label, { children: localization.auth.signIn })] }), _jsxs(Dropdown.Item, { textValue: localization.auth.signUp, href: `${basePaths.auth}/${viewPaths.auth.signUp}`, children: [_jsx(PersonPlus, { className: "text-muted" }), _jsx(Label, { children: localization.auth.signUp })] }), userMenuItems] })) })] })] }));
-}

package/dist/components/auth/user/user-view.js

@@ -1,27 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useSession } from "@better-auth-ui/react";
-import { cn, Skeleton } from "@heroui/react";
-import { UserAvatar } from "./user-avatar";
-/**
- * Render a compact user item with an avatar, a primary label (display username, name, or email), and an optional subtitle (email).
- *
- * @param isPending - If true and no `user` prop is provided, renders a loading skeleton instead of user details
- * @param size - Avatar size variant; defaults to `"md"`
- * @param hideSubtitle - When true, omits the muted subtitle row under the primary label
- * @param user - Optional user to display; when omitted the current session user is used if available
- * @returns A React element containing the user's avatar and text labels
- */
-export function UserView({ className, isPending, size = "md", hideSubtitle = false, user, ...props }) {
-    const { authClient } = useAuth();
-    const { data: session, isPending: sessionPending } = useSession(authClient, {
-        enabled: !user && !isPending
-    });
-    const resolvedUser = user ?? session?.user;
-    if ((isPending || sessionPending) && !user) {
-        return (_jsxs("div", { className: cn("flex items-center gap-2 min-w-0", className), ...props, children: [_jsx(UserAvatar, { isPending: true, className: size === "sm" ? "size-5 [&>span]:text-xs" : undefined, size: size === "lg" ? "md" : "sm" }), _jsxs("div", { className: "flex flex-col gap-1 min-w-0", children: [_jsx(Skeleton, { className: "h-3.5 w-24 rounded-lg" }), !hideSubtitle ? _jsx(Skeleton, { className: "h-3 w-32 rounded-lg" }) : null] })] }));
-    }
-    return (_jsxs("div", { className: cn("flex items-center gap-2 min-w-0", className), ...props, children: [_jsx(UserAvatar, { className: size === "sm" ? "size-5 [&>span]:text-xs" : undefined, user: resolvedUser, size: size === "lg" ? "md" : "sm" }), _jsxs("div", { className: "flex flex-col min-w-0", children: [_jsx("p", { className: "text-foreground text-sm font-medium leading-tight truncate", children: resolvedUser?.displayUsername ||
-                            resolvedUser?.name ||
-                            resolvedUser?.email }), !hideSubtitle &&
-                        (resolvedUser?.displayUsername || resolvedUser?.name) ? (_jsx("p", { className: "text-muted text-xs leading-tight truncate overflow-x-hidden", children: resolvedUser?.email })) : null] })] }));
-}

package/dist/components/auth/username/sign-in-username.js

@@ -1,88 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { authMutationKeys } from "@better-auth-ui/core";
-import { useAuth, useAuthPlugin, useFetchOptions, useSendVerificationEmail, useSignInEmail, useSignInUsername } from "@better-auth-ui/react";
-import { Button, Card, Checkbox, cn, Description, FieldError, Form, Input, Label, Link, Spinner, TextField, toast } from "@heroui/react";
-import { useIsMutating } from "@tanstack/react-query";
-import { useState } from "react";
-import { usernamePlugin } from "../../../lib/auth/username-plugin";
-import { FieldSeparator } from "../field-separator";
-import { ProviderButtons } from "../provider-buttons";
-/**
- * Render the username-based sign-in UI.
- *
- * @returns The sign-in JSX element containing username/password fields, optional magic-link button, and social provider buttons.
- */
-export function SignInUsername({ className, socialLayout, socialPosition = "bottom", variant, ...props }) {
-    const { authClient, basePaths, baseURL, emailAndPassword, localization, plugins, redirectTo, socialProviders, viewPaths, navigate } = useAuth();
-    const { fetchOptions, resetFetchOptions } = useFetchOptions();
-    const { localization: usernameLocalization } = useAuthPlugin(usernamePlugin);
-    const [password, setPassword] = useState("");
-    const { mutate: sendVerificationEmail } = useSendVerificationEmail(authClient, {
-        onSuccess: () => toast.success(localization.auth.verificationEmailSent)
-    });
-    function isEmail(value) {
-        return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value);
-    }
-    const { mutate: signInEmail, isPending: isSignInEmailPending } = useSignInEmail(authClient, {
-        onError: (error, { email }) => {
-            setPassword("");
-            if (error.error?.code === "EMAIL_NOT_VERIFIED") {
-                toast.danger(error.error?.message || error.message, {
-                    actionProps: {
-                        children: localization.auth.resend,
-                        onClick: () => sendVerificationEmail({
-                            email,
-                            callbackURL: `${baseURL}${redirectTo}`
-                        })
-                    }
-                });
-            }
-            else {
-                toast.danger(error.error?.message || error.message);
-            }
-            resetFetchOptions();
-        },
-        onSuccess: () => navigate({ to: redirectTo })
-    });
-    const { mutate: signInUsername, isPending: isSignInUsernamePending } = useSignInUsername(authClient, {
-        onError: (error) => {
-            setPassword("");
-            toast.danger(error.error?.message || error.message);
-            resetFetchOptions();
-        },
-        onSuccess: () => navigate({ to: redirectTo })
-    });
-    const handleSubmit = (e) => {
-        e.preventDefault();
-        const formData = new FormData(e.currentTarget);
-        const email = formData.get("email");
-        const rememberMe = formData.get("rememberMe") === "on";
-        if (isEmail(email)) {
-            signInEmail({
-                email,
-                password,
-                ...(emailAndPassword?.rememberMe ? { rememberMe } : {}),
-                fetchOptions
-            });
-        }
-        else {
-            signInUsername({
-                username: email,
-                password,
-                ...(emailAndPassword?.rememberMe ? { rememberMe } : {}),
-                fetchOptions
-            });
-        }
-    };
-    const signInMutating = useIsMutating({
-        mutationKey: authMutationKeys.signIn.all
-    });
-    const signUpMutating = useIsMutating({
-        mutationKey: authMutationKeys.signUp.all
-    });
-    const isPending = signInMutating + signUpMutating > 0;
-    const isSignInPending = isSignInEmailPending || isSignInUsernamePending;
-    const Captcha = plugins.find((plugin) => plugin.captchaComponent)?.captchaComponent;
-    const showSeparator = emailAndPassword?.enabled && !!socialProviders?.length;
-    return (_jsxs(Card, { className: cn("w-full max-w-sm gap-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 })), showSeparator && (_jsx(FieldSeparator, { children: localization.auth.or }))] })), emailAndPassword?.enabled && (_jsxs(Form, { onSubmit: handleSubmit, className: "flex flex-col gap-4", children: [_jsxs(TextField, { name: "email", type: "text", autoComplete: "username email", isDisabled: isPending, children: [_jsx(Label, { children: usernameLocalization.username }), _jsx(Input, { placeholder: usernameLocalization.usernameOrEmailPlaceholder, variant: variant === "transparent" ? "primary" : "secondary", required: true }), _jsx(FieldError, {})] }), _jsxs(TextField, { minLength: emailAndPassword?.minPasswordLength, maxLength: emailAndPassword?.maxPasswordLength, name: "password", type: "password", autoComplete: "current-password", isDisabled: isPending, value: password, onChange: setPassword, children: [_jsx(Label, { children: localization.auth.password }), _jsx(Input, { placeholder: localization.auth.passwordPlaceholder, variant: variant === "transparent" ? "primary" : "secondary", required: true }), _jsx(FieldError, {})] }), emailAndPassword?.rememberMe && (_jsxs(Checkbox, { name: "rememberMe", isDisabled: isPending, variant: variant === "transparent" ? "primary" : "secondary", children: [_jsx(Checkbox.Control, { children: _jsx(Checkbox.Indicator, {}) }), _jsx(Checkbox.Content, { children: _jsx(Label, { children: localization.auth.rememberMe }) })] })), Captcha && _jsx("div", { className: "flex justify-center", children: Captcha }), _jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs(Button, { type: "submit", className: "w-full", isPending: isSignInPending || isPending, children: [isSignInPending && _jsx(Spinner, { color: "current", size: "sm" }), localization.auth.signIn] }), plugins.flatMap((plugin) => plugin.authButtons?.map((AuthButton, index) => (_jsx(AuthButton, { view: "signIn" }, `${plugin.id}-${index.toString()}`))))] })] })), socialPosition === "bottom" && (_jsxs(_Fragment, { children: [showSeparator && (_jsx(FieldSeparator, { children: localization.auth.or })), !!socialProviders?.length && (_jsx(ProviderButtons, { socialLayout: socialLayout }))] }))] }), _jsxs(Card.Footer, { className: "flex-col gap-3", children: [emailAndPassword?.forgotPassword && (_jsx(Link, { href: `${basePaths.auth}/${viewPaths.auth.forgotPassword}`, className: "no-underline hover:underline", children: localization.auth.forgotPasswordLink })), emailAndPassword?.enabled && (_jsxs(Description, { className: "text-sm", children: [localization.auth.needToCreateAnAccount, " ", _jsx(Link, { href: `${basePaths.auth}/${viewPaths.auth.signUp}`, className: "text-accent no-underline hover:underline decoration-accent-hover", children: localization.auth.signUp })] }))] })] }));
-}

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

@@ -1,45 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useAuthPlugin, useIsUsernameAvailable } from "@better-auth-ui/react";
-import { Check, Xmark } from "@gravity-ui/icons";
-import { FieldError, InputGroup, Label, Spinner, TextField } from "@heroui/react";
-import { useDebouncer } from "@tanstack/react-pacer";
-import { useState } from "react";
-import { usernamePlugin } from "../../../lib/auth/username-plugin";
-/**
- * Renderer for the `username` additional field. Owns availability checking,
- * length limits, and visual indicators. `FieldError` automatically surfaces
- * native validation messages. Availability feedback is shown via the icon and
- * aria-label without affecting the field's invalid state.
- */
-export function UsernameField({ name, field, isPending, variant }) {
-    const { authClient } = useAuth();
-    const { localization, minUsernameLength, maxUsernameLength, isUsernameAvailable: checkAvailability } = useAuthPlugin(usernamePlugin);
-    const currentUsername = String(field.defaultValue ?? "");
-    const [value, setValue] = useState(currentUsername);
-    const { mutate: requestAvailability, data: availability, error: availabilityError, reset: resetAvailability } = useIsUsernameAvailable(authClient, {
-        // Bypass global error toast
-        onError: () => { }
-    });
-    const debouncer = useDebouncer((next) => {
-        const trimmed = next.trim();
-        // Skip blank input and the user's own current username (profile view).
-        if (!trimmed || trimmed === currentUsername) {
-            resetAvailability();
-            return;
-        }
-        requestAvailability({ username: trimmed });
-    }, { wait: 500 });
-    function handleChange(next) {
-        setValue(next);
-        resetAvailability();
-        if (checkAvailability) {
-            debouncer.maybeExecute(next);
-        }
-    }
-    const isCheckingAvailability = !!checkAvailability && !!value.trim() && value.trim() !== currentUsername;
-    return (_jsxs(TextField, { name: name, type: "text", autoComplete: "username", minLength: minUsernameLength, maxLength: maxUsernameLength, isDisabled: isPending, isReadOnly: field.readOnly, value: value, onChange: handleChange, children: [_jsx(Label, { children: field.label }), _jsxs(InputGroup, { variant: variant === "transparent" ? "primary" : "secondary", children: [_jsx(InputGroup.Input, { placeholder: field.placeholder, required: field.required }), isCheckingAvailability && (_jsx(InputGroup.Suffix, { "aria-label": availability?.available
-                            ? localization.usernameAvailable
-                            : availability?.available === false
-                                ? localization.usernameTaken
-                                : undefined, className: "px-2", children: availability?.available ? (_jsx(Check, { className: "text-success" })) : availabilityError || availability?.available === false ? (_jsx(Xmark, { className: "text-danger" })) : (_jsx(Spinner, { size: "sm", color: "current" })) }))] }), _jsx(FieldError, {})] }));
-}

package/dist/lib/auth/api-key-plugin.js

@@ -1,12 +0,0 @@
-import { createAuthPlugin } from "@better-auth-ui/core";
-import { apiKeyPlugin as coreApiKeyPlugin } from "@better-auth-ui/core/plugins";
-import { ApiKeys } from "../../components/auth/api-key/api-keys";
-import { OrganizationApiKeys } from "../../components/auth/api-key/organization-api-keys";
-export const apiKeyPlugin = createAuthPlugin(coreApiKeyPlugin.id, (options = {}) => {
-    const core = coreApiKeyPlugin(options);
-    return {
-        ...core,
-        securityCards: [ApiKeys],
-        ...(core.organization ? { organizationCards: [OrganizationApiKeys] } : {})
-    };
-});

package/dist/lib/auth/auth-plugin.js

@@ -1 +0,0 @@
-export {};

package/dist/lib/auth/delete-user-plugin.js

@@ -1,7 +0,0 @@
-import { createAuthPlugin } from "@better-auth-ui/core";
-import { deleteUserPlugin as coreDeleteUserPlugin } from "@better-auth-ui/core/plugins";
-import { DangerZone } from "../../components/auth/delete-user/danger-zone";
-export const deleteUserPlugin = createAuthPlugin(coreDeleteUserPlugin.id, (options = {}) => ({
-    ...coreDeleteUserPlugin(options),
-    securityCards: [DangerZone]
-}));

package/dist/lib/auth/magic-link-plugin.js

@@ -1,18 +0,0 @@
-import { createAuthPlugin } from "@better-auth-ui/core";
-import { magicLinkPlugin as coreMagicLinkPlugin } from "@better-auth-ui/core/plugins";
-import { MagicLink } from "../../components/auth/magic-link/magic-link";
-import { MagicLinkButton } from "../../components/auth/magic-link/magic-link-button";
-export const magicLinkPlugin = createAuthPlugin(coreMagicLinkPlugin.id, (options = {}) => ({
-    ...coreMagicLinkPlugin(options),
-    authButtons: [MagicLinkButton],
-    views: {
-        auth: { magicLink: MagicLink }
-    },
-    // Conditional, not an override: when `emailAndPassword.enabled === false`
-    // the `<Auth>` router renders this at `/auth/sign-in` instead of the
-    // disabled password form. With password auth on, the built-in `SignIn`
-    // still wins.
-    fallbackViews: {
-        auth: { signIn: MagicLink }
-    }
-}));

package/dist/lib/auth/multi-session-plugin.js

@@ -1,9 +0,0 @@
-import { createAuthPlugin } from "@better-auth-ui/core";
-import { multiSessionPlugin as coreMultiSessionPlugin } from "@better-auth-ui/core/plugins";
-import { ManageAccounts } from "../../components/auth/multi-session/manage-accounts";
-import { SwitchAccountSubmenu } from "../../components/auth/multi-session/switch-account-submenu";
-export const multiSessionPlugin = createAuthPlugin(coreMultiSessionPlugin.id, (options = {}) => ({
-    ...coreMultiSessionPlugin(options),
-    accountCards: [ManageAccounts],
-    userMenuItems: [SwitchAccountSubmenu]
-}));

package/dist/lib/auth/organization-plugin.js

@@ -1,19 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { createAuthPlugin } from "@better-auth-ui/core";
-import { organizationPlugin as coreOrganizationPlugin } from "@better-auth-ui/core/plugins";
-import { Briefcase } from "@gravity-ui/icons";
-import { OrganizationsSettings } from "../../components/auth/organization/organizations-settings";
-export const organizationPlugin = createAuthPlugin(coreOrganizationPlugin.id, (options = {}) => {
-    const coreOptions = coreOrganizationPlugin(options);
-    return {
-        ...coreOptions,
-        localization: coreOptions.localization,
-        settingsTabs: [
-            {
-                view: "organizations",
-                label: (_jsxs(_Fragment, { children: [_jsx(Briefcase, { className: "text-muted" }), coreOptions.localization.organizations] })),
-                component: OrganizationsSettings
-            }
-        ]
-    };
-});

package/dist/lib/auth/passkey-plugin.js

@@ -1,9 +0,0 @@
-import { createAuthPlugin } from "@better-auth-ui/core";
-import { passkeyPlugin as corePasskeyPlugin } from "@better-auth-ui/core/plugins";
-import { PasskeyButton } from "../../components/auth/passkey/passkey-button";
-import { Passkeys } from "../../components/auth/passkey/passkeys";
-export const passkeyPlugin = createAuthPlugin(corePasskeyPlugin.id, (options = {}) => ({
-    ...corePasskeyPlugin(options),
-    authButtons: [PasskeyButton],
-    securityCards: [Passkeys]
-}));

package/dist/lib/auth/theme-plugin.js

@@ -1,26 +0,0 @@
-import { createAuthPlugin } from "@better-auth-ui/core";
-import { themePlugin as coreThemePlugin } from "@better-auth-ui/core/plugins";
-import { Appearance } from "../../components/auth/theme/appearance";
-import { ThemeToggleItem } from "../../components/auth/theme/theme-toggle-item";
-export const themePlugin = createAuthPlugin(coreThemePlugin.id, ({ useTheme, ...rest }) => {
-    // No-op `setTheme` baseline keeps core's required option satisfied on the
-    // hook branch (where the consumer doesn't pass a setter); on the static
-    // branch the spread overrides it with the consumer's real setter.
-    const base = coreThemePlugin({ setTheme: () => { }, ...rest });
-    return {
-        ...base,
-        // Slot components always call `plugin.useTheme()` — invoking the hook
-        // inside their render keeps it in scope of any `<ThemeProvider>` the
-        // consumer mounts. On the static branch the factory re-runs on every
-        // parent render, so the synthesized closure stays in sync with the
-        // consumer's `theme` state.
-        useTheme: useTheme ??
-            (() => ({
-                theme: base.theme,
-                setTheme: base.setTheme,
-                themes: base.themes
-            })),
-        userMenuItems: [ThemeToggleItem],
-        accountCards: [Appearance]
-    };
-});

package/dist/lib/auth/username-plugin.js

@@ -1,19 +0,0 @@
-import { createAuthPlugin } from "@better-auth-ui/core";
-import { usernamePlugin as coreUsernamePlugin } from "@better-auth-ui/core/plugins";
-import { SignInUsername } from "../../components/auth/username/sign-in-username";
-import { UsernameField } from "../../components/auth/username/username-field";
-export const usernamePlugin = createAuthPlugin(coreUsernamePlugin.id, (options = {}) => {
-    const core = coreUsernamePlugin(options);
-    return {
-        ...core,
-        additionalFields: core.additionalFields?.map((field) => field.name === "username"
-            ? {
-                ...field,
-                render: UsernameField
-            }
-            : field),
-        views: {
-            auth: { signIn: SignInUsername }
-        }
-    };
-});