skills.rest
hasna
hasnaOFFICIAL
Explore all skills by this author →
WebsiteGitHub

zustand

Map Zustand vanilla stores to json-render's StateStore interface with typed adapters.

Updated Jun 24, 2026
Search Tags:#state management#react#zustand#adapter#json-render#generative ui#vanilla store
One-click install
npx skills add https://github.com/hasna/render --skill zustand-hasna
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: zustand
Source: https://github.com/hasna/render/tree/main/skills/zustand
Command: npx skills add https://github.com/hasna/render --skill zustand-hasna

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill eliminates the need to build custom state adapters for json-render when your project already uses Zustand for global state management, bridging the gap between Zustand's vanilla store API and json-render's required StateStore interface.

Core Features & Use Cases

  • Zustand StateStore Adapter: Provides a typed zustandStateStore function that maps any Zustand vanilla store to json-render's StateStore contract.
  • Nested State Support: Includes optional selector and updater parameters to work with nested state slices in complex Zustand store structures.
  • Use Case: For React or React Native apps using json-render for generative UI that already rely on Zustand for global state, this Skill lets you reuse your existing Zustand store instead of setting up a separate state solution for json-render.

Quick Start

Use the zustand skill to connect your existing Zustand vanilla store to a json-render StateProvider for shared state management across your generative UI components.

Frequently Asked Questions about zustand

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

FAQPage Schema
How do I connect a Zustand store to json-render for generative UI?▼

You can connect a Zustand store to json-render by using a typed adapter function that maps the Zustand vanilla store API to json-render's StateStore interface, eliminating the need for custom adapter development.

Do I need to write a custom state adapter for json-render if I already use Zustand?▼

No, you do not need to write a custom state adapter. This integration provides a pre-built zustandStateStore function that directly bridges your existing Zustand vanilla store with json-render's required StateStore contract.

Can I use this Zustand state adapter with React Native generative UI projects?▼

Yes, this state adapter works with React Native generative UI projects. It supports any json-render renderer, allowing you to reuse existing Zustand global state across your React or React Native components.

How does the Zustand adapter handle nested state slices in a vanilla store?▼

The Zustand adapter handles nested state slices by accepting optional selector and updater parameters. This allows you to target and update specific nested portions of complex state structures within your vanilla store.

What is the best way to share Zustand global state across json-render StateProvider components?▼

The best way to share Zustand global state is to pass the mapped vanilla store into the json-render StateProvider. This allows all generative UI components to access and update the shared state seamlessly.

Related Skills

Explore More Software Engineering Skills→
hasnaxyzhasnaxyz

zustand

Connect json-render state management to Zustand vanilla stores.

Official
Intermediate
pch007pch007
1

jotai

Connect json-render's StateStore to a writable Jotai atom.

Community
Intermediate
pch007pch007
1

react-native

Render JSON-driven UI specifications as native React Native components.

Community
Advanced
xztxyxztxy

zustand

Integrate Zustand vanilla stores as the backend for json-render's StateStore interface.

Community
Intermediate