Sign in handoffPro
The pause where the human signs in and hands control back to the agent.
On this page
ProTake over, sign in, hand back: the relay line follows control.
Installation
Usage
import { SignInHandoff } from "@/components/ui/chatcn/pro/sign-in-handoff"
<SignInHandoff state={state} site="Tallyroom" url={loginUrl} onTakeOver={takeOver} onHandBack={handBack} />A relay line shows who holds the browser: the agent, you, then the agent again. It pairs with the agent browser frame: map needed to paused, user to user and checking to agent.
Examples
States
ProEvery step of the handoff.
Props
| Prop | Type | Notes |
|---|---|---|
state | "needed" | "user" | "checking" | "done" | "failed" | "skipped" | |
site, url, reason | Which sign-in and why | |
waitingSince | number | Live wait time |
account, nextStep | Shown once done | |
onTakeOver, onHandBack, onSkip | () => void |
Accessibility
- The relay line is an ordered list with the current holder named.
- State changes are announced politely.
Motion
- The relay segment fills with scaleX, 280 ms, and is instant under reduced motion.