Skip to content

Visualizer for XState machines [WIP adapted for XState 5]

License

Notifications You must be signed in to change notification settings

JQuezada0/xstate-viz

 
 

Repository files navigation

XState (Legacy) Visualizer

Note

Visualize XState5 state machines and statecharts in real-time.

This is a WIP fork to update xstate to v5

Everything below this point is from the original repo's readme


Usage

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

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

  1. Clone this GitHub repo
  2. Run yarn install
  3. Run yarn start and visit localhost:3000/viz

Releases

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

About

Visualizer for XState machines [WIP adapted for XState 5]

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 98.5%
  • SCSS 1.3%
  • Other 0.2%