1 viewer
Component · Data
SummaryList
Definition list with a fixed-width label column for label/value metadata rows.
- Category
- Data
- Slots
- 4
- States
- 0
- Writer
- Legacy
Preview
<SummaryList
items={[
{ key: "Execution ID", value: "exec-8a3f910b2c" },
{ key: "IR Hash", value: "sha256:d41d8cd98f00b204e9800998ecf8427e" },
{ key: "Steps Consumed", value: "12,450 / 250,000" },
{ key: "Settlement Status", value: "Manifold Confirmed" }
]}
title="Execution Summary"
/>Anatomy
The named parts of the rendered markup. Recipes style these hooks, and every renderer keeps them stable.
| Slot | DOM class |
|---|---|
| root | .primitive-summary-list |
| row | — |
| label | — |
| value | — |
States and platforms
The states the contract publishes, the platforms it declares, and the style recipes that dress it.
States
Platforms
Recipes
Renderers
The example above still needs shared writers for: SummaryList.
Declared adapters. A status is the manifest's declaration, not a measured parity result.
| Target | Renderer | Status |
|---|---|---|
| web | react | experimental |
Accessibility
Uses native <dl>/<dt>/<dd> elements so screen readers consume the rows as a definition list.
- Each row pairs a <dt> with exactly one <dd>; consumers must not nest extra structure.
- Label-column width is driven by a CSS custom property so all rows align without per-row overrides.