@json-render/xstate

SkillCloud & infra

Lets your agent connect -render apps to XState for managing app state.

Available today. Use it from your connected AI after setup.

Connect ahel once, and every AI you use reads what you have installed.

Then ask your AI: use the @json-render/xstate skill

About this capability

XState Store adapter for json-render's StateStore interface. Use when integrating json-render with @xstate/store for state management via @json-render/xstate.

What this skill tells your AI

The instructions your AI receives, as published by vercel-labs/json-render in skills/xstate/SKILL.md and read by ahel’s review.

XState Store adapter for json-render's StateStore interface. Wire an @xstate/store atom as the state backend for json-render.

Installation

npm install @json-render/xstate @json-render/core @json-render/react @xstate/store

Requires @xstate/store v3+.

Usage

import { createAtom } from "@xstate/store";
import { xstateStoreStateStore } from "@json-render/xstate";
import { StateProvider } from "@json-render/react";

// 1. Create an atom
const uiAtom = createAtom({ count: 0 });

// 2. Create the json-render StateStore adapter
const store = xstateStoreStateStore({ atom: uiAtom });

// 3. Use it
<StateProvider store={store}>
  {/* json-render reads/writes go through @xstate/store */}
</StateProvider>

API

xstateStoreStateStore(options)

Creates a StateStore backed by an @xstate/store atom.

OptionTypeRequiredDescription
atomAtom<StateModel>YesAn @xstate/store atom (from createAtom) holding the json-render state model

Signals

GitHub stars
16k
Forks
874
Last commit
Sep 2026

ahel review

  • K1binfo
    installs-packages

Automated review, not a security audit. Ruleset v1+k2.

Advanced
Catalog kind
skill
Gateway key
xstate-vercel-labs
Source
github.com/vercel-labs/json-render