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

machine.js

const multiColor = Machine({
  id: "multiColor",
  initial: "unlit",
  context:{
    color:'#000'
  },
  states: {
    unlit: {
      on: {
        BREAK: "broken",
        TOOGLE: "lit"
      }
    },
    lit: {
      on: {
        BREAK: "broken",
        TOOGLE: "unlit",
        CHANGE_COLOR:{
          actions:['changeColor']
        }
      }
    },
  
    broken: {}
  }
},{
  actions:{
    changeColor:assign((context,event)=>({
            color:event.color
          }))
  }
});