Skip to content
Version: XState v4

Assets

You can drag and drop assets on any state or upload them using the plus menu and Asset on any selected state.

Assets are valuable when you want to include use cases, features, workflows, and more to your state machines. One of our most frequent requests is from teams who want to tie their logic to real-life user interfaces, and assets provide a way to connect user interface design to logic in a way your whole team can understand.

Order of assets

The first asset, indicated by the star icon, is the asset shown on the canvas.

Further assets are accessible from the state Details panel, where you can also drag to reorder the assets and choose their displayed size.

Asset sizes

Once your asset is uploaded to your state, you can choose the display size from the Size menu that shows on hover over the asset, or from the dropdown menu in the state Details panel:

  • small sm
  • medium md
  • large lg
  • extra large xl