xstate-solidjs

Integrate XState v5 machines and stores with SolidJS components using hooks.

Updated Feb 12, 2026

Search Tags:#typescript #state management #frontend #reactivity #xstate #solidjs

Ready to run

npx skills add https://github.com/IlyaGulya/claude-marketplace --skill xstate-solidjs

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: xstate-solidjs
Source: https://github.com/IlyaGulya/claude-marketplace/tree/main/plugins/xstate/skills/xstate-solidjs
Command: npx skills add https://github.com/IlyaGulya/claude-marketplace --skill xstate-solidjs

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill simplifies the integration of XState state machines and stores with SolidJS applications, enabling declarative state management and reactive UI updates.

Core Features & Use Cases

Declarative State Management: Manage complex application states using XState machines within SolidJS components.
Reactive State Binding: Seamlessly connect XState actors and stores to SolidJS signals for automatic UI updates.
Use Case: Integrate a complex user onboarding flow managed by an XState machine into a SolidJS application, ensuring the UI accurately reflects the current step and user interactions.

Quick Start

Use the xstate-solidjs skill to integrate the provided toggleMachine into a SolidJS component using the useActor hook.

Frequently Asked Questions about xstate-solidjs

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I integrate XState v5 machines with SolidJS components?▼

You can integrate XState v5 machines with SolidJS components using dedicated hooks like useActor and useActorRef, which connect actors to Solid signals for reactive state management and automatic UI updates.

What is the best way to manage complex state reactively in SolidJS?▼

Managing complex state reactively in SolidJS is best achieved by binding XState machines to components, using declarative state management to ensure the UI accurately reflects the current state step and user interactions.

Does XState work with SolidJS for state matching and control flow?▼

XState works with SolidJS by supporting state matching directly within Solid's control flow, allowing you to declaratively render UI components based on the current state of your XState machines.

Can I use context providers and spawned actor lists in SolidJS with XState?▼

Yes, you can use context providers and manage spawned actor lists in SolidJS with XState, utilizing patterns that facilitate connecting multiple spawned actors to Solid components via fromActorRef.

How do I bind XState stores to SolidJS signals for UI updates?▼

You bind XState stores to SolidJS signals for UI updates by connecting the actors to your components, enabling automatic reactive updates whenever the underlying machine state changes.