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

machine.js

const Guard = {
  EMAIL_BAD_FORMAT: () => true,
  PASSWORD_BAD_FORMAT: () => true,
  EMPTY: () => true,
}
  
const fetchMachine = Machine({
  id: 'login',
  initial: 'init',
  states: {
    init: {
      on: {
        EMAIL_INPUT_FOCUS: 'emailInputFocused',
        PASSWORD_INPUT_FOCUS: 'passwordInputFocused',
      },
    },
    emailInputFocused: {
      on: {
        TYPE_EMAIL: [
          {
            cond: Guard.EMPTY,
            target: 'emailInputFocused.empty',
          },
          {
            cond: Guard.EMAIL_BAD_FORMAT,
            target: 'emailInputFocused.badFormat',
          },
          'valid'
        ],
      },
      states: {
        empty: {},
        badFormat: {},
        valid: {},
      },
    },
    passwordInputFocused: {
      on: {
        TYPE_PASSWORD: [
          {
            cond: Guard.EMPTY,
            target: 'passwordInputFocused.empty',
          },
          {
            cond: Guard.PASSWORD_BAD_FORMAT,
            target: 'passwordInputFocused.badFormat',
          },
          'valid'
        ],
      },
      states: {
        empty: {},
        badFormat: {},
        valid: {},
      },
    },
    submitting: {

    },
  },
});