feat: Claude Code skills for catalog design + multi-surface rendering

Proposal

We've built two complementary Claude Code skills for json-render and would like to contribute them upstream.

Skill 1: json-render-catalog (component catalog patterns)

Guides AI agents through building Zod-typed catalogs:

• Catalog design patterns (constrain AI output to design system)
• shadcn component mapping (29 built-in → custom extensions)
• Token optimization (YAML wire format saves ~30% vs JSON)
• Action definitions with typed params
• Catalog validation and testing patterns
• Multi-framework support (React, Vue, Svelte, React Native)

Skill 2: multi-surface-render (one spec, 6 outputs)

Same JSON spec → multiple output surfaces:

• React — web UI rendering with <Renderer>
• PDF — renderToPdfBuffer() for reports, invoices
• Email — renderToEmailHtml() + renderToEmailText() via react-email
• Image — OG image generation (1200x630) with @resvg/resvg-js
• Terminal — ASCII/Unicode rendering for CLI tools and MCP responses
• YAML — token-efficient wire format for LLM consumption

Includes: registry mapping patterns, renderer selection logic, Edge runtime gotchas (Uint8Array → ArrayBuffer), catalog subsetting per surface.

Tested against

@json-render/* v0.16.0 in production with 41-component catalog, 14 custom HQ components, 6 active output surfaces, 130+ tests.

Format

Two SKILL.md files with references/ and examples/. Happy to PR.

Start by reviewing the two proposed SKILL.md files and their references/ and examples/ directories. Verify that the catalog skill covers typed catalogs, validation, testing, and framework mappings, while the multi-surface skill covers all six output surfaces and the listed runtime considerations; done means both skills are complete and consistent with the tested json-render capabilities.