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

machine.js

// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
// - XState (all XState exports)

const mobAlive = (context, event) => {
  return false;
};

const heroAlive = (context, event) => {
  return true;
};

const mobState = {
  id:'mob',
  initial:'attack',
  states: {
    attack: {
      on: {
        NEXT: [
          {
            target: '#battle.hero',
          },
        ],
      },
      activities: ['animateMobAttack', 'animateHeroDefend'],
    },
  },
};

const heroState = {
  id:'hero',
  initial:'idle',
  states: {
    idle: {
      on: {
        ATTACK: 'attack',
        FLEE: '#battle.heroFlee',
      },
    },
    attack: {
      on: {
        NEXT: [
          {
            target: '#battle.mob',
  
          },
 
        ],
      },
      activities: ['animateHeroAttack', 'animateMobDefend'],
    },
  },
};
const machine = Machine(
  {
    id: 'battle',
    initial: 'idle',
    context: {},
    states: {
      idle: {
        on: {
          HERO_STARTS: 'hero.idle',
        },
      },
      hero: { ...heroState },
      mob: { ...mobState },
      heroWin: {
        type: 'final',
      },
      heroFlee: {
        type: 'final',
      },
      heroDie: {
        type: 'final',
      },
    },
  },
  {
    activities: {
      animateHeroAttack: () => console.log('animateHeroAttack'),
      animateMobDefend: () => console.log('animateMobDefend'),
      animateMobAttack: () => console.log('animateMobAttack'),
      animateHeroDefend: () => console.log('animateHeroDefend'),
    },
    guards: {
      heroAlive,
      mobAlive,
    },
  }
);