1 viewer
Component · Input
Select
Single-selection listbox with optional search.
- Category
- Input
- Slots
- 6
- States
- 4
- Writer
- Shared
Preview
<Select
default="L1-STARK"
label="Execution Verification Tier"
name="tier"
options={[
{ label: "L0 — Signature Only", value: "L0-Signature" },
{ label: "L1 — Zero-Knowledge STARK Proof", value: "L1-STARK" },
{ label: "L2 — Full Multi-Party Replay", value: "L2-Replicated" }
]}
/>Anatomy
The named parts of the rendered markup. Recipes style these hooks, and every renderer keeps them stable.
| Slot | DOM class |
|---|---|
| root | .primitive-select |
| label | — |
| trigger | — |
| value | — |
| listbox | — |
| option | — |
- Hydration markers
- data-cre8-control
States and platforms
The states the contract publishes, the platforms it declares, and the style recipes that dress it.
States
Platforms
Recipes
Renderers
Every tag in the example above renders through a shared writer.
Declared adapters. A status is the manifest's declaration, not a measured parity result.
| Target | Renderer | Status |
|---|---|---|
| web | react | experimental |
| runtime-node | view-node | ready |
| ssr | html-form-control | ready |
| terminal | terminal-form-control | planned |
| native | native-adapter | experimental |
Accessibility
Trigger and listbox expose selected, active, expanded, labelled, and invalid states.
- Keyboard users can open, move, choose, and dismiss options.
- Selected and active options are exposed independently.
- Help text and validation errors stay linked to the trigger through ids.