LoginRadius React SDK
The LoginRadius React SDK (@loginradius/loginradius-react) delivers a React-first integration layer for authentication, profile management, and Identity Orchestration workflows. It handles session state, flow orchestration, and credential storage while giving you full control over UI composition.
The SDK ships pre-built JSX components on top of an embedded auth engine — API client, session management, flow registry, and schema generation. Wrap your app in LoginRadiusProvider and render any flow as a component (for example, <Auth /> or <Profile />).
When to use
Choose the React SDK when any of the following apply:
- You build with React (Create React App, Vite + React, Next.js, Remix) and want idiomatic JSX components.
- You need hooks such as
useLRAuth()to read or mutate session state without prop-drilling. - You want a managed UI for authentication, profile, and B2B organization management without writing the components yourself.
Prefer the LoginRadius JavaScript SDK when your app is built with a non-React framework (Vue, Angular, Svelte, SolidJS, Nuxt) or vanilla HTML.
Available components
Render any flow as a JSX element inside the LoginRadiusProvider tree — for example, <Auth /> or <Profile />. Component identities use PascalCase matching the exports from @loginradius/loginradius-react. Names are organized below by capability area; full per-component reference lives on the Components page.
Authentication and flows
Sign-in, sign-up, social, passwordless, password reset, token verification, and Identity Orchestration workflow components. Use these to render the user-facing entry points of your authentication experience.
| Component | Description |
|---|---|
| Auth | Combined sign-in and sign-up experience (default entry point) |
| Login | Sign-in only |
| Register | Sign-up / registration only |
| SocialLogin | Social provider sign-in |
| PasswordlessLogin | Passwordless login (magic link or OTP) |
| ForgotPassword | Password reset flow |
| VerificationToken | Email / token verification |
| AdminPortal | Admin portal UI |
| Workflow | Identity Orchestration workflow execution |
Profile and account management
Self-service account management surfaces — full profile editor, password and PIN changes, email and phone updates, MFA enrollment, passkey registration, social-account linking, and account deletion. Use these inside an authenticated session to let users manage their own identity data.
| Component | Description |
|---|---|
| Profile | Full profile editor (account management UI) |
| PersonalDetails | View and edit personal profile details |
| ChangePassword | Change account password |
| ChangePin | Change account PIN |
| EditPhone | Update phone number |
| EditUsername | Change username |
| AddEmail | Add or manage email addresses |
| VerifyEmailPhone | Verify email address or phone number |
| SetupTwoFactorAuth | Enroll and manage two-factor authentication (MFA) |
| AddPasskey | Register a passkey |
| ResetBackupCode | Regenerate MFA backup codes |
| LinkAccount | Link or unlink social accounts |
| DeleteAccount | Delete the user account |
Organization management (B2B)
B2B administration components for managing organizations, members, roles, SSO/identity connections, SCIM provisioning, verified domains, and organization switching. Use these to power tenant-admin experiences in multi-tenant applications.
| Component | Description |
|---|---|
| OrganizationUsers | Manage organization members |
| OrganizationRoles | Manage organization roles |
| OrganizationPolicy | Organization security policies (MFA, JIT) |
| OrganizationConnections | Manage SSO / identity connections |
| OrganizationSCIM | SCIM provisioning configuration |
| OrganizationSettings | General organization settings |
| OrganizationDomainManagement | Manage verified domains |
| OrganizationSelector | Organization selection UI |
| OrganizationSwitcher | Switch between organizations |
| OrganizationDangerZone | Destructive organization actions (e.g. delete org) |
Related resources
Get started with the React SDK
Wrap your app with the provider and render flows as JSX components.
Components reference
Pre-built JSX components the React SDK can render.
Hooks reference
React hooks for session, auth, and flow state.
Options
Reference for the options object shared across every SDK flow.
Customization
Style the SDK UI with CSS classes, style props, and CSS variables.
Localization
Translate the SDK UI copy into any language.
LoginRadius JavaScript SDK
Framework-agnostic SDK with the same canonical components.