auth-client overview
@vendidit/auth-client is the browser SDK. Vanilla TypeScript core
with first-class adapters for React, Preact, SolidJS, Vue, and Astro.
Hexagonal architecture — every external dependency is an injectable
port with a browser-native default.
| Source | Vendidit/auth-client |
| Live demo | auth-demo.vendidit.com |
| Companion | auth-shared (types) |
Highlights
- Same API everywhere. Every adapter exposes
useAuth,useLogin,useStartSso, … — switching frameworks is a one-line import change. - Three bootstrap modes.
auto(default): proactively validates the cached session against/auth/meat boot. UIs gate their first render onready().lazy: trusts cached claims, defers validation until the first failed request.offline: inert mode. Flow methods throwOfflineModeError.
- Auto-retry on 401.
authenticatedRequest()refreshes under a mutex and retries once. Refresh failure clears state + emitssession_expired. - Cross-tab session sync. BroadcastChannel keeps every tab consistent.
- Refresh-mutex coalescing. A burst of N concurrent requests just-before-expiry triggers ONE refresh, not N.
- Pluggable everything. Token store, transport, storage, clock, crypto, logger, broadcast — each is a port.
- Full server feature parity. Password + SSO/PKCE, TOTP 2FA, refresh-rotation, dual-secret rotation, impersonation, hard-delete, per-user token-version, org / app context switching.
The 80% usage
import { createAuthClient } from '@vendidit/auth-client';
const auth = createAuthClient({ apiBaseUrl: 'https://auth.vendidit.com/api/v1', appCode: 'marketplace-buyer',});
await auth.ready();if (auth.isAuthenticated()) { console.log('signed in as', auth.getCurrentUser());} else { await auth.loginWithPassword({ email, password });}
auth.on('logged_out', () => router.push('/login'));See Quickstart for the full pattern.
Adapters
| Framework | Subpath | Surface |
|---|---|---|
| React | @vendidit/auth-client/react | useAuth, useLogin, useLogout, useVerifyEmail, useRequestMagicLink, useAdminListUserSessions, … |
| Preact | @vendidit/auth-client/preact | Same surface as React. Used by auth-client-demo. |
| Solid | @vendidit/auth-client/solid | Solid stores — same surface. |
| Vue | @vendidit/auth-client/vue | Vue composables — same surface. |
| Astro | @vendidit/auth-client/astro | Astro helpers + middleware. |
UI components
| Subpath | What’s inside |
|---|---|
@vendidit/auth-client/preact/ui/atoms | 13 headless primitives — AuthStatusBadge, UserAvatar, UserMenu, LogoutButton, SsoButton, ProtectedRoute, GuestOnly, RoleGate, PermissionGate, TokenExpiryCountdown, AuthLoading. |
@vendidit/auth-client/preact/ui/forms | 25 composed forms — LoginForm, RegisterForm, PasswordResetRequestForm, TwoFactorEnrollment, SessionsList, MagicLinkRequestForm, DeleteAccountForm, AuditLogTable, UsersTable, AdminUserEditPanel, OrgRoleEditor, … |
@vendidit/auth-client/preact/ui/flows | 7 end-to-end multi-step flows — CompleteLoginFlow, CompleteSignupFlow, CompletePasswordResetFlow, CompleteSsoCallbackFlow, CompleteAccountSecurityFlow, CompleteImpersonationFlow, CompleteOrgAdminFlow. |
See the live catalog at auth-demo.vendidit.com.
Related pages
- How it works — session manager, port abstraction, refresh-rotation.
- Quickstart — install + 30-line setup.
- Framework adapters — per-framework usage pages.
- Class reference — auto-generated TypeDoc.
- Playground — the live demo.