Original visual register

All ten SVG diagrams were authored for this course on 2026-10-14. They contain original vector shapes and text, with no external images or embedded fonts. Each SVG has a title and description; each lesson image has meaningful alternative text and a visible explanatory caption. The editable source generator is qa/make_visuals.py. No third-party visual license is needed for copied content because none is included.

• toolchain.svg: Authored TSX is checked by TypeScript separately from Vite transformation; browser JavaScript is the transformed output.
• component-flow.svg: A parent supplies typed values to a pure component that describes semantic elements.
• data-boundary.svg: Unknown JSON passes shape, field and unique-ID checks before becoming trusted records.
• state-map.svg: User choices become state; records and controls derive a list and count together.
• list-identity.svg: Crossing arrows connect identical event IDs before and after reordering; positions change while identity remains.
• form-flow.svg: Synthetic fields lead to local validation and feedback, with no outgoing submission.
• effect-decision.svg: Three separate logic categories lead to render calculation, event handler or external synchronization.
• load-machine.svg: Fixture selection starts loading, then success or error; retry begins another attempt while obsolete work is ignored.
• route-map.svg: A hash URL selects explore, saved or event detail screens; unknown paths have recovery.
• test-layers.svg: Types, rule tests, DOM interactions, build checks and human browser acceptance support different claims.

All diagrams were rasterized and visually inspected for text clipping and readable flow. This is asset-level inspection, not evidence of final browser layout, zoom behavior or assistive-technology acceptance.