This repository has been archived by the owner on Feb 25, 2024. It is now read-only.

XState (Legacy) Visualizer

Visualize XState state machines and statecharts in real-time.

🪄 Use the new Stately visual editor 🔗 Use the legacy Visualizer.

Usage

Visit stately.ai/viz to use the Visualizer.

Alternatively, you can install it locally (see installation)

Features

Create XState machines in JavaScript or TypeScript right in the visualizer
Simulate machines visually by clicking on events
Pan and zoom into the visualized machine
View current machine state
View list of events sent to the simulated machine
Access quick features via the command palette: cmd/ctrl + k
Inspect machines by setting url: 'https://stately.ai/viz?inspect' in @xstate/inspect

Installation

Clone this GitHub repo
Run yarn install
Run yarn start and visit localhost:3000/viz

Releases

https://www.loom.com/share/5357e00577e64387b45de8ee65cb3805