Chart gallery
Each chart is a <scxml-view src="…"> with a PlaybackClock. Click a transition label to send its event; play, pause and step with the controls.
Traffic light
Delayed <send>s drive the cycle; <cancel> on exit, and a counter in the datamodel. Source · Open in playground
Microwave
Two parallel regions, engine and door, coordinated with In(). It only cooks with the door closed. Source · Open in playground
Media player
A <parallel> transport and sound, and a <history> that remembers whether it was muted. Source · Open in playground
Sign in
Guards on event data and <assign>: the smallest useful chart. Clicking login sends {user: 'ada'} (set with the event-data attribute). Source · Open in playground