Usage
| The value is | Use |
|---|---|
| On its way | PendingValue |
| Known to be empty (nothing to show) | EmptyText |
| Failed to load | The component's error state (a data list value's error, a field error) |
label is required copy. It is the visible text while pending and what a screen reader reads. pending says whether the value has arrived. When pending turns false the children swap in place.width: Short, Medium or Long keep at least 4rem, 8rem or 12rem of inline size. Choose by what the value looks like: a code or a count, a name or a phone number, an address or an email. The default keeps the label's width.lines: Two or Three keep that many lines of block size for a value that wraps. The default is one line.pending is true are not shown, but they still take up space. Pass the previous value while a refresh is in flight and the host keeps its exact size.appearance={PendingValueAppearance.Skeleton} to show a Skeleton line instead; the label is then read by assistive technology but not shown, and width defaults to Medium because there is no text to measure. Use the skeleton appearance where the surrounding list already reads as a loading placeholder.placeholder replaces the visible text with a short stand-in, such as an ellipsis, while label is still what is read. It has no effect in the skeleton appearance.type sets the role of the label and of the arrived value together (default Body, the role of DataList values and of EmptyText). Pass the role of the text around the value, Code1 in a mono list for example, so the label and the value share a line height. foreground colors only the pending label (default Subtle); the arrived value takes the color of the surrounding text.Text and value, and set foreground={Foreground.Inherit}:units roll through Text's odometer.announcement for a value the person is waiting on, such as an address that unlocks dispatch:pending turns from true to false, and never on the first render.span, so it goes anywhere a value goes: as the children of a DataListValue, in a card row, or in a sentence. Match type to the surrounding role.@prepared911/ui/styles.css once at the document root.