@json-render/devtools-solid

What your AI can do with it

• Install @json-render/devtools-solid in a SolidJS json-render app
• Mount the JsonRenderDevtools component inside a SolidJS json-render provider
• Inspect specs and edit state from the devtools panel
• View action and stream timelines
• Browse catalogs and pick DOM elements
• Troubleshoot devtools-solid setup and configuration

Getting started

1. Have a SolidJS app that uses json-render.
2. Install the @json-render/devtools-solid package.
3. Mount the JsonRenderDevtools component inside the SolidJS json-render provider.
4. Open the app and use the panel to inspect specs, edit state, view timelines, browse catalogs, or pick DOM elements.

What this skill tells your AI

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

npm install @json-render/devtools @json-render/devtools-solid

import { JsonRenderDevtools } from "@json-render/devtools-solid";

<JSONUIProvider registry={registry}>
  <Renderer spec={spec()} registry={registry} />
  <JsonRenderDevtools
    spec={spec()}
    catalog={catalog}
    messages={messages()}
  />
</JSONUIProvider>;

Signals

GitHub stars

18k

Forks

978

Last commit

Sep 2026

ahel review

• K1binfo
  installs-packages

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

Questions

What is devtools-solid?

It is a skill for adding, configuring, or troubleshooting the SolidJS adapter for the json-render devtools inspector.

What can the devtools panel do?

It lets developers inspect specs, edit state, view action and stream timelines, browse catalogs, and pick DOM elements.

Does the devtools panel render in production builds?

No, it renders nothing in production builds.

Where do I mount the JsonRenderDevtools component?

Inside a SolidJS json-render provider.