Response | Sodium design system

Sizes

The backfill wrote 1,204 partitions to wh_events.events_raw in 14 minutes. Three arrived after the 02:00 cutoff, so the daily rollup ran without them. See the run log for the times.
defaultdefault
The backfill wrote 1,204 partitions to wh_events.events_raw in 14 minutes. Three arrived after the 02:00 cutoff, so the daily rollup ran without them. See the run log for the times.
sm

Late partitions
2026-10-18/14, 02:07
2026-10-18/15, 02:11
2026-10-18/22, 02:31
list

Rerun the rollup for those hours:

SQL

select hour, count(*)from wh_events.events_rawwhere day = '2026-10-18'group by hour;

code

Partition Arrived Rows
2026-10-18/14 02:07 41,280
2026-10-18/15 02:11 39,904
2026-10-18/22 02:31 52,117
table
The rollup reads only partitions that land before 02:00.
That is why the three were left out.
quote

SQL

select hour, count(*)from wh_events.events_raw

open fence

When to use it

Use: An agent answers in Markdown, whole or as it streams: an explanation, a list of late partitions, a query.
Not for: A tool's raw output. Use Tool call.
Not for: One line of what the run is doing. Use Activity.

6 rules

Must: Append each delta to the same string and pass live while the stream is open; set live to false when it ends. Because Response paces an append, freezes every chunk but the tail, and drops the caret only when live turns false.
Never: Render the answer with dangerouslySetInnerHTML or a Markdown library's raw HTML. Because model output can hold script and javascript: links, and Response draws only its own elements and safe links.
Should: Ask the model to put tables, paths, IDs and partitions in backticks. Because inline code is mono on the well and keeps the name as written, where prose would break it at a hyphen.
Must: Expect **strong** to draw the selection wash, not a heavier weight; keep it to the one fact to find. Because Sodium has one weight, and a paragraph of washed words hides the one that mattered.
Never: Draw your own blinking caret after the answer. Because Response shows the typing caret only while live, and a caret at rest reads as a field waiting for input.
Should: Use size="sm" in a dense panel or a message beside tool rows, and the default on a run's page. Because 14/20 prose sits with 40px rows, where 15/24 would read as the page's lead.

4 checks

: The answer sets aria-busy while live; the caret is aria-hidden.
: Headings in the answer start at h3, under the page's and the message's own.
: Links are the dark gold in light (6.2:1) with an underline; an unsafe link is its label only.
: A code block's copy button is named by its language.

5 edge cases

Burst of text: Drains every 24ms in slices that grow with the backlog, cut at word edges.
Half-written link or a lone **: The link waits until it closes; the ** is closed for now.
Open code fence: Renders as a code block that grows as lines arrive.
Text replaced, not appended: Shows the new text at once.
Hidden tab or reduced motion: Shows the full text at once.

3 props

19 tokens