Selected States
Understanding how state selection works and how active states are resolved in hierarchical state machines.
Active State Resolution
When you select a state in the diagram or trigger a transition, Statefully automatically resolves to the deepest active leaf state. This follows proper hierarchical state machine semantics.
Note
How Selection Works
1. Clicking a State
When you click a state in the diagram:
- If it's a leaf state, it becomes selected directly
- If it's a compound state, the system finds its initial child and selects that
- The entire path from root to the selected state is shown as "active" (highlighted)
2. Clicking a Transition
When you click a transition link (e.g., "start → Running"):
- The system looks up the target state
- If the target is a compound state, it resolves to the initial leaf
- The preview updates to show the new state's prototype
Visual Indicators
The diagram uses different visual styles to show state status:
The currently active leaf state (inverted colors)
Ancestor states in the path to the selected state (gray background)
States not in the current active configuration (outlined only)
Initial States
Mark a state as the initial/default with an asterisk (*). When entering a parent state, the initial child becomes active automatically.
Tip
Parallel States
Mark a state with ampersand (&) to make all its children active simultaneously. This is useful for modeling independent concerns that can operate in parallel.
In this example, the Player state has two parallel regions: Playback and Volume. The user could be in "Playing + Muted" or "Paused + Normal" simultaneously.
Try It Out
Click on states and transitions in the diagram below to see how selection works:
State Diagram
Preview