We're excited to announce the release of XState Store v3! This new version brings improved state management capabilities with better TypeScript support and a more streamlined API.

WebinarGeek leans on Stately tooling to manage the inherent complexities in building the best user-friendly webinar platform on the internet.

The term "robots" invokes a fascinating range of ideas, from manually controlled machines to automated software that crawls the web. One of the prime examples in this area is robotic arms, traditionally used to aid and extend the reach of humans in manufacturing, surgery, and space exploration. Each of these use cases require some way of programming and controlling the arm to perform their dedicated task, usually with proprietary software developed by the manufacturer. The UI is tightly coupled to the hardware through a touchscreen device or desktop application physically connected to the arm, which makes it tough to put online securely and using modern technology.

Viam provides an open source software stack and set of cloud services that makes managing all types of robots (and other smart machines) accessible to developers without any prior hardware experience. To help demonstrate the types of experience that can be built with Viam, the developer advocacy team built an arcade claw game that used an industrial robot arm and arcade claw that could be operated using a single-page web application powered by TypeScript SDK.

Does the world need another state management library? Probably not, but if you've been interested in XState, you're going to want to check this one out.

XState Store is a simple & tiny state management library largely inspired by XState. If you just need a way to update data in a store and subscribe to changes in the store, XState Store is for you. It is:

• Extremely simple. Provide initial context and transition functions to the createStore(…) function, and you're good to go.
• Extremely small. Less than 1kb minified and gzipped.
• XState compatible. Shares actor APIs with XState, making integration/migration easy if (when) you need to handle more complexity.
• Extra type-safe. Written in TypeScript, it provides strong event and snapshot types, automatically inferred from your context and transitions.
• Event-based. Works just like XState; send events to trigger transitions.
• Immer ready. Easily add Immer for "mutable" context updates with createStoreWithProducer(producer, …).

In the last few weeks, we’ve released single-file GitHub pull requests, machine sorting, and many other improvements and bug fixes.

Watch our latest office hours live stream where we cover single file GitHub pull requests, sorting machines, Stately Agent, updates to XState and more.

XState is a versatile state management & orchestration library that works with any framework, including React with the @xstate/react package. For many apps, managing global state is a requirement, and there are many options for sharing global state in React, like using React Context or libraries like Redux, MobX, and Zustand.

The @xstate/react package makes it simple to manage component-level state with hooks like useMachine() and useActor(), but it works equally well for managing global state 🌎

You use XState in your codebase, and you want to make a change to a state machine. You don’t want to touch any code but want to make a pull request back to GitHub. Our single file import feature lets you do it all in the browser.

We recently announced the release of XState v5! During its beta phase, we created a migration guide, specifically to call out breaking changes and to give developers onging updates regarding API changes. This post is a walkthrough of migrating existing XState machines from v4 to v5 and is intended to be more of a step-by-step companion to the migration guide. It also focuses on migrating XState machines that are using TypeScript.

Embedding Figma frames has arrived in Stately Studio! We’ve also made more improvements and squashed some bugs. And have you tried Stately Agent yet?