@glinr/theauth-ui

npm · Source · Docs · All packages

Headless, slot-based auth UI components for theAuth.

Part of theAuth, open-source auth for AI agents and humans. Docs: docs.theauth.dev.

Install

npm install @glinr/theauth-ui

Usage

Drop pre-built components into any React app. All components accept classNames for slot-level style overrides.

import { AuthCard, SignIn, OAuthButtons } from '@glinr/theauth-ui';

function LoginPage() {
  return (
    <AuthCard>
      <OAuthButtons providers={['google', 'github']} />
      <SignIn
        onSuccess={(session) => router.push('/dashboard')}
        classNames={{ input: 'border-gray-300 rounded-md' }}
      />
    </AuthCard>
  );
}

Components

| Component | Description | |-----------|-------------| | AuthCard | Wrapper card with consistent layout | | SignIn | Email/password sign-in form | | SignUp | Registration form | | ForgotPassword | Password reset request form | | TwoFactorVerify | TOTP/SMS verification form | | OAuthButtons | OAuth provider button row | | UserButton | Avatar dropdown for signed-in users |

OAuth icons

All provider icons are exported individually (GoogleIcon, GitHubIcon, MicrosoftIcon, etc.) and as OAUTH_PROVIDERS metadata array.

Docs

https://docs.theauth.dev/ui-components

Community

Questions and help in the #theauth forum on the GLINR Discord.

License

MIT

Learn more

• UI components
• React guide
• All packages
• GitHub Discussions for questions
• Report a security issue