COMPONENT GALLERY
Every component, drawn from its own contract.
A card is a rendering of a registry entry: the state matrix is the rule's own wording, the timing is the motif's own duration and easing, and the colours are the published tokens. Nothing here restates a decision. Each page is static HTML, so it reads the same with scripting off and under every theme, and playback only repeats what the stills already show.
-
Actions and selection
5 components ·
C12W03 -
Inputs and validation
1 component ·
C13 -
Records and navigation
1 component ·
C14 -
Layers and dialogs
4 components ·
C15C26 -
Feedback at the source
3 components ·
C16 -
Instruments and readings
3 components ·
C08C18M03M10
How to read a card
- States. Each row is the visible treatment and the behaviour, written once in the rules.
- Filmstrip. Four stills of one transition. Play runs it once; Reduced crossfades; Static leaves it at the last frame.
- Timing. The duration, easing and properties come from the motif named on the card.
- Native counterpart. The existing component in each product, so a port starts from what is already there.