Skip to content
Version: XState v5

Initial states

When a state machine starts, it enters the initial state first. A machine can only have one top-level initial state; if there were multiple initial states, the machine wouldn’t know where to start!

In XState, the initial state is defined by the initial property on the machine config:

const feedbackMachine = createMachine({
  id: 'feedback',

  // Initial state
  initial: 'prompt',

  // Finite states
  states: {
    prompt: {
      /* ... */
    },
    // ...
  },
});

In our video player, paused is the initial state because the video player is paused by default and requires user interaction to start playing.

Initial states in XState​

More coming soon…