Auth0 Universal Components

Overview

Auth0 Universal Components is Auth0's official set of drop-in React components for organization management, SSO configuration, and MFA enrollment. It is the @auth0 entry in the shadcn directory, with docs and the registry hosted at ui.auth0.com and source in the auth0-ui-components monorepo. The project is currently in Early Access.

The components can be used two ways: as the @auth0/universal-components-react npm package (with /spa and /rwa entry points) or as shadcn registry blocks copied into a project. The registry publishes six blocks covering My Account and My Organization flows, built on Radix UI primitives, React Hook Form and TanStack Table.

Features

• MFA management: A user-mfa-management block handles enrolling and deleting multi-factor authentication factors, including QR codes and OTP input.
• Organization details: Edit organization settings and branding, with a color picker and delete flow.
• Domain table: Create, verify and delete organization domains and configure identity providers for them.
• SSO provider wizard: A multi-step flow for creating SSO providers using SAMLP, OIDC, ADFS, Okta, Google Workspace, Azure AD or PingFederate.
• SSO provider editing: Tabs for provider configuration, SCIM provisioning, token management, field mappings and domain verification.
• Theming: Styling uses CSS variables with light and dark modes, set through Auth0ComponentProvider.
• Examples: Sample apps are included for React SPA, React with shadcn, and Next.js.

Tech stack

• React, @auth0/auth0-react
• Radix UI, Tailwind CSS, shadcn/ui
• React Hook Form, TanStack Table, Sonner

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @auth0/component-name