Generated by XState Viz: https://xstate.js.org/viz

machine.js

const lightMachine = Machine({
  // not a parallel machine
  id: 'light',
  initial: 'green',
  states: {
    green: {
      on: { TIMER: 'yellow' }
    },
    yellow: {
      on: { TIMER: 'red' }
    },

    // nested parallel machine
    red: {
      type: 'parallel',
      on:{ 
        TIMER: {target: 'green'}},
      states: {
        walkSign: {
          initial: 'solid',
          
          states: {
            solid: {
              on: { TIMER: 'turned_off'},
              on: { COUNTDOWN: 'flashing' },
              
            },
            flashing: {
              on: { STOP_COUNTDOWN: 'turned_off' }
            },
            
            turned_off: {
              type:'final'
            }
          }
        },
        pedestrian: {
          initial: 'walk',
          states: {
            walk: {
              on: { COUNTDOWN: 'wait' }
            },
            wait: {
              on: { STOP_COUNTDOWN: 'stop' }
            },
            stop: {
              type: 'final'
            }
          }
        }
      }
    }
  }
});