ChatThread
A conversation with citations.
What slipped on the mobile release this week?
Two things. Offline sync is in review and the crew-interview notes are late.
Can you draft a note for the crew?
Drafting a note for the crew
Try “What is due this week?”What slipped on the mobile release this week?
In context
What is due on 24 Oct?
Harbour launch at 09:00. The launch checklist is still open.
Bubbles variant
What does the Church teach about grace?
Grace is the free and undeserved help that God gives us.
1 more citations
What is grace?
I am concerned about you. Please reach out to someone you trust right now.
One more question please
The Eucharist is the source and summit.
Chip
Footer, Latest pill, crisis tone
Why do we confess our sins to a priest and not straight to God?
Because Jesus gave the Apostles that ministry: ΓÇ£Whose sins you shall forgive, they are forgiven themΓÇ¥ (John 20:23). The priest acts in the person of Christ, and you are also free to speak to God directly at any time.
Can I just tell God and skip it?
You can and should speak to God directly, but Christ also instituted the sacrament of Reconciliation for mortal sin (CCC 1456).
What do I say at the start?
“Bless me, Father, for I have sinned. It has been [time] since my last confession.” Then name your sins plainly.
I feel like I can’t go on.
IΓÇÖm really sorry youΓÇÖre hurting. You donΓÇÖt have to carry this alone. If you might harm yourself, please call your local emergency number or a crisis line now.
I can’t help with that request, but I can point you to what the Church teaches.
Reached the latest message 0 times.
Props
| Prop | Type | Required | Default |
|---|---|---|---|
messages | ChatMessage[] | Yes | — |
isTyping | boolean | undefined | No | — |
onRetry | ((message: ChatMessage) => void) | undefined | No | — |
emptyMessage | string | undefined | No | — |
markdown | boolean | undefined | No | true |
bionic | boolean | undefined | No | — |
bionicOptions | BionicOptions | undefined | No | — |
align | "sides" | "start" | undefined | No | sides |
scrollToLatest | boolean | { label: string; threshold?: number | undefined; icon?: ReactNode; } | undefined | No | — |
variant | "default" | "bubbles" | undefined | No | default |
moreCitationsLabel | ((count: number) => string) | undefined | No | — |
afterMessages | ReactNode | No | — |
onReachLatest | (() => void) | undefined | No | — |
Accessibility
The transcript auto-scrolls only while the reader is already at the bottom; otherwise a "new messages" button appears instead of yanking them down. With sender, role: "system" or align="start" the thread becomes a labelled role="list" so a screen reader hears each speaker in order. The retry affordance on an errored message is a real button.
data-rebar-* attributes
data-rebar-component="chat-thread"; each message carries data-rebar-role and data-rebar-status (and data-rebar-tone="highlight" when tinted); the thread carries data-rebar-align="start" when set; parts include bubble, meta, byline, sender, header, actions, retry-button and typing-indicator.
Migrating to Ant Design
Not codemod-covered: AntD ships no chat transcript. A migration composes List + Avatar + Spin, or adopts Ant Design X.
afterMessages slot
afterMessages renders inside the scroller below the last message and the typing indicator (suggested replies, a follow-up row, a help card), so it scrolls with the transcript.
<ChatThread messages={messages} afterMessages={<SuggestedReplies />} />