@better-auth-ui/heroui 1.6.9 → 1.6.10

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

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { EmailChangedEmail as EmailChangedEmailPrimitive } from "@better-auth-ui/react/email";
-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 }));
-}

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

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { EmailVerificationEmail as EmailVerificationEmailPrimitive } from "@better-auth-ui/react/email";
-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 }));
-}

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

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { MagicLinkEmail as MagicLinkEmailPrimitive } from "@better-auth-ui/react/email";
-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 }));
-}

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

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { NewDeviceEmail as NewDeviceEmailPrimitive } from "@better-auth-ui/react/email";
-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 }));
-}

package/dist/components/auth/email/organization-invitation-email.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { OrganizationInvitationEmail as OrganizationInvitationEmailPrimitive } from "@better-auth-ui/react/email";
-import { cn } from "@heroui/react";
-export function OrganizationInvitationEmail({ colors, classNames, ...props }) {
-    return (_jsx(OrganizationInvitationEmailPrimitive, { 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 }));
-}

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

@@ -1,22 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { OtpEmail as OtpEmailPrimitive } from "@better-auth-ui/react/email";
-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 }));
-}

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

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { PasswordChangedEmail as PasswordChangedEmailPrimitive } from "@better-auth-ui/react/email";
-import { cn } from "@heroui/react";
-export function PasswordChangedEmail({ colors, classNames, ...props }) {
-    return (_jsx(PasswordChangedEmailPrimitive, { 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 }));
-}

package/dist/components/auth/email/reset-password-email.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { ResetPasswordEmail as ResetPasswordEmailPrimitive } from "@better-auth-ui/react/email";
-import { cn } from "@heroui/react";
-export function ResetPasswordEmail({ colors, classNames, ...props }) {
-    return (_jsx(ResetPasswordEmailPrimitive, { 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 }));
-}

package/dist/components/auth/error-toaster.js

@@ -1,33 +0,0 @@
-import { authMutationKeys, authQueryKeys } from "@better-auth-ui/core";
-import { toast } from "@heroui/react";
-import { matchMutation, matchQuery, useQueryClient } from "@tanstack/react-query";
-import { useEffect } from "react";
-export function ErrorToaster() {
-    const queryClient = useQueryClient();
-    useEffect(() => {
-        const unsubscribeQuery = queryClient.getQueryCache().subscribe((event) => {
-            if (event.type !== "updated" || event.action.type !== "error")
-                return;
-            if (!matchQuery({ queryKey: authQueryKeys.all }, event.query))
-                return;
-            const err = event.action.error;
-            if (err?.error)
-                toast.danger(err.error.message);
-        });
-        const unsubscribeMutation = queryClient
-            .getMutationCache()
-            .subscribe((event) => {
-            if (event.type !== "updated" || event.action.type !== "error")
-                return;
-            if (!matchMutation({ mutationKey: authMutationKeys.all }, event.mutation))
-                return;
-            const err = event.action.error;
-            toast.danger(err.error?.message || err.message);
-        });
-        return () => {
-            unsubscribeQuery();
-            unsubscribeMutation();
-        };
-    }, [queryClient]);
-    return null;
-}

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

@@ -1,5 +0,0 @@
-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" })] }));
-}

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

@@ -1,37 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useFetchOptions, 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 `useRequestPasswordReset` 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 { authClient, baseURL, basePaths, localization, viewPaths, navigate, plugins } = useAuth();
-    const { fetchOptions, resetFetchOptions } = useFetchOptions();
-    const { mutate: requestPasswordReset, isPending } = useRequestPasswordReset(authClient, {
-        onError: (error) => {
-            toast.danger(error.error?.message || error.message);
-            resetFetchOptions();
-        },
-        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"),
-            redirectTo: `${baseURL}${basePaths.auth}/${viewPaths.auth.resetPassword}`,
-            fetchOptions
-        });
-    }
-    const Captcha = plugins.find((plugin) => plugin.captchaComponent)?.captchaComponent;
-    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.forgotPassword }) }), _jsx(Card.Content, { className: "gap-4", 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, {})] }), Captcha && _jsx("div", { className: "flex justify-center", children: Captcha }), _jsx("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.sendResetLink] }) })] }) }), _jsx(Card.Footer, { className: "flex-col gap-3", children: _jsxs(Description, { className: "text-sm", children: [localization.auth.rememberYourPassword, " ", _jsx(Link, { href: `${basePaths.auth}/${viewPaths.auth.signIn}`, className: "text-accent no-underline hover:underline decoration-accent-hover", children: localization.auth.signIn })] }) })] }));
-}

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

@@ -1,34 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { authMutationKeys } from "@better-auth-ui/core";
-import { useAuth, useAuthPlugin } from "@better-auth-ui/react";
-import { Envelope, Lock } from "@gravity-ui/icons";
-import { cn, Link } from "@heroui/react";
-import { buttonVariants } from "@heroui/styles";
-import { useIsMutating } from "@tanstack/react-query";
-import { magicLinkPlugin } from "../../../lib/auth/magic-link-plugin";
-/**
- * Toggle button between the password sign-in and magic-link routes.
- *
- * @param view - Current auth view. On `"magicLink"` this links back to password sign-in.
- */
-export function MagicLinkButton({ view }) {
-    const { basePaths, emailAndPassword, viewPaths, localization } = useAuth();
-    const signInMutating = useIsMutating({
-        mutationKey: authMutationKeys.signIn.all
-    });
-    const signUpMutating = useIsMutating({
-        mutationKey: authMutationKeys.signUp.all
-    });
-    const isPending = signInMutating + signUpMutating > 0;
-    const { localization: magicLinkLocalization, viewPaths: magicLinkViewPaths } = useAuthPlugin(magicLinkPlugin);
-    const isMagicLinkView = view === "magicLink";
-    // On the magic-link view this button switches back to password sign-in.
-    // With password auth disabled there's nowhere to switch to, so hide it.
-    // (Other views — e.g. a phone-number plugin's surface — still get a
-    // "Continue with Magic Link" link.)
-    if (isMagicLinkView && !emailAndPassword?.enabled)
-        return null;
-    return (_jsxs(Link, { href: `${basePaths.auth}/${isMagicLinkView ? viewPaths.auth.signIn : magicLinkViewPaths.auth.magicLink}`, isDisabled: isPending, className: cn(buttonVariants({ variant: "tertiary" }), "w-full gap-2", isPending && "status-disabled"), children: [isMagicLinkView ? _jsx(Lock, {}) : _jsx(Envelope, {}), localization.auth.continueWith.replace("{{provider}}", isMagicLinkView
-                ? localization.auth.password
-                : magicLinkLocalization.magicLink)] }));
-}

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

@@ -1,40 +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, useSignInMagicLink } from "@better-auth-ui/react";
-import { Button, Card, cn, Description, FieldError, Form, Input, Label, Link, Spinner, TextField, toast } from "@heroui/react";
-import { useIsMutating } from "@tanstack/react-query";
-import { useState } from "react";
-import { magicLinkPlugin } from "../../../lib/auth/magic-link-plugin";
-import { FieldSeparator } from "../field-separator";
-import { ProviderButtons } from "../provider-buttons";
-/**
- * Magic-link sign-in form.
- *
- * @param socialLayout - Provider button layout.
- * @param socialPosition - `"top"` or `"bottom"`. Defaults to `"bottom"`.
- * @param variant - Card variant.
- */
-export function MagicLink({ className, socialLayout, socialPosition = "bottom", variant, ...props }) {
-    const { authClient, basePaths, baseURL, emailAndPassword, localization, plugins, redirectTo, socialProviders, viewPaths } = useAuth();
-    const { localization: magicLinkLocalization } = useAuthPlugin(magicLinkPlugin);
-    const [email, setEmail] = useState("");
-    const { mutate: signInMagicLink, isPending: signInMagicLinkPending } = useSignInMagicLink(authClient, {
-        onSuccess: () => {
-            setEmail("");
-            toast.success(magicLinkLocalization.magicLinkSent);
-        }
-    });
-    const signInMutating = useIsMutating({
-        mutationKey: authMutationKeys.signIn.all
-    });
-    const signUpMutating = useIsMutating({
-        mutationKey: authMutationKeys.signUp.all
-    });
-    const isPending = signInMutating + signUpMutating > 0;
-    const handleSubmit = (e) => {
-        e.preventDefault();
-        signInMagicLink({ email, callbackURL: `${baseURL}${redirectTo}` });
-    };
-    const showSeparator = !!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 }))] })), _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: [signInMagicLinkPending && _jsx(Spinner, { color: "current", size: "sm" }), magicLinkLocalization.sendMagicLink] }), plugins.flatMap((plugin) => (plugin.authButtons ?? []).map((AuthButton, index) => (_jsx(AuthButton, { view: "magicLink" }, `${plugin.id}-${index.toString()}`))))] })] }), socialPosition === "bottom" && (_jsxs(_Fragment, { children: [showSeparator && (_jsx(FieldSeparator, { children: localization.auth.or })), !!socialProviders?.length && (_jsx(ProviderButtons, { socialLayout: socialLayout }))] }))] }), emailAndPassword?.enabled && (_jsx(Card.Footer, { className: "flex-col gap-3", children: _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/multi-session/manage-account.js

@@ -1,33 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useAuthPlugin, useRevokeMultiSession, useSetActiveSession, useUser } from "@better-auth-ui/react";
-import { ArrowRightArrowLeft, ArrowRightFromSquare, Ellipsis } from "@gravity-ui/icons";
-import { Button, Dropdown, Spinner, toast } from "@heroui/react";
-import { multiSessionPlugin } from "../../../lib/auth/multi-session-plugin";
-import { UserView } from "../user/user-view";
-/**
- * Render a single account row with user info and a dropdown for switch/sign-out actions.
- *
- * Shows the user's avatar and info. A three-dot menu provides options to
- * switch account (for non-active sessions) and sign out.
- *
- * @param deviceSession - The device session object containing session and user data
- * @returns A JSX element containing the account row
- */
-export function ManageAccount({ deviceSession, isPending }) {
-    const { authClient, localization } = useAuth();
-    const { localization: multiSessionLocalization } = useAuthPlugin(multiSessionPlugin);
-    const { data: user } = useUser(authClient);
-    const { mutate: setActiveSession, isPending: isSwitching } = useSetActiveSession(authClient, {
-        onSuccess: () => window.scrollTo({ top: 0 })
-    });
-    const { mutate: revokeSession, isPending: isRevoking } = useRevokeMultiSession(authClient, {
-        onSuccess: () => toast.success(localization.settings.revokeSessionSuccess)
-    });
-    const isActive = deviceSession?.session.userId === user?.id;
-    const isBusy = isSwitching || isRevoking;
-    return (_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsx(UserView, { user: deviceSession?.user, isPending: isPending, size: "md" }), deviceSession && isActive && (_jsxs(Button, { className: "shrink-0", variant: "outline", size: "sm", onPress: () => revokeSession({ sessionToken: deviceSession.session.token }), isDisabled: isBusy, children: [isRevoking ? (_jsx(Spinner, { color: "current", size: "sm" })) : (_jsx(ArrowRightFromSquare, {})), localization.auth.signOut] })), deviceSession && !isActive && (_jsxs(Dropdown, { children: [_jsx(Button, { isIconOnly: true, variant: "ghost", className: "shrink-0", size: "sm", isDisabled: isBusy, children: _jsx(Ellipsis, {}) }), _jsx(Dropdown.Popover, { children: _jsxs(Dropdown.Menu, { children: [_jsxs(Dropdown.Item, { textValue: multiSessionLocalization.switchAccount, onAction: () => setActiveSession({
-                                        sessionToken: deviceSession.session.token
-                                    }), children: [_jsx(ArrowRightArrowLeft, { className: "text-muted" }), multiSessionLocalization.switchAccount] }), _jsxs(Dropdown.Item, { textValue: localization.auth.signOut, onAction: () => revokeSession({
-                                        sessionToken: deviceSession.session.token
-                                    }), children: [_jsx(ArrowRightFromSquare, { className: "text-muted" }), localization.auth.signOut] })] }) })] }))] }));
-}

package/dist/components/auth/multi-session/manage-accounts.js

@@ -1,33 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useAuthPlugin, useListDeviceSessions, useSession } from "@better-auth-ui/react";
-import { Card, cn } from "@heroui/react";
-import { multiSessionPlugin } from "../../../lib/auth/multi-session-plugin";
-import { ManageAccount } from "./manage-account";
-/**
- * Render a card that lists and manages all device sessions for the current user.
- *
- * Shows each session with user information and actions to switch to or revoke a session.
- * When device session data is loading, a pending placeholder row is displayed.
- *
- * @returns A JSX element containing the accounts management card
- */
-export function ManageAccounts({ className, variant, ...props }) {
-    const { authClient } = useAuth();
-    const { localization: multiSessionLocalization } = useAuthPlugin(multiSessionPlugin);
-    const { data: session } = useSession(authClient);
-    const { data: deviceSessions, isPending } = useListDeviceSessions(authClient);
-    const otherSessions = deviceSessions?.filter((deviceSession) => deviceSession.session.id !== session?.session.id);
-    const allRows = [
-        {
-            key: session?.session.id ?? "current",
-            deviceSession: !isPending ? session : null,
-            isPending
-        },
-        ...(otherSessions?.map((deviceSession) => ({
-            key: deviceSession.session.id,
-            deviceSession,
-            isPending: false
-        })) ?? [])
-    ];
-    return (_jsxs("div", { children: [_jsx("h2", { className: cn("text-sm font-semibold mb-3"), children: multiSessionLocalization.manageAccounts }), _jsx(Card, { className: cn(className), variant: variant, ...props, children: _jsx(Card.Content, { className: "gap-0", children: allRows.map((row, index) => (_jsxs("div", { children: [index > 0 && (_jsx("div", { className: "border-b border-dashed -mx-4 my-4" })), _jsx(ManageAccount, { deviceSession: row.deviceSession, isPending: row.isPending })] }, row.key))) }) })] }));
-}

package/dist/components/auth/multi-session/switch-account-submenu-content.js

@@ -1,25 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useAuthPlugin, useListDeviceSessions, useSession } from "@better-auth-ui/react";
-import { Check, CirclePlus } from "@gravity-ui/icons";
-import { Dropdown, Label } from "@heroui/react";
-import { multiSessionPlugin } from "../../../lib/auth/multi-session-plugin";
-import { UserView } from "../user/user-view";
-import { SwitchAccountSubmenuItem } from "./switch-account-submenu-item";
-/**
- * Render the submenu content for switching between multiple authenticated sessions.
- *
- * Shows the current session with a checkmark, lists other device sessions that can be activated,
- * and provides an option to add a new account. This component should be rendered inside a
- * Dropdown.SubmenuTrigger to defer the useListDeviceSessions query until the submenu is opened.
- *
- * @returns The switch account submenu content as a JSX element
- */
-export function SwitchAccountSubmenuContent({ hideSubtitle }) {
-    const { authClient, basePaths, viewPaths } = useAuth();
-    const { localization: multiSessionLocalization } = useAuthPlugin(multiSessionPlugin);
-    const { data: session } = useSession(authClient);
-    const { data: deviceSessions, isPending } = useListDeviceSessions(authClient);
-    return (_jsx(Dropdown.Popover, { className: "min-w-40 md:min-w-56 max-w-[48svw]", children: _jsxs(Dropdown.Menu, { children: [_jsxs(Dropdown.Item, { className: "px-2", children: [_jsx(UserView, { isPending: isPending, hideSubtitle: hideSubtitle }), !isPending && _jsx(Check, { className: "ml-auto" })] }), deviceSessions
-                    ?.filter((deviceSession) => deviceSession.session.id !== session?.session?.id)
-                    .map((deviceSession) => (_jsx(SwitchAccountSubmenuItem, { deviceSession: deviceSession, hideSubtitle: hideSubtitle }, deviceSession.session.id))), _jsxs(Dropdown.Item, { textValue: multiSessionLocalization.addAccount, href: `${basePaths.auth}/${viewPaths.auth.signIn}`, children: [_jsx(CirclePlus, { className: "text-muted" }), _jsx(Label, { children: multiSessionLocalization.addAccount })] })] }) }));
-}

package/dist/components/auth/multi-session/switch-account-submenu-item.js

@@ -1,17 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useSetActiveSession } from "@better-auth-ui/react";
-import { Dropdown, Spinner } from "@heroui/react";
-import { UserView } from "../user/user-view";
-/**
- * Render a dropdown item for switching to a different authenticated session.
- *
- * @param deviceSession - The device session to display and switch to when pressed
- * @returns The switch account dropdown item as a JSX element
- */
-export function SwitchAccountSubmenuItem({ deviceSession, hideSubtitle }) {
-    const { authClient } = useAuth();
-    const { mutate: setActiveSession, isPending } = useSetActiveSession(authClient, {
-        onSuccess: () => window.scrollTo({ top: 0 })
-    });
-    return (_jsxs(Dropdown.Item, { className: "px-2", isDisabled: isPending, onPress: () => setActiveSession({ sessionToken: deviceSession.session.token }), children: [_jsx(UserView, { user: deviceSession.user, hideSubtitle: hideSubtitle }), isPending && _jsx(Spinner, { color: "current", size: "sm", className: "ml-auto" })] }));
-}

package/dist/components/auth/multi-session/switch-account-submenu.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useAuthPlugin, useSession } from "@better-auth-ui/react";
-import { ArrowRightArrowLeft } from "@gravity-ui/icons";
-import { Dropdown, Label } from "@heroui/react";
-import { multiSessionPlugin } from "../../../lib/auth/multi-session-plugin";
-import { SwitchAccountSubmenuContent } from "./switch-account-submenu-content";
-/**
- * Render a dropdown submenu for switching between multiple authenticated sessions.
- *
- * This component renders as a submenu trigger that opens the switch account menu.
- * It should be rendered inside a Dropdown.Menu.
- *
- * @param className - Optional additional CSS class names
- * @returns The switch account submenu as a JSX element
- */
-export function SwitchAccountSubmenu({ className, hideSubtitle }) {
-    const { authClient } = useAuth();
-    const { data: session } = useSession(authClient);
-    const { localization: multiSessionLocalization } = useAuthPlugin(multiSessionPlugin);
-    if (!session) {
-        return null;
-    }
-    return (_jsxs(Dropdown.SubmenuTrigger, { children: [_jsxs(Dropdown.Item, { className: className, textValue: multiSessionLocalization.switchAccount, children: [_jsx(ArrowRightArrowLeft, { className: "text-muted" }), _jsx(Label, { children: multiSessionLocalization.switchAccount }), _jsx(Dropdown.SubmenuIndicator, {})] }), _jsx(Dropdown.Popover, { className: "min-w-40 md:min-w-56 max-w-[48svw]", children: _jsx(SwitchAccountSubmenuContent, { hideSubtitle: hideSubtitle }) })] }));
-}

package/dist/components/auth/organization/change-organization-logo.js

@@ -1,69 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { fileToBase64 } from "@better-auth-ui/core";
-import { useActiveOrganization, useAuth, useAuthPlugin, useUpdateOrganization } from "@better-auth-ui/react";
-import { CloudArrowUpIn, TrashBin } from "@gravity-ui/icons";
-import { Button, cn, Dropdown, Label, Spinner, toast } from "@heroui/react";
-import { useRef, useState } from "react";
-import { organizationPlugin } from "../../../lib/auth/organization-plugin";
-import { OrganizationLogo } from "./organization-logo";
-export function ChangeOrganizationLogo({ className }) {
-    const { authClient } = useAuth();
-    const { logo, localization: organizationLocalization } = useAuthPlugin(organizationPlugin);
-    const { data: activeOrganization, isPending: activeOrganizationPending } = useActiveOrganization(authClient);
-    const { mutate: updateOrganization, isPending: updatePending } = useUpdateOrganization(authClient);
-    const fileInputRef = useRef(null);
-    const [isUploading, setIsUploading] = useState(false);
-    const [isDeleting, setIsDeleting] = useState(false);
-    const isPending = updatePending || isUploading || isDeleting;
-    async function handleFileChange(e) {
-        const file = e.target.files?.[0];
-        if (!file || !activeOrganization)
-            return;
-        e.target.value = "";
-        setIsUploading(true);
-        try {
-            const resized = (await logo.resize?.(file, logo.size, logo.extension)) || file;
-            const image = (await logo.upload?.(resized)) || (await fileToBase64(resized));
-            updateOrganization({ data: { logo: image } }, {
-                onSuccess: () => toast.success(organizationLocalization.logoChangedSuccess),
-                onSettled: () => setIsUploading(false)
-            });
-        }
-        catch (error) {
-            setIsUploading(false);
-            if (error instanceof Error) {
-                toast.danger(error.message);
-            }
-        }
-    }
-    async function handleDelete() {
-        const currentLogo = activeOrganization?.logo;
-        updateOrganization({
-            data: { logo: "" }
-        }, {
-            onSuccess: async () => {
-                if (!currentLogo) {
-                    toast.success(organizationLocalization.logoDeletedSuccess);
-                    return;
-                }
-                setIsDeleting(true);
-                try {
-                    await logo.delete?.(currentLogo);
-                    toast.success(organizationLocalization.logoDeletedSuccess);
-                }
-                catch (error) {
-                    if (error instanceof Error) {
-                        toast.danger(error.message);
-                    }
-                }
-                finally {
-                    setIsDeleting(false);
-                }
-            }
-        });
-    }
-    if (!logo.enabled) {
-        return null;
-    }
-    return (_jsxs("div", { className: cn("flex flex-col gap-1", className), children: [_jsx(Label, { isDisabled: !activeOrganization, children: organizationLocalization.logo }), _jsx("input", { ref: fileInputRef, type: "file", accept: "image/*", className: "hidden", onChange: handleFileChange }), _jsxs("div", { className: "flex items-center gap-4", children: [_jsx(Button, { type: "button", isIconOnly: true, variant: "ghost", className: "p-0 h-auto w-auto rounded-full", isDisabled: !activeOrganization || isPending, onPress: () => fileInputRef.current?.click(), children: _jsx(OrganizationLogo, { size: "lg", isPending: activeOrganizationPending, organization: activeOrganization }) }), _jsxs(Dropdown, { children: [_jsxs(Button, { isDisabled: !activeOrganization || isPending, size: "sm", variant: "secondary", children: [isPending && _jsx(Spinner, { size: "sm" }), organizationLocalization.changeLogo] }), _jsx(Dropdown.Popover, { className: "min-w-fit", children: _jsxs(Dropdown.Menu, { children: [_jsxs(Dropdown.Item, { textValue: organizationLocalization.uploadLogo, onAction: () => fileInputRef.current?.click(), children: [_jsx(CloudArrowUpIn, { className: "text-muted" }), _jsx(Label, { children: organizationLocalization.uploadLogo })] }), _jsxs(Dropdown.Item, { textValue: organizationLocalization.deleteLogo, isDisabled: !activeOrganization?.logo, onAction: handleDelete, variant: "danger", children: [_jsx(TrashBin, { className: "text-danger" }), _jsx(Label, { children: organizationLocalization.deleteLogo })] })] }) })] })] })] }));
-}

package/dist/components/auth/organization/create-organization-dialog.js

@@ -1,37 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useAuthPlugin, useCreateOrganization } from "@better-auth-ui/react";
-import { Briefcase } from "@gravity-ui/icons";
-import { AlertDialog, Button, FieldError, Form, Input, Label, Spinner, TextField } from "@heroui/react";
-import { useEffect, useState } from "react";
-import { organizationPlugin } from "../../../lib/auth/organization-plugin";
-import { SlugField, sanitizeSlug } from "./slug-field";
-/**
- * Render a dialog for creating a new organization.
- *
- * @param isOpen - Whether the dialog is open
- * @param onOpenChange - Callback for when the dialog open state changes
- * @returns The create organization dialog as a JSX element
- */
-export function CreateOrganizationDialog({ isOpen, onOpenChange }) {
-    const { authClient, localization } = useAuth();
-    const { localization: organizationLocalization } = useAuthPlugin(organizationPlugin);
-    const [name, setName] = useState("");
-    const [slug, setSlug] = useState("");
-    const { mutate: createOrganization, isPending: isCreating } = useCreateOrganization(authClient, {
-        onSuccess: () => onOpenChange(false)
-    });
-    const handleSubmit = (e) => {
-        e.preventDefault();
-        createOrganization({ name, slug });
-    };
-    useEffect(() => {
-        if (!isOpen) {
-            setSlug("");
-            setName("");
-        }
-    }, [isOpen]);
-    useEffect(() => {
-        setSlug(sanitizeSlug(name));
-    }, [name]);
-    return (_jsx(AlertDialog.Backdrop, { isOpen: isOpen, onOpenChange: onOpenChange, children: _jsx(AlertDialog.Container, { children: _jsx(AlertDialog.Dialog, { children: _jsxs(Form, { onSubmit: handleSubmit, children: [_jsx(AlertDialog.CloseTrigger, {}), _jsxs(AlertDialog.Header, { children: [_jsx(AlertDialog.Icon, { status: "default", children: _jsx(Briefcase, {}) }), _jsx(AlertDialog.Heading, { children: organizationLocalization.createOrganization })] }), _jsxs(AlertDialog.Body, { className: "flex flex-col gap-4 overflow-visible", children: [_jsx("p", { className: "text-muted text-sm", children: organizationLocalization.organizationsDescription }), _jsxs(TextField, { id: "name", name: "name", isDisabled: isCreating, value: name, onChange: setName, children: [_jsx(Label, { children: organizationLocalization.name }), _jsx(Input, { required: true, autoFocus: true, placeholder: organizationLocalization.namePlaceholder, variant: "secondary" }), _jsx(FieldError, {})] }), _jsx(SlugField, { value: slug, onChange: setSlug, isDisabled: isCreating, variant: "secondary" })] }), _jsxs(AlertDialog.Footer, { children: [_jsx(Button, { slot: "close", variant: "tertiary", isDisabled: isCreating, children: localization.settings.cancel }), _jsxs(Button, { type: "submit", isPending: isCreating, children: [isCreating && _jsx(Spinner, { color: "current", size: "sm" }), organizationLocalization.createOrganization] })] })] }) }) }) }));
-}

package/dist/components/auth/organization/delete-organization-dialog.js

@@ -1,25 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAuth, useAuthPlugin, useDeleteOrganization } from "@better-auth-ui/react";
-import { TriangleExclamation } from "@gravity-ui/icons";
-import { AlertDialog, Button, Card, Form, Spinner, toast } from "@heroui/react";
-import { organizationPlugin } from "../../../lib/auth/organization-plugin";
-import { OrganizationView } from "./organization-view";
-export function DeleteOrganizationDialog({ isOpen, onOpenChange, organization }) {
-    const { authClient, basePaths, localization, navigate } = useAuth();
-    const { localization: organizationLocalization, viewPaths: organizationPluginViewPaths } = useAuthPlugin(organizationPlugin);
-    const { mutate: deleteOrganization, isPending } = useDeleteOrganization(authClient, {
-        onSuccess: () => {
-            onOpenChange(false);
-            toast.success(organizationLocalization.organizationDeleted);
-            navigate({
-                to: `${basePaths.settings}/${organizationPluginViewPaths.settings.organizations}`,
-                replace: true
-            });
-        }
-    });
-    function handleSubmit(e) {
-        e.preventDefault();
-        deleteOrganization({ organizationId: organization.id });
-    }
-    return (_jsx(AlertDialog.Backdrop, { isOpen: isOpen, onOpenChange: onOpenChange, children: _jsx(AlertDialog.Container, { children: _jsx(AlertDialog.Dialog, { children: _jsxs(Form, { onSubmit: handleSubmit, children: [_jsx(AlertDialog.CloseTrigger, {}), _jsxs(AlertDialog.Header, { children: [_jsx(AlertDialog.Icon, { status: "danger", children: _jsx(TriangleExclamation, {}) }), _jsx(AlertDialog.Heading, { children: organizationLocalization.deleteOrganization })] }), _jsxs(AlertDialog.Body, { className: "flex flex-col gap-4 overflow-visible", children: [_jsx("p", { className: "text-muted text-sm", children: organizationLocalization.deleteOrganizationDescription }), _jsx(Card, { variant: "secondary", children: _jsx(Card.Content, { children: _jsx(OrganizationView, { organization: organization, hideRole: true }) }) })] }), _jsxs(AlertDialog.Footer, { children: [_jsx(Button, { slot: "close", variant: "tertiary", isDisabled: isPending, children: localization.settings.cancel }), _jsxs(Button, { type: "submit", variant: "danger", isPending: isPending, children: [isPending && _jsx(Spinner, { color: "current", size: "sm" }), organizationLocalization.deleteOrganization] })] })] }) }) }) }));
-}