vercel-labs/json-render
26 skills · 41,187 total installs
$npx skills add vercel-labs/json-renderSkillInstalls
reactReact renderer for json-render that turns JSON specs into React components.coreCore package for defining schemas, catalogs, and AI prompt generation for json-render.codegenCode generation utilities for json-render. Use when generating code from UI specs, building custom code exporters, traversing specs, or serializing props for…mcpMCP Apps integration for json-render. Use when building MCP servers that render interactive UIs in Claude, ChatGPT, Cursor, or VS Code, or when integrating…nextNext.js renderer for json-render that turns JSON specs into full Next.js applications with routes, layouts, SSR, and metadata.devtoolsDrop-in inspector panel for any json-render app. Use when the user wants to debug a generative UI, inspect the spec tree, edit state at runtime, see dispatched…directivesPre-built custom directives for json-render — formatting, math, string manipulation, and i18n.react-pdfReact PDF renderer for json-render. Use when generating PDF documents from JSON specs, working with @json-render/react-pdf, or rendering specs to PDF…react-three-fiberReact Three Fiber 3D renderer for json-render. Use when working with @json-render/react-three-fiber, building 3D scenes from JSON specs, rendering…shadcnPre-built shadcn/ui components for json-render. Use when working with @json-render/shadcn, adding standard UI components to a catalog, or building web UIs with…zustandZustand adapter for json-render's StateStore interface. Use when integrating json-render with Zustand for state management via @json-render/zustand.react-nativeReact Native renderer for json-render that turns JSON specs into native mobile UIs.remotionRemotion renderer for json-render that turns JSON timeline specs into videos.imageImage renderer for json-render that turns JSON specs into SVG and PNG images via Satori.remotion-best-practicesBest practices for Remotion - Video creation in Reactreact-emailReact Email renderer for json-render that turns JSON specs into HTML or plain-text emails using @react-email/components and @react-email/render.vueVue 3 renderer for json-render. Use when building Vue UIs from JSON specs, working with @json-render/vue, defining Vue component registries, or rendering…inkInk terminal renderer for json-render that turns JSON specs into interactive terminal UIs.skill-creatorGuide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's…svelteSvelte 5 renderer for json-render that turns JSON specs into Svelte component trees.reduxRedux adapter for json-render's StateStore interface. Use when integrating json-render with Redux or Redux Toolkit for state management via @json-render/redux.jotaiJotai adapter for json-render's StateStore interface. Use when integrating json-render with Jotai for state management via @json-render/jotai.shadcn-sveltePre-built shadcn-svelte components for json-render Svelte apps.xstateXState Store adapter for json-render's StateStore interface. Use when integrating json-render with @xstate/store for state management via @json-render/xstate.solidSolidJS renderer for json-render. Use when building @json-render/solid catalogs/registries, wiring Renderer providers, implementing bindings/actions, or…yamlYAML wire format for json-render with streaming parser, prompt generation, and AI SDK transform.