React
React hooks and the provider that read a client's state.
import { … } from "@monarcode/session-kit/react";Guide: Read the session in React.
Functions
createAuthHooks
Creates React hooks typed for one auth client. Use it when an app has several clients: each call has its own context, so call it once per client. With one client, register it and use useAuth, useAuthClient and AuthProvider instead.
useAuth
Reads the current auth state, or the part selector picks, and re-renders when it changes. With a selector, it re-renders only when that part changes.
useAuthClient
Returns the client of the nearest AuthProvider, for actions such as signIn and signOut. It's typed by the client you register in Register, from @monarcode/session-kit (ProvidedAuth).
useMirrorAuth
Creates a createMirrorAuth client once, from the session the page was rendered with, and keeps it in step with your server. Call it in the component that renders AuthProvider.
Components
AuthProvider
Gives a client to the hooks below it, and mounts it while rendered, which starts expiry timers and following other tabs. Render it once, around your app.
Types
AuthHooks
The provider and hooks createAuthHooks returns, typed for one client.
AuthHooksOptions
Options for createAuthHooks.
Prop
Type
AuthProviderProps
Props for AuthProvider, and for the one that createAuthHooks returns.
Prop
Type
AuthSource
What the React bindings need from an auth client: its state, and mount to start background work while rendered. A createAuth or createMirrorAuth client fits.
ProvidedAuth
The client AuthProvider takes and useAuthClient returns: the one you register in Register, from @monarcode/session-kit.
StateOf
The state type of a client: what useAuth() returns (AuthState).
UseMirrorAuthOptions
Options for useMirrorAuth.
Prop
Type