AuthProvider
Wraps the auth context with the HeroUI router bridge and shared toaster used by the package UI.
Import
import { AuthProvider } from "@xylex-group/athena-auth-ui"Details
- Category:
component - Primary entrypoint:
@xylex-group/athena-auth-ui - Public entrypoints:
@xylex-group/athena-auth-ui - Source:
packages/heroui/src/components/auth/auth-provider.tsx
Props
| Prop | Type | Required | Notes |
|---|---|---|---|
plugins | AuthPlugin[] | undefined | No | Registered auth plugins. UI packages widen the element type via the AuthPluginRegister module-augmentation slot. |
additionalFields | AdditionalFields | undefined | No | Additional user fields rendered on sign-up and the user profile. |
redirectTo | string | undefined | No | Default redirect path after successful authentication |
baseURL | string | undefined | No | Base URL for API endpoints (optional) |
navigate | ((options: { to: string; replace?: boolean; }) => void) & ((options: { to: string; replace?: boolean; }) => void) | Yes | Function to navigate to a new path |
avatar | { delete?: ((url: string) => Promise<void>) | undefined; enabled?: boolean | undefined; extension?: "png" | "jpg" | "webp" | "inherit" | undefined; resize?: ((file: File, size?: number, extension?: "png" | "jpg" | "webp" | "inherit") => Promise<File>) | undefined; size?: number | undefined; upload?: ((file: File) => Promise<string>) | undefined; } | undefined | No | Avatar upload, optimization, and deletion configuration. |
basePaths | { auth?: string | undefined; settings?: string | undefined; organization?: string | undefined; } | undefined | No | Base paths for different application sections |
emailAndPassword | { enabled?: boolean | undefined; confirmPassword?: boolean | undefined; forgotPassword?: boolean | undefined; maxPasswordLength?: number | undefined; minPasswordLength?: number | undefined; name?: boolean | undefined; rememberMe?: boolean | undefined; requireEmailVerification?: boolean | undefined; } | undefined | No | Email and password authentication configuration |
localization | { auth?: { account?: string | undefined; alreadyHaveAnAccount?: string | undefined; confirmPassword?: string | undefined; confirmPasswordPlaceholder?: string | undefined; continueWith?: string | undefined; email?: string | undefined; emailPlaceholder?: string | undefined; forgotPassword?: string | undefined; forgotPasswordLink?: string | undefined; hidePassword?: string | undefined; invalidResetPasswordToken?: string | undefined; name?: string | undefined; namePlaceholder?: string | undefined; needToCreateAnAccount?: string | undefined; newPassword?: string | undefined; newPasswordPlaceholder?: string | undefined; or?: string | undefined; password?: string | undefined; passwordPlaceholder?: string | undefined; passwordResetEmailSent?: string | undefined; passwordResetSuccess?: string | undefined; passwordsDoNotMatch?: string | undefined; rememberMe?: string | undefined; rememberYourPassword?: string | undefined; resend?: string | undefined; resetPassword?: string | undefined; sendResetLink?: string | undefined; showPassword?: string | undefined; signIn?: string | undefined; signOut?: string | undefined; signUp?: string | undefined; verificationEmailSent?: string | undefined; verifyYourEmail?: string | undefined; } | undefined; settings?: { account?: string | undefined; accountUnlinked?: string | undefined; active?: string | undefined; activeSessions?: string | undefined; avatar?: string | undefined; currentSession?: string | undefined; avatarChangedSuccess?: string | undefined; avatarDeletedSuccess?: string | undefined; changeAvatar?: string | undefined; deleteAvatar?: string | undefined; link?: string | undefined; linkedAccounts?: string | undefined; linkProvider?: string | undefined; cancel?: string | undefined; copyToClipboard?: string | undefined; changeEmail?: string | undefined; changeEmailSuccess?: string | undefined; changePassword?: string | undefined; changePasswordSuccess?: string | undefined; currentPassword?: string | undefined; currentPasswordPlaceholder?: string | undefined; dangerZone?: string | undefined; delete?: string | undefined; optional?: string | undefined; profileUpdatedSuccess?: string | undefined; revoke?: string | undefined; revokeSession?: string | undefined; revokeSessionSuccess?: string | undefined; saveChanges?: string | undefined; setPassword?: string | undefined; setPasswordDescription?: string | undefined; security?: string | undefined; settings?: string | undefined; time?: string | undefined; unlinkProvider?: string | undefined; updateEmail?: string | undefined; updatePassword?: string | undefined; uploadAvatar?: string | undefined; userProfile?: string | undefined; } | undefined; } | undefined | No | Localization strings for UI components |
multipleAccountsPerProvider | boolean | undefined | No | Allow users to link multiple accounts from the same social provider. When false, providers already linked to the account are hidden from the available-to-link list. |
socialProviders | ((string & {}) | "linear" | "huggingface" | "github" | "apple" | "atlassian" | "cognito" | "discord" | "facebook" | "figma" | "microsoft" | "google" | "slack" | "spotify" | "twitch" | "twitter" | "dropbox" | "kick" | "linkedin" | "gitlab" | "tiktok" | "reddit" | "roblox" | "salesforce" | "vk" | "zoom" | "notion" | "kakao" | "naver" | "line" | "paybin" | "paypal" | "polar" | "railway" | "vercel" | "wechat")[] | undefined | No | List of enabled social authentication providers |
viewPaths | { auth?: { signIn?: string | undefined; signUp?: string | undefined; forgotPassword?: string | undefined; resetPassword?: string | undefined; signOut?: string | undefined; magicLink?: string | undefined; } | undefined; settings?: { account?: string | undefined; security?: string | undefined; organizations?: string | undefined; } | undefined; } | undefined | No | View path mappings for different authentication views |
children | ReactNode | No | |
queryClient | QueryClient | undefined | No | TanStack QueryClient to use for your application's queries |
authClient | TAuthClient | Yes | |
ui | AthenaAuthUiOptions | undefined | No |
Notes
- Most interactive auth components expect to be rendered under
AuthProviderso hooks such asuseAuthand the configured navigation bridge are available. - See Customization Guide for provider-level localization, route overrides, class-name slots, loading overrides, and email template key mapping.