QrFallbackRow
The QR fallback entry (Figma "QR Fallback Row" 2130:12353): the QR stays a fallback under "Vocês estão juntos agora?" (D3); the default pairing is the phone-number code.
A top rule, the question, and an Outline 40 "Mostrar QR" that drops under the text when the row is narrow.
<QrFallbackRow side="guardian" question="Vocês estão juntos agora?" body="Se a Lia estiver do seu lado, dá pra conectar pelo QR no celular dela." actionLabel="Mostrar QR" onShowQr={open} />Playground
Um preset por valor do primeiro eixo do Figma. Mude as props; dsState força hover, foco ou pressionado, como na matriz.
QR Fallback Row
Variantes, tamanhos e estados
Cada célula é o componente real, marcada com a variante do Figma que reproduz (passe o mouse pra ver o node).
Side · Dependent
| QR Fallback Row |
|---|
Vocês estão juntos agora? |
Side · Guardian
| QR Fallback Row |
|---|
Vocês estão juntos agora? Se a Lia estiver do seu lado, dá pra conectar pelo QR no celular dela. |
Props
As props que o arquivo do DS declara. O componente também repassa as do primitivo (base-ui), quando ele tem um.
| Prop | Tipo | Padrão | Descrição |
|---|---|---|---|
| side? | "dependent" | "guardian" | "dependent" | Figma "Side": Dependent (question only, on the person's phone) or Guardian (question + body, on the guardian's waiting screen). |
| question | string | — | Figma `question` ("Vocês estão juntos agora?"). |
| body? | string | — | Figma `body`, shown on Side=Guardian. |
| actionLabel | string | — | The button label ("Mostrar QR"). |
| onShowQr? | (() => void) | — | Opens the QR fallback. |
| className? | string | — |
PairingVerificationCode
The anti-hijack check on the guardian side (Figma "Pairing Verification Code" 2130:12321): the 4 digits must match the ones on the person's phone.
QueueCard
The connection queue card (Figma "Queue Card" 188:1708): the place in line and a word estimate in a polite live region while Waiting, then Your turn, then Reserved with the clock time and an explicit way back to the line.