Usage
children.| Kind | Fields | Renders |
|---|---|---|
Text | text | A text node of the root. React escapes it, so <b> shows as characters |
Link | text, href | Link. A link with an unsafe protocol (javascript:, data:) is plain text, not a disabled link |
Mention | text, name | The visible text on a tinted run, hidden from assistive technology, and name read in its place |
Highlight | text, current? | Message's highlight (mark) inside an underline. Others are dashed; the current match is solid and aria-current |
Redaction | type, label? | A status fill with no visible text. The label is its visually hidden accessible text, read once, and sets the fill's width |
label on the segment, and redactionLabel on the body for the ones that have none. The label is accessible text only (visually hidden, read once), so sighted readers see the fill and screen reader users hear the label. The fill's width comes from the label, through a hidden copy of it, and never from the removed words, so it does not show how many characters were removed. Give the label a width you are happy to show: a short label makes a short fill.
The redaction is an inline run with the body's own font and line height and only inline padding, so one line is as tall as the text around it. A long label wraps between words like the rest of the body, and each line keeps the fill, padding and rounded corners. Under forced colors the fill becomes a Canvas fill with a CanvasText outline (dashed when automated), so its extent stays visible.
The original text is not in the value, so it is not in the page, the copy buffer, find-in-page or the accessibility tree. Message's own MessageRedaction is a different contract: it keeps the words, struck through, for the people who review them.
segments is the body. redactionLabel is the default label for a redaction. as is span (default, so it sits inside a Message) or p. type defaults to the Message body role and foreground to Inherit, so a bubble keeps its own foreground. Native span attributes pass through except style, children and event handlers. Pass dir="auto" when the root is user text outside a Message; Message's content block already sets it.
A highlight is washed (Message's warning or accent fill) and underlined. The underline is the text treatment that survives forced colors, a monochrome screen and color blindness, and it separates the current match (solid) from the others (dashed).
name is what a screen reader says in place of the visible text, such as "Mentioned: Medic 7". The visible text is aria-hidden, so a mention is read once. Find-in-page still finds the visible text.