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 changeStep = assign({
  currentStep: (context, event) => {
    return context.currentStep + 1;
  }
});

const multiStepMachine = Machine(
  {
    id: 'MultiSteps',
    initial: 'showing',
    context: {
      steps: [0, 1, 2],
      currentStep: 0
    },
    states: {
      showing: {
        on: {
          NEXT: {
            target: '',
            actions: ['changeStep']
          },
          SKIP: {
            target: '',
            actions: ['changeStep']
          },
          END: 'finish'
        }
      },
      finish: {
        type: 'final'
      }
    }
  },
  {
    actions: {
      changeStep,
    }
  }
);