Does this skill support XState v4?

No, this skill specifically targets XState v5 patterns and requires TypeScript 5.0 or higher to leverage the newest type inference features.

Can I use this for splitting machines into multiple files?

Yes, it includes specific patterns for using createStateConfig() and type-bound helpers to maintain type safety when modularizing large machines.

How does it handle narrowing event types in actions?

The skill provides patterns for using assertEvent() for union types and offers guidance on using dynamic parameters as a cleaner alternative for reusability.

What is the benefit of using the setup() pattern?

The setup() pattern is the standard XState v5 approach for providing type information for context, events, and actors, ensuring the machine configuration is fully typed without complex manual generics.

XState v5 TypeScript Patterns

Name: XState v5 TypeScript Patterns
Author: IlyaGulya

byIlyaGulya

0•

개발자 도구

Implements type-safe XState v5 state machines using modern TypeScript patterns and the setup() function.

This skill provides specialized guidance for building robust, type-safe state machines with XState v5. It leverages the latest TypeScript 5.0+ features and XState's setup() pattern to ensure full type inference for context, events, input, and output. Whether you are modularizing large machines with createStateConfig(), using type-bound helpers for external actions, or narrowing events with assertEvent(), this skill helps you maintain complete type integrity throughout your application's complex state logic.

주요 기능

01Advanced type utility implementation for ActorRefFrom and SnapshotFrom

020 GitHub stars

03Type-safe machine creation using the recommended setup() API

04Event narrowing and type guarding patterns using assertEvent()

05Modular action definitions using type-bound helpers (v5.22+)

06Automatic type inference for context, events, input, and output objects

사용 사례

01Refactoring existing XState machines to support full TypeScript type safety

02Building modular state logic across multiple files for large-scale applications

03Implementing complex actor-based systems with strictly typed inputs and outputs

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add ilyagulya/claude-marketplace xstate-typescript

For use in Claude.ai and ChatGPT

Download Skill