Compare commits

...
Author SHA1 Message Date
github-actions[bot] caa90b8b84 chore: version packages (#204)
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
2026-03-11 02:19:24 -05:00
Chris Tate 54a1ecf817 Add v0.12.1 release changeset with mode renames and MCP fixes (#203)
This PR adds the changeset file to prepare for the v0.12.1 release, documenting important breaking changes and bug fixes.

## Changes

**@json-render/core**
- Renamed generation modes from `"generate"`/`"chat"` to `"standalone"`/`"inline"` (old names deprecated with warnings)

**@json-render/mcp**  
- Fixed React duplicate module error causing `useRef` to return null by adding Vite `resolve.dedupe` configuration
- Added `./build-app-html` export entry point

**Other improvements**
- Updated homepage URLs across all packages to https://json-render.dev
- Reorganized skills directory structure
- Added skills documentation page to web app

Fixes #198
2026-03-11 02:09:10 -05:00
Chris Tate dc9e9d17f3 rename modes (#197)
* rename modes

* improvements

* fixes

* fix homepage
2026-03-10 15:07:47 -05:00
Chris Tate 1977fb3a11 fix(mcp): resolve React duplicate module error with dedupe config (#192)
Fixes a React runtime error where `useRef` was null due to multiple React instances being bundled.

## Changes Made

- **Vite configuration**: Added `resolve.dedupe` for `react` and `react-dom` in `examples/mcp/vite.config.ts` to ensure only one instance of React is used during bundling
- **React version constraints**: Changed from exact versions (`19.2.3`) to flexible ranges (`^19.0.0`) in `examples/mcp/package.json` to improve compatibility
- **Build entry point**: Added new `build-app-html-entry.ts` file and updated `tsup.config.ts` to include it as a build target
- **Package exports**: Added `./build-app-html` export path in `packages/mcp/package.json`
- **Minor fixes**: Updated Next.js type reference path in stripe-app example

The root cause was React being duplicated in the bundle, causing hooks like `useRef` to fail when components tried to access React's internal state from the wrong instance. The `dedupe` configuration ensures Vite resolves all React imports to the same module instance.

Fixes #190
2026-03-09 21:21:07 -05:00
Chris Tate 4606c01085 skills page (#188) 2026-03-06 20:39:07 -06:00
Chris Tate c1a700d719 cleaner skills (#187) 2026-03-06 20:22:56 -06:00
105 changed files with 620 additions and 165 deletions
+1
View File
@@ -4,6 +4,7 @@
node_modules node_modules
.pnp .pnp
.pnp.js .pnp.js
.pnpm-store/
# Local env files # Local env files
.env* .env*
+1 -1
View File
@@ -98,7 +98,7 @@ When asked to prepare a release (e.g. "prepare v0.12.0"):
- An API reference page at `apps/web/app/(main)/docs/api/<name>/page.mdx` - An API reference page at `apps/web/app/(main)/docs/api/<name>/page.mdx`
- An entry in `apps/web/lib/page-titles.ts` and `apps/web/lib/docs-navigation.ts` - An entry in `apps/web/lib/page-titles.ts` and `apps/web/lib/docs-navigation.ts`
- An entry in the docs-chat system prompt (`apps/web/app/api/docs-chat/route.ts`) - An entry in the docs-chat system prompt (`apps/web/app/api/docs-chat/route.ts`)
- A skill at `skills/json-render-<name>/SKILL.md` - A skill at `skills/<name>/SKILL.md`
- A `packages/<name>/README.md` - A `packages/<name>/README.md`
6. **Run `pnpm type-check`** after all changes to verify nothing is broken 6. **Run `pnpm type-check`** after all changes to verify nothing is broken
+9
View File
@@ -1,5 +1,14 @@
# web # web
## 0.1.6
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/codegen@0.12.1
- @json-render/react@0.12.1
## 0.1.5 ## 0.1.5
### Patch Changes ### Patch Changes
+12 -12
View File
@@ -3,7 +3,7 @@ export const metadata = pageMetadata("docs/ai-sdk")
# AI SDK Integration # AI SDK Integration
Use json-render with the [Vercel AI SDK](https://sdk.vercel.ai) for seamless streaming. json-render supports two modes: **Generate** (standalone UI) and **Chat** (UI embedded in conversation). See [Generation Modes](/docs/generation-modes) for a detailed comparison. Use json-render with the [Vercel AI SDK](https://sdk.vercel.ai) for seamless streaming. json-render supports two modes: **Standalone** (standalone UI) and **Inline** (UI embedded in conversation). See [Generation Modes](/docs/generation-modes) for a detailed comparison.
## Installation ## Installation
@@ -11,9 +11,9 @@ Use json-render with the [Vercel AI SDK](https://sdk.vercel.ai) for seamless str
npm install ai @ai-sdk/react npm install ai @ai-sdk/react
``` ```
## Generate Mode ## Standalone Mode
In generate mode, the AI outputs only JSONL patches. The entire response is a UI spec with no prose. This is the default mode and is ideal for playgrounds, builders, and dashboard generators. In standalone mode, the AI outputs only JSONL patches. The entire response is a UI spec with no prose. This is the default mode and is ideal for playgrounds, builders, and dashboard generators.
### API Route ### API Route
@@ -73,9 +73,9 @@ function GenerativeUI() {
} }
``` ```
## Chat Mode ## Inline Mode
In chat mode, the AI responds conversationally and includes JSONL patches inline. Text-only replies are allowed when no UI is needed. This is ideal for chatbots, copilots, and educational assistants. In inline mode, the AI responds conversationally and includes JSONL patches inline. Text-only replies are allowed when no UI is needed. This is ideal for chatbots, copilots, and educational assistants.
### API Route ### API Route
@@ -96,7 +96,7 @@ export async function POST(req: Request) {
const result = streamText({ const result = streamText({
model: yourModel, model: yourModel,
system: catalog.prompt({ mode: "chat" }), system: catalog.prompt({ mode: "inline" }),
messages, messages,
}); });
@@ -182,13 +182,13 @@ const systemPrompt = catalog.prompt({
}); });
``` ```
### Chat Mode Prompt ### Inline Mode Prompt
```typescript ```typescript
const chatPrompt = catalog.prompt({ mode: "chat" }); const inlinePrompt = catalog.prompt({ mode: "inline" });
``` ```
In chat mode, the prompt instructs the AI to respond conversationally first, then include JSONL patches on their own lines when UI is needed. Text-only replies are allowed. In inline mode, the prompt instructs the AI to respond conversationally first, then include JSONL patches on their own lines when UI is needed. Text-only replies are allowed.
## Which Mode? ## Which Mode?
@@ -197,8 +197,8 @@ In chat mode, the prompt instructs the AI to respond conversationally first, the
<thead> <thead>
<tr> <tr>
<th></th> <th></th>
<th>Generate</th> <th>Standalone</th>
<th>Chat</th> <th>Inline</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@@ -215,7 +215,7 @@ In chat mode, the prompt instructs the AI to respond conversationally first, the
<tr> <tr>
<td>System prompt</td> <td>System prompt</td>
<td><code>catalog.prompt()</code></td> <td><code>catalog.prompt()</code></td>
<td><code>{"catalog.prompt({ mode: \"chat\" })"}</code></td> <td><code>{"catalog.prompt({ mode: \"inline\" })"}</code></td>
</tr> </tr>
<tr> <tr>
<td>Stream utility</td> <td>Stream utility</td>
+4 -4
View File
@@ -75,7 +75,7 @@ interface Catalog {
interface PromptOptions { interface PromptOptions {
system?: string; // Custom system message intro system?: string; // Custom system message intro
customRules?: string[]; // Additional rules to append customRules?: string[]; // Additional rules to append
mode?: "generate" | "chat"; // Output mode (default: "generate") mode?: "standalone" | "inline" | "generate" | "chat"; // Output mode (default: "standalone")
} }
interface SpecValidationResult<T> { interface SpecValidationResult<T> {
@@ -370,7 +370,7 @@ Most users should use `pipeJsonRender()` instead, which wraps this transform for
### createMixedStreamParser ### createMixedStreamParser
Parse a mixed stream of text and JSONL patches (used for Chat + GenUI mode): Parse a mixed stream of text and JSONL patches (used for Inline mode):
```typescript ```typescript
import { createMixedStreamParser } from '@json-render/core'; import { createMixedStreamParser } from '@json-render/core';
@@ -389,7 +389,7 @@ parser.flush();
### pipeJsonRender ### pipeJsonRender
Pipe an AI SDK `UIMessageStream` through the json-render transform. Lines that parse as JSONL patches are emitted as `data-spec` parts; everything else passes through as text. Used in Chat mode API routes. Pipe an AI SDK `UIMessageStream` through the json-render transform. Lines that parse as JSONL patches are emitted as `data-spec` parts; everything else passes through as text. Used in Inline mode API routes.
```typescript ```typescript
import { pipeJsonRender } from '@json-render/core'; import { pipeJsonRender } from '@json-render/core';
@@ -403,7 +403,7 @@ const stream = createUIMessageStream({
return createUIMessageStreamResponse({ stream }); return createUIMessageStreamResponse({ stream });
``` ```
See [Generation Modes](/docs/generation-modes) for full Chat mode setup. See [Generation Modes](/docs/generation-modes) for full Inline mode setup.
### SpecStream Types ### SpecStream Types
@@ -341,6 +341,8 @@ February 2026
### New: Chat Mode (Inline GenUI) ### New: Chat Mode (Inline GenUI)
> **Note:** These modes were renamed in v0.12.1 — "Generate" is now "Standalone" and "Chat" is now "Inline". The old names are accepted as deprecated aliases.
json-render now supports two generation modes: **Generate** (JSONL-only, the default) and **Chat** (text + JSONL inline). Chat mode lets the AI respond conversationally with embedded UI specs, ideal for chatbots and copilot experiences. json-render now supports two generation modes: **Generate** (JSONL-only, the default) and **Chat** (text + JSONL inline). Chat mode lets the AI respond conversationally with embedded UI specs, ideal for chatbots and copilot experiences.
```typescript ```typescript
@@ -3,15 +3,15 @@ export const metadata = pageMetadata("docs/generation-modes")
# Generation Modes # Generation Modes
json-render supports two modes for AI-generated UI: **Generate mode** for standalone UI and **Chat mode** for inline UI within a conversation. json-render supports two modes for AI-generated UI: **Standalone mode** for standalone UI and **Inline mode** for inline UI within a conversation.
The mode controls how the AI formats its output and how your app processes the stream. The underlying JSONL patch format is the same in both modes. The mode controls how the AI formats its output and how your app processes the stream. The underlying JSONL patch format is the same in both modes.
<GenerationModesDiagram /> <GenerationModesDiagram />
## Generate Mode (Standalone) ## Standalone Mode
In generate mode, the AI outputs **only JSONL patches** — no prose, no markdown. The entire response is a UI spec. In standalone mode, the AI outputs **only JSONL patches** — no prose, no markdown. The entire response is a UI spec.
This is the default mode and is ideal for: This is the default mode and is ideal for:
@@ -25,7 +25,7 @@ This is the default mode and is ideal for:
```typescript ```typescript
import { streamText } from "ai"; import { streamText } from "ai";
// Generate mode is the default (no mode option needed) // Standalone mode is the default (no mode option needed)
const systemPrompt = catalog.prompt({ const systemPrompt = catalog.prompt({
customRules: [ customRules: [
"Use Card as root for forms and small UIs.", "Use Card as root for forms and small UIs.",
@@ -74,9 +74,9 @@ The AI outputs only JSONL — one patch per line, no surrounding text:
{"op":"add","path":"/elements/submit","value":{"type":"Button","props":{"label":"Sign In"}}} {"op":"add","path":"/elements/submit","value":{"type":"Button","props":{"label":"Sign In"}}}
``` ```
## Chat Mode (Inline) ## Inline Mode
In chat mode, the AI responds **conversationally first**, then outputs JSONL patches on their own lines. Text-only replies are allowed when no UI is needed (e.g. greetings, clarifying questions). In inline mode, the AI responds **conversationally first**, then outputs JSONL patches on their own lines. Text-only replies are allowed when no UI is needed (e.g. greetings, clarifying questions).
This is ideal for: This is ideal for:
@@ -92,8 +92,8 @@ import { streamText } from "ai";
import { pipeJsonRender } from "@json-render/core"; import { pipeJsonRender } from "@json-render/core";
import { createUIMessageStream, createUIMessageStreamResponse } from "ai"; import { createUIMessageStream, createUIMessageStreamResponse } from "ai";
// Enable chat mode // Enable inline mode
const systemPrompt = catalog.prompt({ mode: "chat" }); const systemPrompt = catalog.prompt({ mode: "inline" });
const result = streamText({ const result = streamText({
model: yourModel, model: yourModel,
@@ -180,8 +180,8 @@ If the user asks a simple question ("what does BTC stand for?"), the AI replies
<thead> <thead>
<tr> <tr>
<th /> <th />
<th>Generate</th> <th>Standalone</th>
<th>Chat</th> <th>Inline</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@@ -198,7 +198,7 @@ If the user asks a simple question ("what does BTC stand for?"), the AI replies
<tr> <tr>
<td>System prompt</td> <td>System prompt</td>
<td><code>{"catalog.prompt()"}</code></td> <td><code>{"catalog.prompt()"}</code></td>
<td><code>{'catalog.prompt({ mode: "chat" })'}</code></td> <td><code>{'catalog.prompt({ mode: "inline" })'}</code></td>
</tr> </tr>
<tr> <tr>
<td>Stream utility</td> <td>Stream utility</td>
+26 -1
View File
@@ -309,10 +309,35 @@ const catalog = defineCatalog(schema, {
const prompt = catalog.prompt(); const prompt = catalog.prompt();
// Chat mode prompt // Inline mode prompt (formerly "chat")
const inlinePrompt = catalog.prompt({ mode: "inline" });
```
## Generation Modes
The generation mode values passed to `catalog.prompt()` have been renamed for clarity:
- `"generate"` is now `"standalone"`
- `"chat"` is now `"inline"`
The old names are accepted as deprecated aliases, so existing code will continue to work. Update when convenient.
**Before:**
```typescript
const prompt = catalog.prompt({ mode: "generate" });
const chatPrompt = catalog.prompt({ mode: "chat" }); const chatPrompt = catalog.prompt({ mode: "chat" });
``` ```
**After:**
```typescript
const prompt = catalog.prompt({ mode: "standalone" });
const inlinePrompt = catalog.prompt({ mode: "inline" });
```
The default mode (when no `mode` option is provided) is `"standalone"`, which behaves identically to the previous `"generate"` default.
## Validation ## Validation
`ValidationCheck` now uses `type` instead of `fn`, `ValidationProvider` uses `customFunctions` instead of `functions`, and `useFieldValidation` takes a config object instead of a checks array. `ValidationCheck` now uses `type` instead of `fn`, `ValidationProvider` uses `customFunctions` instead of `functions`, and `useFieldValidation` takes a config object instead of a checks array.
+1 -1
View File
@@ -91,7 +91,7 @@ The result is a native UI built from your own components — not an iframe, not
- **[Streaming](/docs/streaming)** — Render progressively as the AI responds. Each JSONL patch adds to the spec and the UI updates in real time. - **[Streaming](/docs/streaming)** — Render progressively as the AI responds. Each JSONL patch adds to the spec and the UI updates in real time.
- **[Data Binding](/docs/data-binding)** — Bind props to runtime data with `$state` paths, repeat elements over arrays, and wire two-way input bindings. - **[Data Binding](/docs/data-binding)** — Bind props to runtime data with `$state` paths, repeat elements over arrays, and wire two-way input bindings.
- **[Visibility](/docs/visibility)** — Show or hide elements based on state conditions. The AI can generate conditional UIs without writing logic. - **[Visibility](/docs/visibility)** — Show or hide elements based on state conditions. The AI can generate conditional UIs without writing logic.
- **[Generation Modes](/docs/generation-modes)** — Generate standalone UI (playground/builder) or inline UI within a chat conversation. - **[Generation Modes](/docs/generation-modes)** — Standalone mode for full-page generated UI or inline mode for UI embedded in a conversation.
## Next ## Next
+117
View File
@@ -0,0 +1,117 @@
import { pageMetadata } from "@/lib/page-metadata"
export const metadata = pageMetadata("docs/skills")
# Skills
json-render ships with skills that teach AI coding agents how to use each package. Install a skill and your agent in Cursor, Claude Code, or Codex can generate json-render UIs without manual guidance.
## Available Skills
- **core** — Core schemas, catalogs, and AI prompt generation.
- **react** — React renderer that turns JSON specs into React component trees.
- **react-pdf** — PDF renderer using `@react-pdf/renderer`.
- **react-email** — Email renderer that produces HTML or plain-text emails.
- **react-native** — React Native renderer for native mobile UIs.
- **shadcn** — Pre-built shadcn/ui components (Radix UI + Tailwind).
- **image** — Image renderer that turns JSON specs into SVG and PNG via Satori.
- **remotion** — Remotion renderer for video generation from JSON timeline specs.
- **vue** — Vue 3 renderer for Vue component trees.
- **svelte** — Svelte 5 renderer for Svelte component trees.
- **codegen** — Code generation utilities for building custom exporters.
- **mcp** — MCP Apps integration for Claude, ChatGPT, Cursor, and VS Code.
- **redux** — Redux adapter for json-render's `StateStore` interface.
- **zustand** — Zustand adapter for json-render's `StateStore` interface.
- **jotai** — Jotai adapter for json-render's `StateStore` interface.
- **xstate** — XState Store adapter for json-render's `StateStore` interface.
## Installation
```bash
npx skills add vercel-labs/json-render --skill core
npx skills add vercel-labs/json-render --skill react
npx skills add vercel-labs/json-render --skill react-pdf
npx skills add vercel-labs/json-render --skill react-email
npx skills add vercel-labs/json-render --skill react-native
npx skills add vercel-labs/json-render --skill shadcn
npx skills add vercel-labs/json-render --skill image
npx skills add vercel-labs/json-render --skill remotion
npx skills add vercel-labs/json-render --skill vue
npx skills add vercel-labs/json-render --skill svelte
npx skills add vercel-labs/json-render --skill codegen
npx skills add vercel-labs/json-render --skill mcp
npx skills add vercel-labs/json-render --skill redux
npx skills add vercel-labs/json-render --skill zustand
npx skills add vercel-labs/json-render --skill jotai
npx skills add vercel-labs/json-render --skill xstate
```
After installing, your AI agent will automatically activate the right skill when it encounters a matching request.
## core
The foundational skill. Teaches agents how to define catalogs, create schemas, build specs, and generate AI prompts. This is the starting point for any json-render project and covers `defineCatalog`, `defineSchema`, `specSchema`, `toPrompt`, and the full spec format.
## react
Teaches agents how to render JSON specs as React component trees using `JsonRender`, `JsonRenderClient`, and `useJsonRender`. Covers custom component registries, client-side interactivity, state management, and streaming integration.
## react-pdf
Teaches agents how to generate PDFs from JSON specs using `@react-pdf/renderer`. Covers the PDF-specific component registry, page layout, and styling.
## react-email
Teaches agents how to render JSON specs as HTML or plain-text emails using React Email components. Covers the email-specific registry and rendering pipeline.
## react-native
Teaches agents how to render JSON specs as native mobile UIs with React Native. Covers the native component registry and platform-specific considerations.
## shadcn
Teaches agents how to use the pre-built shadcn/ui component registry with json-render. Includes Radix UI primitives, Tailwind styling, and the full set of available shadcn components.
## image
Teaches agents how to turn JSON specs into SVG and PNG images using Satori. Covers the image-specific registry, dimensions, fonts, and rendering options.
## remotion
Teaches agents how to generate videos from JSON timeline specs using Remotion. Covers compositions, sequences, timeline structure, and video rendering.
## vue
Teaches agents how to render JSON specs as Vue 3 component trees. Covers the Vue renderer API, custom component registries, and reactivity integration.
## svelte
Teaches agents how to render JSON specs as Svelte 5 component trees. Covers the Svelte renderer API and component registration.
## codegen
Teaches agents how to use code generation utilities to export UI specs as framework-specific source code. Covers the codegen pipeline and custom exporter creation.
## mcp
Teaches agents how to build MCP Apps that serve json-render UIs inside AI tools like Claude, ChatGPT, Cursor, and VS Code. Covers MCP server setup, tool definitions, and UI streaming.
## redux
Teaches agents how to connect a Redux store to json-render's `StateStore` interface for state-driven UIs.
## zustand
Teaches agents how to connect a Zustand store to json-render's `StateStore` interface for lightweight state management.
## jotai
Teaches agents how to connect Jotai atoms to json-render's `StateStore` interface for atomic state management.
## xstate
Teaches agents how to connect an XState Store to json-render's `StateStore` interface for state-machine-driven UIs.
## Source
All skill files are in the [`skills/`](https://github.com/vercel-labs/json-render/tree/main/skills) directory of the repository.
+1
View File
@@ -17,6 +17,7 @@ const SYSTEM_PROMPT = `You are a helpful documentation assistant for json-render
GitHub repository: https://github.com/vercel-labs/json-render GitHub repository: https://github.com/vercel-labs/json-render
Documentation: https://json-render.dev/docs Documentation: https://json-render.dev/docs
npm packages: @json-render/core, @json-render/react, @json-render/vue, @json-render/svelte, @json-render/shadcn, @json-render/react-native, @json-render/react-email, @json-render/react-pdf, @json-render/image, @json-render/remotion, @json-render/codegen, @json-render/mcp, @json-render/redux, @json-render/zustand, @json-render/jotai, @json-render/xstate npm packages: @json-render/core, @json-render/react, @json-render/vue, @json-render/svelte, @json-render/shadcn, @json-render/react-native, @json-render/react-email, @json-render/react-pdf, @json-render/image, @json-render/remotion, @json-render/codegen, @json-render/mcp, @json-render/redux, @json-render/zustand, @json-render/jotai, @json-render/xstate
Skills: json-render ships AI agent skills that teach coding agents how to use each package. Install with "npx skills add vercel-labs/json-render --skill <name>". Available skills: core, react, react-pdf, react-email, react-native, shadcn, image, remotion, vue, svelte, codegen, mcp, redux, zustand, jotai, xstate. See /docs/skills for details.
You have access to the full json-render documentation via the bash and readFile tools. The docs are available as markdown files in the /workspace/docs/ directory. You have access to the full json-render documentation via the bash and readFile tools. The docs are available as markdown files in the /workspace/docs/ directory.
@@ -19,11 +19,11 @@ function FormUI() {
); );
} }
function ChatModeDiagram() { function InlineModeDiagram() {
return ( return (
<div className="flex flex-col h-full"> <div className="flex flex-col h-full">
<div className="text-xs font-medium text-muted-foreground mb-3 text-center"> <div className="text-xs font-medium text-muted-foreground mb-3 text-center">
Chat Mode Inline Mode
</div> </div>
<div className="flex-1 border border-border rounded-lg bg-background overflow-hidden flex flex-col"> <div className="flex-1 border border-border rounded-lg bg-background overflow-hidden flex flex-col">
{/* Chat area */} {/* Chat area */}
@@ -69,11 +69,11 @@ function ChatModeDiagram() {
); );
} }
function GenerateModeDiagram() { function StandaloneModeDiagram() {
return ( return (
<div className="flex flex-col h-full"> <div className="flex flex-col h-full">
<div className="text-xs font-medium text-muted-foreground mb-3 text-center"> <div className="text-xs font-medium text-muted-foreground mb-3 text-center">
Generate Mode Standalone Mode
</div> </div>
<div className="flex-1 border border-border rounded-lg bg-background overflow-hidden flex flex-row"> <div className="flex-1 border border-border rounded-lg bg-background overflow-hidden flex flex-row">
{/* Left panel - prompt */} {/* Left panel - prompt */}
@@ -104,10 +104,10 @@ export function GenerationModesDiagram() {
<div className="not-prose my-8"> <div className="not-prose my-8">
<div className="grid grid-cols-1 sm:grid-cols-2 gap-6"> <div className="grid grid-cols-1 sm:grid-cols-2 gap-6">
<div className="h-[280px]"> <div className="h-[280px]">
<ChatModeDiagram /> <InlineModeDiagram />
</div> </div>
<div className="h-[280px]"> <div className="h-[280px]">
<GenerateModeDiagram /> <StandaloneModeDiagram />
</div> </div>
</div> </div>
</div> </div>
+1
View File
@@ -16,6 +16,7 @@ export const docsNavigation: NavSection[] = [
{ title: "Introduction", href: "/docs" }, { title: "Introduction", href: "/docs" },
{ title: "Installation", href: "/docs/installation" }, { title: "Installation", href: "/docs/installation" },
{ title: "Quick Start", href: "/docs/quick-start" }, { title: "Quick Start", href: "/docs/quick-start" },
{ title: "Skills", href: "/docs/skills" },
{ title: "Migration Guide", href: "/docs/migration" }, { title: "Migration Guide", href: "/docs/migration" },
{ title: "Changelog", href: "/docs/changelog" }, { title: "Changelog", href: "/docs/changelog" },
], ],
+1
View File
@@ -37,6 +37,7 @@ export const PAGE_TITLES: Record<string, string> = {
"docs/ag-ui": "AG-UI Integration", "docs/ag-ui": "AG-UI Integration",
"docs/migration": "Migration Guide", "docs/migration": "Migration Guide",
"docs/changelog": "Changelog", "docs/changelog": "Changelog",
"docs/skills": "Skills",
// API references // API references
"docs/api/core": "@json-render/core API", "docs/api/core": "@json-render/core API",
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "web", "name": "web",
"version": "0.1.5", "version": "0.1.6",
"type": "module", "type": "module",
"private": true, "private": true,
"license": "Apache-2.0", "license": "Apache-2.0",
+9
View File
@@ -1,5 +1,14 @@
# example-chat # example-chat
## 0.1.6
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/react@0.12.1
- @json-render/shadcn@0.12.1
## 0.1.5 ## 0.1.5
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -130,7 +130,7 @@ When the user asks for a quiz, test, or Q&A, build an interactive experience:
4. You can also add a final score section that becomes visible when all questions are submitted. 4. You can also add a final score section that becomes visible when all questions are submitted.
${explorerCatalog.prompt({ ${explorerCatalog.prompt({
mode: "chat", mode: "inline",
customRules: [ customRules: [
"NEVER use viewport height classes (min-h-screen, h-screen) — the UI renders inside a fixed-size container.", "NEVER use viewport height classes (min-h-screen, h-screen) — the UI renders inside a fixed-size container.",
"Prefer Grid with columns='2' or columns='3' for side-by-side layouts.", "Prefer Grid with columns='2' or columns='3' for side-by-side layouts.",
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "example-chat", "name": "example-chat",
"version": "0.1.5", "version": "0.1.6",
"type": "module", "type": "module",
"private": true, "private": true,
"scripts": { "scripts": {
+9
View File
@@ -1,5 +1,14 @@
# example-dashboard # example-dashboard
## 0.1.6
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/codegen@0.12.1
- @json-render/react@0.12.1
## 0.1.5 ## 0.1.5
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "example-dashboard", "name": "example-dashboard",
"version": "0.1.5", "version": "0.1.6",
"type": "module", "type": "module",
"private": true, "private": true,
"scripts": { "scripts": {
+8
View File
@@ -1,5 +1,13 @@
# example-image # example-image
## 0.1.3
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/image@0.12.1
## 0.1.2 ## 0.1.2
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "example-image", "name": "example-image",
"version": "0.1.2", "version": "0.1.3",
"type": "module", "type": "module",
"private": true, "private": true,
"scripts": { "scripts": {
+10
View File
@@ -1,5 +1,15 @@
# example-mcp # example-mcp
## 0.1.2
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/mcp@0.12.1
- @json-render/react@0.12.1
- @json-render/shadcn@0.12.1
## 0.1.1 ## 0.1.1
### Patch Changes ### Patch Changes
+3 -3
View File
@@ -1,6 +1,6 @@
{ {
"name": "example-mcp", "name": "example-mcp",
"version": "0.1.1", "version": "0.1.2",
"type": "module", "type": "module",
"private": true, "private": true,
"scripts": { "scripts": {
@@ -16,8 +16,8 @@
"@json-render/shadcn": "workspace:*", "@json-render/shadcn": "workspace:*",
"@modelcontextprotocol/ext-apps": "^1.2.0", "@modelcontextprotocol/ext-apps": "^1.2.0",
"@modelcontextprotocol/sdk": "^1.27.1", "@modelcontextprotocol/sdk": "^1.27.1",
"react": "19.2.3", "react": "^19.0.0",
"react-dom": "19.2.3", "react-dom": "^19.0.0",
"zod": "^4.3.6" "zod": "^4.3.6"
}, },
"devDependencies": { "devDependencies": {
+3
View File
@@ -5,6 +5,9 @@ import tailwindcss from "@tailwindcss/vite";
export default defineConfig({ export default defineConfig({
plugins: [react(), tailwindcss(), viteSingleFile()], plugins: [react(), tailwindcss(), viteSingleFile()],
resolve: {
dedupe: ["react", "react-dom"],
},
build: { build: {
outDir: "dist", outDir: "dist",
emptyOutDir: false, emptyOutDir: false,
+9
View File
@@ -1,5 +1,14 @@
# example-no-ai # example-no-ai
## 0.1.6
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/react@0.12.1
- @json-render/shadcn@0.12.1
## 0.1.5 ## 0.1.5
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "example-no-ai", "name": "example-no-ai",
"version": "0.1.5", "version": "0.1.6",
"type": "module", "type": "module",
"private": true, "private": true,
"scripts": { "scripts": {
+8
View File
@@ -1,5 +1,13 @@
# example-react-email # example-react-email
## 0.1.2
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/react-email@0.12.1
## 0.1.1 ## 0.1.1
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "example-react-email", "name": "example-react-email",
"version": "0.1.1", "version": "0.1.2",
"type": "module", "type": "module",
"private": true, "private": true,
"scripts": { "scripts": {
+8
View File
@@ -1,5 +1,13 @@
# example-react-native # example-react-native
## 0.1.6
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/react-native@0.12.1
## 0.1.5 ## 0.1.5
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "example-react-native", "name": "example-react-native",
"version": "0.1.5", "version": "0.1.6",
"private": true, "private": true,
"main": "expo-router/entry", "main": "expo-router/entry",
"scripts": { "scripts": {
+8
View File
@@ -1,5 +1,13 @@
# example-react-pdf # example-react-pdf
## 0.1.6
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/react-pdf@0.12.1
## 0.1.5 ## 0.1.5
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "example-react-pdf", "name": "example-react-pdf",
"version": "0.1.5", "version": "0.1.6",
"type": "module", "type": "module",
"private": true, "private": true,
"scripts": { "scripts": {
+8
View File
@@ -1,5 +1,13 @@
# example-remotion # example-remotion
## 0.1.6
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/remotion@0.12.1
## 0.1.5 ## 0.1.5
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "example-remotion", "name": "example-remotion",
"version": "0.1.5", "version": "0.1.6",
"type": "module", "type": "module",
"private": true, "private": true,
"scripts": { "scripts": {
+1 -1
View File
@@ -1,6 +1,6 @@
/// <reference types="next" /> /// <reference types="next" />
/// <reference types="next/image-types/global" /> /// <reference types="next/image-types/global" />
import "./.next/dev/types/routes.d.ts"; import "./.next/types/routes.d.ts";
// NOTE: This file should not be edited // NOTE: This file should not be edited
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information. // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
@@ -1,5 +1,13 @@
# com.example.json-render-demo # com.example.json-render-demo
## 0.0.7
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/react@0.12.1
## 0.0.6 ## 0.0.6
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "com.example.json-render-demo", "name": "com.example.json-render-demo",
"version": "0.0.6", "version": "0.0.7",
"description": "Test", "description": "Test",
"private": true, "private": true,
"license": "~~proprietary~~", "license": "~~proprietary~~",
@@ -1,5 +1,13 @@
# com.example.json-render-fullpage-demo # com.example.json-render-fullpage-demo
## 0.0.7
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/react@0.12.1
## 0.0.6 ## 0.0.6
### Patch Changes ### Patch Changes
@@ -1,6 +1,6 @@
{ {
"name": "com.example.json-render-fullpage-demo", "name": "com.example.json-render-fullpage-demo",
"version": "0.0.6", "version": "0.0.7",
"description": "Full-page Stripe App example (alpha)", "description": "Full-page Stripe App example (alpha)",
"private": true, "private": true,
"license": "~~proprietary~~", "license": "~~proprietary~~",
+8
View File
@@ -1,5 +1,13 @@
# svelte-chat # svelte-chat
## 0.0.3
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/svelte@0.12.1
## 0.0.2 ## 0.0.2
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,7 +1,7 @@
{ {
"name": "svelte-chat", "name": "svelte-chat",
"private": true, "private": true,
"version": "0.0.2", "version": "0.0.3",
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite dev", "dev": "vite dev",
+1 -1
View File
@@ -62,7 +62,7 @@ INPUT COMPONENTS:
- Button: Clickable button. Use on.press to trigger actions. - Button: Clickable button. Use on.press to trigger actions.
${explorerCatalog.prompt({ ${explorerCatalog.prompt({
mode: "chat", mode: "inline",
customRules: [ customRules: [
"NEVER use viewport height classes (min-h-screen, h-screen) — the UI renders inside a fixed-size container.", "NEVER use viewport height classes (min-h-screen, h-screen) — the UI renders inside a fixed-size container.",
"Prefer Grid with columns='2' or columns='3' for side-by-side layouts.", "Prefer Grid with columns='2' or columns='3' for side-by-side layouts.",
+8
View File
@@ -1,5 +1,13 @@
# example-svelte # example-svelte
## 0.1.3
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/svelte@0.12.1
## 0.1.2 ## 0.1.2
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "example-svelte", "name": "example-svelte",
"version": "0.1.2", "version": "0.1.3",
"private": true, "private": true,
"type": "module", "type": "module",
"scripts": { "scripts": {
+10
View File
@@ -1,5 +1,15 @@
# vite-renderers # vite-renderers
## 0.1.4
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/react@0.12.1
- @json-render/svelte@0.12.1
- @json-render/vue@0.12.1
## 0.1.3 ## 0.1.3
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "vite-renderers", "name": "vite-renderers",
"version": "0.1.3", "version": "0.1.4",
"private": true, "private": true,
"type": "module", "type": "module",
"scripts": { "scripts": {
+8
View File
@@ -1,5 +1,13 @@
# example-vue # example-vue
## 0.1.4
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/vue@0.12.1
## 0.1.3 ## 0.1.3
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "example-vue", "name": "example-vue",
"version": "0.1.3", "version": "0.1.4",
"private": true, "private": true,
"scripts": { "scripts": {
"predev": "command -v portless >/dev/null 2>&1 || (echo '\\nportless is required but not installed. Run: npm i -g portless\\nSee: https://github.com/vercel-labs/portless\\n' && exit 1)", "predev": "command -v portless >/dev/null 2>&1 || (echo '\\nportless is required but not installed. Run: npm i -g portless\\nSee: https://github.com/vercel-labs/portless\\n' && exit 1)",
+7
View File
@@ -1,5 +1,12 @@
# @json-render/codegen # @json-render/codegen
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Patch Changes ### Patch Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/codegen", "name": "@json-render/codegen",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "Utilities for generating code from json-render UI trees", "description": "Utilities for generating code from json-render UI trees",
"keywords": [ "keywords": [
@@ -15,7 +15,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/codegen" "directory": "packages/codegen"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+17
View File
@@ -1,5 +1,22 @@
# @json-render/core # @json-render/core
## 0.12.1
### Patch Changes
- 54a1ecf: Rename generation modes and fix MCP React duplicate module error.
### Changed:
- **`@json-render/core`** — Renamed generation modes from `"generate"` / `"chat"` to `"standalone"` / `"inline"`. The old names still work but emit a deprecation warning.
### Fixed:
- **`@json-render/mcp`** — Resolved React duplicate module error (`useRef` returning null) by adding `resolve.dedupe` Vite configuration. Added `./build-app-html` export entry point.
### Other:
- Updated `homepage` URLs across all packages to point to `https://json-render.dev`.
- Reorganized skills directory structure for cleaner naming.
- Added skills documentation page to the web app.
## 0.12.0 ## 0.12.0
### Minor Changes ### Minor Changes
+1 -1
View File
@@ -227,7 +227,7 @@ Schema options:
| `ActionBinding` | Action binding with `action`, `params`, `confirm`, `preventDefault`, etc. | | `ActionBinding` | Action binding with `action`, `params`, `confirm`, `preventDefault`, etc. |
| `BuiltInAction` | Built-in action definition with `name` and `description` | | `BuiltInAction` | Built-in action definition with `name` and `description` |
### Chat Mode (Mixed Streams) ### Inline Mode (Mixed Streams)
| Export | Purpose | | Export | Purpose |
|--------|---------| |--------|---------|
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/core", "name": "@json-render/core",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "JSON becomes real things. Define your catalog, register your components, let AI generate.", "description": "JSON becomes real things. Define your catalog, register your components, let AI generate.",
"keywords": [ "keywords": [
@@ -19,7 +19,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/core" "directory": "packages/core"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+35 -3
View File
@@ -257,7 +257,7 @@ describe("catalog.prompt", () => {
expect(prompt).toContain("Keep UIs simple"); expect(prompt).toContain("Keep UIs simple");
}); });
it("generates chat mode prompt when mode is chat", () => { it("generates inline mode prompt when mode is inline", () => {
const catalog = defineCatalog(testSchema, { const catalog = defineCatalog(testSchema, {
components: { components: {
Text: { Text: {
@@ -268,13 +268,13 @@ describe("catalog.prompt", () => {
}, },
actions: {}, actions: {},
}); });
const prompt = catalog.prompt({ mode: "chat" }); const prompt = catalog.prompt({ mode: "inline" });
expect(prompt).toContain("```spec"); expect(prompt).toContain("```spec");
expect(prompt).toContain("conversationally"); expect(prompt).toContain("conversationally");
expect(prompt).toContain("text + JSONL"); expect(prompt).toContain("text + JSONL");
}); });
it("generates generate mode prompt by default", () => { it("generates standalone mode prompt by default", () => {
const catalog = defineCatalog(testSchema, { const catalog = defineCatalog(testSchema, {
components: { components: {
Text: { Text: {
@@ -290,6 +290,38 @@ describe("catalog.prompt", () => {
expect(prompt).not.toContain("conversationally"); expect(prompt).not.toContain("conversationally");
}); });
it("accepts deprecated 'chat' as alias for 'inline'", () => {
const catalog = defineCatalog(testSchema, {
components: {
Text: {
props: z.object({}),
description: "",
slots: [],
},
},
actions: {},
});
const inlinePrompt = catalog.prompt({ mode: "inline" });
const chatPrompt = catalog.prompt({ mode: "chat" });
expect(chatPrompt).toEqual(inlinePrompt);
});
it("accepts deprecated 'generate' as alias for 'standalone'", () => {
const catalog = defineCatalog(testSchema, {
components: {
Text: {
props: z.object({}),
description: "",
slots: [],
},
},
actions: {},
});
const standalonePrompt = catalog.prompt({ mode: "standalone" });
const generatePrompt = catalog.prompt({ mode: "generate" });
expect(generatePrompt).toEqual(standalonePrompt);
});
it("uses actual catalog component names in examples", () => { it("uses actual catalog component names in examples", () => {
const catalog = defineCatalog(testSchema, { const catalog = defineCatalog(testSchema, {
components: { components: {
+22 -6
View File
@@ -112,11 +112,14 @@ export interface PromptOptions {
/** /**
* Output mode for the generated prompt. * Output mode for the generated prompt.
* *
* - `"generate"` (default): The LLM should output only JSONL patches (no prose). * - `"standalone"` (default): The LLM should output only JSONL patches (no prose).
* - `"chat"`: The LLM should respond conversationally first, then output JSONL patches. * - `"inline"`: The LLM should respond conversationally first, then output JSONL patches.
* Includes rules about interleaving text with JSONL and not wrapping in code fences. * Includes rules about interleaving text with JSONL and not wrapping in code fences.
*
* @deprecated `"generate"` — use `"standalone"` instead.
* @deprecated `"chat"` — use `"inline"` instead.
*/ */
mode?: "generate" | "chat"; mode?: "standalone" | "inline" | "generate" | "chat";
} }
/** /**
@@ -563,15 +566,28 @@ function generatePrompt<TDef extends SchemaDefinition, TCatalog>(
const { const {
system = "You are a UI generator that outputs JSON.", system = "You are a UI generator that outputs JSON.",
customRules = [], customRules = [],
mode = "generate", mode: rawMode = "standalone",
} = options; } = options;
const mode: "standalone" | "inline" =
rawMode === "chat"
? (console.warn(
'[json-render] mode "chat" is deprecated, use "inline" instead',
),
"inline")
: rawMode === "generate"
? (console.warn(
'[json-render] mode "generate" is deprecated, use "standalone" instead',
),
"standalone")
: rawMode;
const lines: string[] = []; const lines: string[] = [];
lines.push(system); lines.push(system);
lines.push(""); lines.push("");
// Output format section - explain JSONL streaming patch format // Output format section - explain JSONL streaming patch format
if (mode === "chat") { if (mode === "inline") {
lines.push("OUTPUT FORMAT (text + JSONL, RFC 6902 JSON Patch):"); lines.push("OUTPUT FORMAT (text + JSONL, RFC 6902 JSON Patch):");
lines.push( lines.push(
"You respond conversationally. When generating UI, first write a brief explanation (1-3 sentences), then output JSONL patch lines wrapped in a ```spec code fence.", "You respond conversationally. When generating UI, first write a brief explanation (1-3 sentences), then output JSONL patch lines wrapped in a ```spec code fence.",
@@ -1014,7 +1030,7 @@ Note: state patches appear right after the elements that use them, so the UI fil
// Rules // Rules
lines.push("RULES:"); lines.push("RULES:");
const baseRules = const baseRules =
mode === "chat" mode === "inline"
? [ ? [
"When generating UI, wrap all JSONL patches in a ```spec code fence - one JSON object per line inside the fence", "When generating UI, wrap all JSONL patches in a ```spec code fence - one JSON object per line inside the fence",
"Write a brief conversational response before any JSONL output", "Write a brief conversational response before any JSONL output",
+7
View File
@@ -1,5 +1,12 @@
# @json-render/image # @json-render/image
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Patch Changes ### Patch Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/image", "name": "@json-render/image",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "Image renderer for @json-render/core. JSON becomes SVG and PNG images via Satori.", "description": "Image renderer for @json-render/core. JSON becomes SVG and PNG images via Satori.",
"keywords": [ "keywords": [
@@ -20,7 +20,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/image" "directory": "packages/image"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+7
View File
@@ -1,5 +1,12 @@
# @json-render/jotai # @json-render/jotai
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Patch Changes ### Patch Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/jotai", "name": "@json-render/jotai",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "Jotai adapter for json-render StateStore", "description": "Jotai adapter for json-render StateStore",
"keywords": [ "keywords": [
@@ -14,7 +14,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/jotai" "directory": "packages/jotai"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+20
View File
@@ -1,5 +1,25 @@
# @json-render/mcp # @json-render/mcp
## 0.12.1
### Patch Changes
- 54a1ecf: Rename generation modes and fix MCP React duplicate module error.
### Changed:
- **`@json-render/core`** — Renamed generation modes from `"generate"` / `"chat"` to `"standalone"` / `"inline"`. The old names still work but emit a deprecation warning.
### Fixed:
- **`@json-render/mcp`** — Resolved React duplicate module error (`useRef` returning null) by adding `resolve.dedupe` Vite configuration. Added `./build-app-html` export entry point.
### Other:
- Updated `homepage` URLs across all packages to point to `https://json-render.dev`.
- Reorganized skills directory structure for cleaner naming.
- Added skills documentation page to the web app.
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Minor Changes ### Minor Changes
+7 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/mcp", "name": "@json-render/mcp",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "MCP Apps integration for @json-render/core. Serve json-render UIs as interactive MCP Apps in Claude, ChatGPT, Cursor, and VS Code.", "description": "MCP Apps integration for @json-render/core. Serve json-render UIs as interactive MCP Apps in Claude, ChatGPT, Cursor, and VS Code.",
"keywords": [ "keywords": [
@@ -22,7 +22,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/mcp" "directory": "packages/mcp"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
@@ -42,6 +42,11 @@
"types": "./dist/app.d.ts", "types": "./dist/app.d.ts",
"import": "./dist/app.mjs", "import": "./dist/app.mjs",
"require": "./dist/app.js" "require": "./dist/app.js"
},
"./build-app-html": {
"types": "./dist/build-app-html-entry.d.ts",
"import": "./dist/build-app-html-entry.mjs",
"require": "./dist/build-app-html-entry.js"
} }
}, },
"files": [ "files": [
+11
View File
@@ -0,0 +1,11 @@
/**
* Server-side utility for building self-contained MCP App HTML.
*
* This entry point does NOT depend on React and is safe to import
* in Node.js / server environments.
*
* @packageDocumentation
*/
export { buildAppHtml } from "./build-app-html.js";
export type { BuildAppHtmlOptions } from "./build-app-html.js";
+1 -1
View File
@@ -1,7 +1,7 @@
import { defineConfig } from "tsup"; import { defineConfig } from "tsup";
export default defineConfig({ export default defineConfig({
entry: ["src/index.ts", "src/app.ts"], entry: ["src/index.ts", "src/app.ts", "src/build-app-html-entry.ts"],
format: ["cjs", "esm"], format: ["cjs", "esm"],
dts: true, dts: true,
sourcemap: true, sourcemap: true,
+7
View File
@@ -1,5 +1,12 @@
# @json-render/react-email # @json-render/react-email
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Minor Changes ### Minor Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/react-email", "name": "@json-render/react-email",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "React Email renderer for @json-render/core. JSON becomes HTML emails.", "description": "React Email renderer for @json-render/core. JSON becomes HTML emails.",
"keywords": [ "keywords": [
@@ -18,7 +18,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/react-email" "directory": "packages/react-email"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+7
View File
@@ -1,5 +1,12 @@
# @json-render/react-native # @json-render/react-native
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Patch Changes ### Patch Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/react-native", "name": "@json-render/react-native",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "React Native renderer for @json-render/core. JSON becomes React Native components.", "description": "React Native renderer for @json-render/core. JSON becomes React Native components.",
"keywords": [ "keywords": [
@@ -19,7 +19,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/react-native" "directory": "packages/react-native"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+7
View File
@@ -1,5 +1,12 @@
# @json-render/react-pdf # @json-render/react-pdf
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Patch Changes ### Patch Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/react-pdf", "name": "@json-render/react-pdf",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "React PDF renderer for @json-render/core. JSON becomes PDF documents.", "description": "React PDF renderer for @json-render/core. JSON becomes PDF documents.",
"keywords": [ "keywords": [
@@ -18,7 +18,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/react-pdf" "directory": "packages/react-pdf"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+7
View File
@@ -1,5 +1,12 @@
# @internal/react-state # @internal/react-state
## 0.8.6
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.8.5 ## 0.8.5
### Patch Changes ### Patch Changes
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "@internal/react-state", "name": "@internal/react-state",
"version": "0.8.5", "version": "0.8.6",
"private": true, "private": true,
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "Shared React state context for json-render renderer packages", "description": "Shared React state context for json-render renderer packages",
+7
View File
@@ -1,5 +1,12 @@
# @json-render/react # @json-render/react
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Patch Changes ### Patch Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/react", "name": "@json-render/react",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "React renderer for @json-render/core. JSON becomes React components.", "description": "React renderer for @json-render/core. JSON becomes React components.",
"keywords": [ "keywords": [
@@ -19,7 +19,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/react" "directory": "packages/react"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+7
View File
@@ -1,5 +1,12 @@
# @json-render/redux # @json-render/redux
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Patch Changes ### Patch Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/redux", "name": "@json-render/redux",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "Redux adapter for json-render StateStore", "description": "Redux adapter for json-render StateStore",
"keywords": [ "keywords": [
@@ -14,7 +14,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/redux" "directory": "packages/redux"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+7
View File
@@ -1,5 +1,12 @@
# @json-render/remotion # @json-render/remotion
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Patch Changes ### Patch Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/remotion", "name": "@json-render/remotion",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "Remotion renderer for @json-render/core. JSON becomes video compositions.", "description": "Remotion renderer for @json-render/core. JSON becomes video compositions.",
"keywords": [ "keywords": [
@@ -19,7 +19,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/remotion" "directory": "packages/remotion"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+8
View File
@@ -1,5 +1,13 @@
# @json-render/shadcn # @json-render/shadcn
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
- @json-render/react@0.12.1
## 0.12.0 ## 0.12.0
### Patch Changes ### Patch Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/shadcn", "name": "@json-render/shadcn",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "shadcn/ui component library for @json-render/core. JSON becomes beautiful Tailwind-styled React components.", "description": "shadcn/ui component library for @json-render/core. JSON becomes beautiful Tailwind-styled React components.",
"keywords": [ "keywords": [
@@ -22,7 +22,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/shadcn" "directory": "packages/shadcn"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+7
View File
@@ -1,5 +1,12 @@
# @json-render/svelte # @json-render/svelte
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Minor Changes ### Minor Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/svelte", "name": "@json-render/svelte",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "Svelte 5 renderer for @json-render/core. JSON becomes Svelte components.", "description": "Svelte 5 renderer for @json-render/core. JSON becomes Svelte components.",
"keywords": [ "keywords": [
@@ -21,7 +21,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/svelte" "directory": "packages/svelte"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+7
View File
@@ -1,5 +1,12 @@
# @json-render/vue # @json-render/vue
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Patch Changes ### Patch Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/vue", "name": "@json-render/vue",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "Vue renderer for @json-render/core. JSON becomes Vue components.", "description": "Vue renderer for @json-render/core. JSON becomes Vue components.",
"keywords": [ "keywords": [
@@ -19,7 +19,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/vue" "directory": "packages/vue"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+7
View File
@@ -1,5 +1,12 @@
# @json-render/xstate # @json-render/xstate
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Patch Changes ### Patch Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/xstate", "name": "@json-render/xstate",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "XState Store adapter for json-render StateStore", "description": "XState Store adapter for json-render StateStore",
"keywords": [ "keywords": [
@@ -15,7 +15,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/xstate" "directory": "packages/xstate"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+7
View File
@@ -1,5 +1,12 @@
# @json-render/zustand # @json-render/zustand
## 0.12.1
### Patch Changes
- Updated dependencies [54a1ecf]
- @json-render/core@0.12.1
## 0.12.0 ## 0.12.0
### Patch Changes ### Patch Changes
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "@json-render/zustand", "name": "@json-render/zustand",
"version": "0.12.0", "version": "0.12.1",
"license": "Apache-2.0", "license": "Apache-2.0",
"description": "Zustand adapter for json-render StateStore", "description": "Zustand adapter for json-render StateStore",
"keywords": [ "keywords": [
@@ -14,7 +14,7 @@
"url": "git+https://github.com/vercel-labs/json-render.git", "url": "git+https://github.com/vercel-labs/json-render.git",
"directory": "packages/zustand" "directory": "packages/zustand"
}, },
"homepage": "https://github.com/vercel-labs/json-render#readme", "homepage": "https://json-render.dev",
"bugs": { "bugs": {
"url": "https://github.com/vercel-labs/json-render/issues" "url": "https://github.com/vercel-labs/json-render/issues"
}, },
+9 -48
View File
@@ -536,16 +536,16 @@ importers:
version: link:../../packages/shadcn version: link:../../packages/shadcn
'@modelcontextprotocol/ext-apps': '@modelcontextprotocol/ext-apps':
specifier: ^1.2.0 specifier: ^1.2.0
version: 1.2.0(@modelcontextprotocol/sdk@1.27.1(zod@4.3.6))(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(zod@4.3.6) version: 1.2.0(@modelcontextprotocol/sdk@1.27.1(zod@4.3.6))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(zod@4.3.6)
'@modelcontextprotocol/sdk': '@modelcontextprotocol/sdk':
specifier: ^1.27.1 specifier: ^1.27.1
version: 1.27.1(zod@4.3.6) version: 1.27.1(zod@4.3.6)
react: react:
specifier: 19.2.3 specifier: ^19.0.0
version: 19.2.3 version: 19.2.4
react-dom: react-dom:
specifier: 19.2.3 specifier: ^19.0.0
version: 19.2.3(react@19.2.3) version: 19.2.4(react@19.2.4)
zod: zod:
specifier: ^4.3.6 specifier: ^4.3.6
version: 4.3.6 version: 4.3.6
@@ -600,7 +600,7 @@ importers:
version: 0.563.0(react@19.2.4) version: 0.563.0(react@19.2.4)
next: next:
specifier: 16.1.6 specifier: 16.1.6
version: 16.1.6(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@1.0.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4) version: 16.1.6(@babel/core@7.29.0)(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@1.0.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
radix-ui: radix-ui:
specifier: ^1.4.3 specifier: ^1.4.3
version: 1.4.3(@types/react-dom@19.2.3(@types/react@19.2.3))(@types/react@19.2.3)(react-dom@19.2.4(react@19.2.4))(react@19.2.4) version: 1.4.3(@types/react-dom@19.2.3(@types/react@19.2.3))(@types/react@19.2.3)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
@@ -947,7 +947,7 @@ importers:
version: 6.0.103(zod@4.3.6) version: 6.0.103(zod@4.3.6)
next: next:
specifier: ^16.1.6 specifier: ^16.1.6
version: 16.1.6(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@1.0.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4) version: 16.1.6(@babel/core@7.29.0)(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@1.0.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
react: react:
specifier: ^19.1.0 specifier: ^19.1.0
version: 19.2.4 version: 19.2.4
@@ -15019,14 +15019,6 @@ snapshots:
'@mixmark-io/domino@2.2.0': {} '@mixmark-io/domino@2.2.0': {}
'@modelcontextprotocol/ext-apps@1.2.0(@modelcontextprotocol/sdk@1.27.1(zod@4.3.6))(react-dom@19.2.3(react@19.2.3))(react@19.2.3)(zod@4.3.6)':
dependencies:
'@modelcontextprotocol/sdk': 1.27.1(zod@4.3.6)
zod: 4.3.6
optionalDependencies:
react: 19.2.3
react-dom: 19.2.3(react@19.2.3)
'@modelcontextprotocol/ext-apps@1.2.0(@modelcontextprotocol/sdk@1.27.1(zod@4.3.6))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(zod@4.3.6)': '@modelcontextprotocol/ext-apps@1.2.0(@modelcontextprotocol/sdk@1.27.1(zod@4.3.6))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(zod@4.3.6)':
dependencies: dependencies:
'@modelcontextprotocol/sdk': 1.27.1(zod@4.3.6) '@modelcontextprotocol/sdk': 1.27.1(zod@4.3.6)
@@ -17941,7 +17933,7 @@ snapshots:
'@stripe/ui-extension-tools@0.0.1(@babel/core@7.29.0)(babel-jest@27.5.1(@babel/core@7.29.0))': '@stripe/ui-extension-tools@0.0.1(@babel/core@7.29.0)(babel-jest@27.5.1(@babel/core@7.29.0))':
dependencies: dependencies:
'@types/jest': 28.1.8 '@types/jest': 28.1.8
'@typescript-eslint/eslint-plugin': 5.62.0(@typescript-eslint/parser@5.62.0(eslint@9.39.2(jiti@2.6.1))(typescript@4.9.5))(eslint@8.57.1)(typescript@4.9.5) '@typescript-eslint/eslint-plugin': 5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@4.9.5))(eslint@8.57.1)(typescript@4.9.5)
'@typescript-eslint/parser': 5.62.0(eslint@8.57.1)(typescript@4.9.5) '@typescript-eslint/parser': 5.62.0(eslint@8.57.1)(typescript@4.9.5)
eslint: 8.57.1 eslint: 8.57.1
eslint-plugin-react: 7.37.5(eslint@8.57.1) eslint-plugin-react: 7.37.5(eslint@8.57.1)
@@ -18467,7 +18459,7 @@ snapshots:
'@types/node': 22.19.6 '@types/node': 22.19.6
optional: true optional: true
'@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@9.39.2(jiti@2.6.1))(typescript@4.9.5))(eslint@8.57.1)(typescript@4.9.5)': '@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@4.9.5))(eslint@8.57.1)(typescript@4.9.5)':
dependencies: dependencies:
'@eslint-community/regexpp': 4.12.2 '@eslint-community/regexpp': 4.12.2
'@typescript-eslint/parser': 5.62.0(eslint@8.57.1)(typescript@4.9.5) '@typescript-eslint/parser': 5.62.0(eslint@8.57.1)(typescript@4.9.5)
@@ -23804,32 +23796,6 @@ snapshots:
- '@babel/core' - '@babel/core'
- babel-plugin-macros - babel-plugin-macros
next@16.1.6(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@1.0.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4):
dependencies:
'@next/env': 16.1.6
'@swc/helpers': 0.5.15
baseline-browser-mapping: 2.9.14
caniuse-lite: 1.0.30001764
postcss: 8.4.31
react: 19.2.4
react-dom: 19.2.4(react@19.2.4)
styled-jsx: 5.1.6(react@19.2.4)
optionalDependencies:
'@next/swc-darwin-arm64': 16.1.6
'@next/swc-darwin-x64': 16.1.6
'@next/swc-linux-arm64-gnu': 16.1.6
'@next/swc-linux-arm64-musl': 16.1.6
'@next/swc-linux-x64-gnu': 16.1.6
'@next/swc-linux-x64-musl': 16.1.6
'@next/swc-win32-arm64-msvc': 16.1.6
'@next/swc-win32-x64-msvc': 16.1.6
'@opentelemetry/api': 1.9.0
babel-plugin-react-compiler: 1.0.0
sharp: 0.34.5
transitivePeerDependencies:
- '@babel/core'
- babel-plugin-macros
node-abi@3.87.0: node-abi@3.87.0:
dependencies: dependencies:
semver: 7.7.3 semver: 7.7.3
@@ -25904,11 +25870,6 @@ snapshots:
client-only: 0.0.1 client-only: 0.0.1
react: 19.2.3 react: 19.2.3
styled-jsx@5.1.6(react@19.2.4):
dependencies:
client-only: 0.0.1
react: 19.2.4
sucrase@3.35.1: sucrase@3.35.1:
dependencies: dependencies:
'@jridgewell/gen-mapping': 0.3.13 '@jridgewell/gen-mapping': 0.3.13
@@ -1,5 +1,5 @@
--- ---
name: json-render-codegen name: codegen
description: Code generation utilities for json-render. Use when generating code from UI specs, building custom code exporters, traversing specs, or serializing props for @json-render/codegen. description: Code generation utilities for json-render. Use when generating code from UI specs, building custom code exporters, traversing specs, or serializing props for @json-render/codegen.
--- ---
@@ -1,5 +1,5 @@
--- ---
name: json-render-core name: core
description: Core package for defining schemas, catalogs, and AI prompt generation for json-render. Use when working with @json-render/core, defining schemas, creating catalogs, or building JSON specs for UI/video generation. description: Core package for defining schemas, catalogs, and AI prompt generation for json-render. Use when working with @json-render/core, defining schemas, creating catalogs, or building JSON specs for UI/video generation.
--- ---
@@ -1,5 +1,5 @@
--- ---
name: json-render-image name: image
description: Image renderer for json-render that turns JSON specs into SVG and PNG images via Satori. Use when working with @json-render/image, generating OG images from JSON, creating social cards, or rendering AI-generated image specs. description: Image renderer for json-render that turns JSON specs into SVG and PNG images via Satori. Use when working with @json-render/image, generating OG images from JSON, creating social cards, or rendering AI-generated image specs.
--- ---
@@ -1,5 +1,5 @@
--- ---
name: json-render-jotai name: jotai
description: Jotai adapter for json-render's StateStore interface. Use when integrating json-render with Jotai for state management via @json-render/jotai. description: Jotai adapter for json-render's StateStore interface. Use when integrating json-render with Jotai for state management via @json-render/jotai.
--- ---
@@ -1,5 +1,5 @@
--- ---
name: json-render-mcp name: mcp
description: MCP Apps integration for json-render. Use when building MCP servers that render interactive UIs in Claude, ChatGPT, Cursor, or VS Code, or when integrating json-render with the Model Context Protocol. description: MCP Apps integration for json-render. Use when building MCP servers that render interactive UIs in Claude, ChatGPT, Cursor, or VS Code, or when integrating json-render with the Model Context Protocol.
--- ---
@@ -1,5 +1,5 @@
--- ---
name: json-render-react-email name: react-email
description: React Email renderer for json-render that turns JSON specs into HTML or plain-text emails using @react-email/components and @react-email/render. Use when working with @json-render/react-email, building transactional or marketing emails from JSON, creating email catalogs, rendering AI-generated email specs, or when the user mentions react-email, HTML email, or transactional email. description: React Email renderer for json-render that turns JSON specs into HTML or plain-text emails using @react-email/components and @react-email/render. Use when working with @json-render/react-email, building transactional or marketing emails from JSON, creating email catalogs, rendering AI-generated email specs, or when the user mentions react-email, HTML email, or transactional email.
metadata: metadata:
tags: react-email, email, json-render, html email, transactional email tags: react-email, email, json-render, html email, transactional email
@@ -1,5 +1,5 @@
--- ---
name: json-render-react-native name: react-native
description: React Native renderer for json-render that turns JSON specs into native mobile UIs. Use when working with @json-render/react-native, building React Native UIs from JSON, creating mobile component catalogs, or rendering AI-generated specs on mobile. description: React Native renderer for json-render that turns JSON specs into native mobile UIs. Use when working with @json-render/react-native, building React Native UIs from JSON, creating mobile component catalogs, or rendering AI-generated specs on mobile.
--- ---
@@ -1,5 +1,5 @@
--- ---
name: json-render-react-pdf name: react-pdf
description: React PDF renderer for json-render. Use when generating PDF documents from JSON specs, working with @json-render/react-pdf, or rendering specs to PDF buffers/streams/files. description: React PDF renderer for json-render. Use when generating PDF documents from JSON specs, working with @json-render/react-pdf, or rendering specs to PDF buffers/streams/files.
--- ---
@@ -1,5 +1,5 @@
--- ---
name: json-render-react name: react
description: React renderer for json-render that turns JSON specs into React components. Use when working with @json-render/react, building React UIs from JSON, creating component catalogs, or rendering AI-generated specs. description: React renderer for json-render that turns JSON specs into React components. Use when working with @json-render/react, building React UIs from JSON, creating component catalogs, or rendering AI-generated specs.
--- ---
@@ -1,5 +1,5 @@
--- ---
name: json-render-redux name: redux
description: Redux adapter for json-render's StateStore interface. Use when integrating json-render with Redux or Redux Toolkit for state management via @json-render/redux. description: Redux adapter for json-render's StateStore interface. Use when integrating json-render with Redux or Redux Toolkit for state management via @json-render/redux.
--- ---
@@ -1,5 +1,5 @@
--- ---
name: json-render-remotion name: remotion
description: Remotion renderer for json-render that turns JSON timeline specs into videos. Use when working with @json-render/remotion, building video compositions from JSON, creating video catalogs, or rendering AI-generated video timelines. description: Remotion renderer for json-render that turns JSON timeline specs into videos. Use when working with @json-render/remotion, building video compositions from JSON, creating video catalogs, or rendering AI-generated video timelines.
--- ---

Some files were not shown because too many files have changed in this diff Show More