Auth State

The SDK tracks the user’s authentication status through a three-state machine. You can read the current state at any time or listen for changes using the event system.

States

State	Meaning
"disconnected"	No user is logged in. Calling getAddress() will throw.
"connecting"	Login is in progress. The widget is open and waiting for the user.
"connected"	The user is authenticated. Wallet info is available.

Reading state

const state = auth.getAuthState();
// Returns "disconnected" | "connecting" | "connected"

Listening for changes

auth.on('stateChange', (newState) => {
  if (newState === 'connected') {
    console.log('User is now logged in');
  } else if (newState === 'disconnected') {
    console.log('User logged out');
  }
});

The stateChange event fires every time the state transitions. It does not fire if the state doesn’t change (for example, calling logout() when already disconnected).

State transitions

disconnected  →  connecting  (login() called)
connecting    →  connected   (authentication succeeds)
connecting    →  disconnected (authentication fails or times out)
connected     →  disconnected (logout() or destroy() called)

Putting it all together

Here’s a pattern you might use in a React app to keep a UI in sync with auth state:

const [authState, setAuthState] = useState(auth.getAuthState());

useEffect(() => {
  const unsubscribe = auth.on('stateChange', setAuthState);
  return unsubscribe; // Removes the listener on cleanup
}, []);

// In JSX:
// authState === 'connected'     → show wallet UI
// authState === 'connecting'    → show loading spinner
// authState === 'disconnected'  → show login button

The on() method returns a function that removes the listener when called. Use this to clean up in useEffect return values or component teardowns.