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

machine.js

const VendingMachine = Machine({
  id:'vendingMachine',
  initial:'idle',
  context:{
    deposited:0
  },
  states:{
    idle:{
      on:{
        SELECT_ITEM:{
          target:'vending',
          cond:'depositedEnough'
        },
        DESPOSIT_QUATERS:{
          actions:['addQuaters']
        }
      }
    },
    vending:{}
  }
},{
  actions:{
    addQuaters:assign({
      deposited:context => context.deposited + 25
    })
  },
  guards:{
    depositedEnough:(context,event) => 
    {
      
      return context.deposited >= 100
    }
  }
})