@nice2dev/auth

Authentication & authorization UI components for React — login, registration, OAuth, 2FA, captcha, password management, and token handling.

Installation

npm install @nice2dev/auth

Peer dependencies: react >= 17.0.0, react-dom >= 17.0.0

Components

| Component | Description | |-----------|-------------| | NiceLoginForm | Login form with email/password, validation, remember me | | NiceRegistrationForm | Registration form with password strength | | NiceTwoFaSetup | TOTP 2FA setup with QR code display | | NiceChangePassword | Change/reset password with strength meter | | NiceCaptcha | Captcha widget (pluggable providers) | | NicePasswordStrength | Visual password strength indicator | | NiceOAuthButtons | OAuth provider login buttons (Google, GitHub, Microsoft, etc.) | | NiceAuthGuard | Protected route/section wrapper | | NiceTokenManagement | API token CRUD management |

Hooks

| Hook | Description | |------|-------------| | useAuth | Auth state management (JWT, roles, refresh, logout) |

Usage

import { NiceLoginForm, useAuth } from '@nice2dev/auth';

function LoginPage() {
  const { login, user } = useAuth({
    loginFn: async (credentials) => {
      const res = await fetch('/api/auth/login', {
        method: 'POST',
        body: JSON.stringify(credentials),
      });
      return res.json();
    },
  });

  if (user) return <div>Welcome, {user.name}</div>;

  return <NiceLoginForm onLogin={login} />;
}

Types

Key TypeScript types exported: AuthUser, AuthTokens, AuthState, AuthActions, UseAuthConfig, CaptchaProvider, OAuthProvider, PasswordStrengthLevel.

License

MIT © NiceToDev