SKILL.md
$27
// 2. Create the json-render StateStore adapter
const store = jotaiStateStore({ atom: uiAtom });
// 3. Use it
{/ json-render reads/writes go through Jotai /}
### With a Shared Jotai Store
When your app already uses a Jotai `<Provider>` with a custom store, pass it so both json-render and your components share the same state:
import { atom, createStore } from "jotai";
import { Provider as JotaiProvider } from "jotai/react";
import { jotaiStateStore } from "@json-render/jotai";
import { StateProvider } from "@json-render/react";
const jStore = createStore();
const uiAtom = atom<Record<string, unknown>>({ count: 0 });
const store = jotaiStateStore({ atom: uiAtom, store: jStore });
<JotaiProvider store={jStore}>
<StateProvider store={store}>
{/ Both json-render and useAtom() see the same state /}
</StateProvider>
</JotaiProvider>