Skip to content
Version: XState v4

Parent states

States can contain more states, also known as child states. These child states are only active when the parent state is active.

Child states are nested inside their parent states.

In the video player above, the Opened state is a parent state to the PlayingPaused, and Stopped states. These states, their transitions, and their events are nested inside the Opened state.

Add a child state

First, select your machine or an existing state where you want to create the child state. Then…

  • Use the + State button that appears above the selected state to create a nested child state. Or…
  • If a state already contains child states, you can double-click inside the parent state to create another child state.

Change the parent state of a child state

Using the State details panel:

  1. Select the child state you want to reparent.
  2. Open the State details panel from the right tool menu.
  3. Choose your desired new parent from the Parent dropdown menu.