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

machine.js

  const replMachine = Machine({
    id: 'replMachine',
    initial: 'repl',
    context: {
      cursor: 0,
      data: [1,2,3,4,5]
    },
    states: {
      repl: {
        on: {
          ENTER_KEY: 'parsing'
        }
      },
      parsing: {
        on: {
          SUCCESS: 'readMore',
          ERROR: 'error'
        }
      },
      readMore: {
        on: {
          SPACE_KEY: [
            {
            target: 'readMore',
            cond: 'notOnLastPage',
            actions: ['cursorIncrement']
            },
            {
              target: 'repl',
              actions: ['cursorReset']
            }
          ],
          readAll: {
            target: 'repl',
            actions: ['cursorReset']
          }
        }
      },
      error: {
        on: {
          '': {
            target: 'repl',
            actions: ['printError']
          }
        }
      }
    }
  },
  {
    actions: {
      cursorIncrement: assign({
        cursor: context => context.cursor + 1,
      }),
      cursorReset : assign({
        cursor: context => context.cursor = 0,
      }),
      printError: () => console.log('Some Error occured!')
    },
    guards: {
      'notOnLastPage': (context,event) => context.cursor < context.data.length 
    }
  });