Skip to content

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.

SourceVendidit/auth-client
Live demoauth-demo.vendidit.com
Companionauth-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/me at boot. UIs gate their first render on ready().
    • lazy: trusts cached claims, defers validation until the first failed request.
    • offline: inert mode. Flow methods throw OfflineModeError.
  • Auto-retry on 401. authenticatedRequest() refreshes under a mutex and retries once. Refresh failure clears state + emits session_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

FrameworkSubpathSurface
React@vendidit/auth-client/reactuseAuth, useLogin, useLogout, useVerifyEmail, useRequestMagicLink, useAdminListUserSessions, …
Preact@vendidit/auth-client/preactSame surface as React. Used by auth-client-demo.
Solid@vendidit/auth-client/solidSolid stores — same surface.
Vue@vendidit/auth-client/vueVue composables — same surface.
Astro@vendidit/auth-client/astroAstro helpers + middleware.

UI components

SubpathWhat’s inside
@vendidit/auth-client/preact/ui/atoms13 headless primitives — AuthStatusBadge, UserAvatar, UserMenu, LogoutButton, SsoButton, ProtectedRoute, GuestOnly, RoleGate, PermissionGate, TokenExpiryCountdown, AuthLoading.
@vendidit/auth-client/preact/ui/forms25 composed forms — LoginForm, RegisterForm, PasswordResetRequestForm, TwoFactorEnrollment, SessionsList, MagicLinkRequestForm, DeleteAccountForm, AuditLogTable, UsersTable, AdminUserEditPanel, OrgRoleEditor, …
@vendidit/auth-client/preact/ui/flows7 end-to-end multi-step flows — CompleteLoginFlow, CompleteSignupFlow, CompletePasswordResetFlow, CompleteSsoCallbackFlow, CompleteAccountSecurityFlow, CompleteImpersonationFlow, CompleteOrgAdminFlow.

See the live catalog at auth-demo.vendidit.com.