codegen
Code generation utilities for json-render. Use when generating code from UI specs, building custom code exporters, traversing…
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.
Claude Code
$ npx -y skills add vercel-labs/json-render --skill core --agent claude-code
Codex
$ npx skills add vercel-labs/json-render --skill core -a codex -y
Cursor
$ npx skills add vercel-labs/json-render --skill core -a cursor -y
Gemini CLI
$ npx skills add vercel-labs/json-render --skill core -a gemini-cli -y
GitHub Copilot
$ npx skills add vercel-labs/json-render --skill core -a github-copilot -y
OpenCode
$ npx skills add vercel-labs/json-render --skill core -a opencode -y
Windsurf
$ npx skills add vercel-labs/json-render --skill core -a windsurf -y
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.
Core package for schema definition, catalog creation, and spec streaming.
For decision-model composition, import `experimental_composeSpec` and `experimental_createEvaluator` from `@json-render/core`. These APIs are available since v0.21.0; pin exact versions and keep json-render packages on the same version. Experimental exports and `Experimental_` types can change in any release.
See `packages/core/README.md` and `/docs/jev` for app integration and installation instructions. The web playground is an example consumer, not a dependency of the API.
import { defineSchema } from "@json-render/core";
export const schema = defineSchema((s) => ({
spec: s.object({
// Define spec structure
}),
catalog: s.object({
components: s.map({
props: s.zod(),
description: s.string(),
}),
}),
}), {
promptTemplate: myPromptTemplate, // Optional custom AI prompt
});import { defineCatalog } from "@json-render/core";
import { schema } from "./schema";
import { z } from "zod";
export const catalog = defineCataloThe Generative UI framework. Generate dynamic, personalized UIs from prompts without sacrificing reliability. Predefined components and actions for safe, predictable output.
Code generation utilities for json-render. Use when generating code from UI specs, building custom code exporters, traversing…
React adapter for the json-render devtools inspector. Use whenever the user wants to add, configure, or troubleshoot…
SolidJS adapter for the json-render devtools inspector. Use whenever the user wants to add, configure, or troubleshoot…
Svelte 5 adapter for the json-render devtools inspector. Use whenever the user wants to add, configure, or troubleshoot…
Vue adapter for the json-render devtools inspector. Use whenever the user wants to add, configure, or troubleshoot…
Drop-in inspector panel for any json-render app. Use when the user wants to debug a generative UI, inspect the spec tree, edit…
Migrates React projects and components from Radix UI to Base UI. Use when asked to migrate from radix, move to base-ui, convert…
tasteskill v2, the anti-slop frontend skill. Art direction for websites, distilled from a study of 247 curated gallery sites (One…