mirror of https://github.com/vercel-labs/json-render.git synced 2026-10-03 12:28:17 +08:00

Files

T

History

Chris Tate 3ad3818811 chore(release): prepare v0.21.0 (#344 )

- Bump all public packages to 0.21.0 and document release highlights

- Add missing devtools adapter skills and update web documentation

- Validate version synchronization and workspace type safety

2026-09-18 13:44:50 -05:00

src

devtools (#273 )

2026-04-17 14:29:04 -05:00

package.json

chore(release): prepare v0.21.0 (#344 )

2026-09-18 13:44:50 -05:00

README.md

devtools (#273 )

2026-04-17 14:29:04 -05:00

tsconfig.json

devtools (#273 )

2026-04-17 14:29:04 -05:00

tsup.config.ts

devtools (#273 )

2026-04-17 14:29:04 -05:00

README.md

@json-render/devtools-react

React adapter for the json-render devtools. Drop-in <JsonRenderDevtools /> component.

Installation

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

Peer dep: react@^19.

Usage

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

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

Floating toggle appears bottom-right.
Hotkey: Ctrl/Cmd + Shift + J.
Tree-shakes to null in production builds.

Imperative API

import { useJsonRenderDevtools } from "@json-render/devtools-react";

const devtools = useJsonRenderDevtools();
devtools?.open();
devtools?.toggle();
devtools?.recordEvent({ kind: "stream-text", at: Date.now(), text: "hi" });

See the devtools docs for the full prop reference and panel tour.

License

Apache-2.0