vercel-labs / vercel-labs/json-render

Feature request: Official HeroUI v3 registry package (`@json-render/heroui`)

Open
#189 0 comments 7 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
16.8k
Forks
901
Avg merge
3h 14m
Merged PRs (30d)
4

Description

Summary

Requesting an official HeroUI v3 integration package, similar to the existing @json-render/shadcn.

Motivation

HeroUI v3 (beta) is a React component library built on React Aria Components and Tailwind CSS v4. It uses a compound components pattern (e.g., Card.Header, Card.Content, Button.StartContent) which differs from flat-prop component APIs.

Having an official registry would lower the barrier for HeroUI users adopting json-render, rather than each team building custom registry mappings.

Considerations

HeroUI v3's compound component pattern may need special handling in the registry layer, translating flat catalog props into nested compound component structures. For example:

// Catalog defines flat props
Card: { props: { title, description }, hasChildren: true }

// HeroUI v3 renders as compound components
<Card>
  <Card.Header>{title}</Card.Header>
  <Card.Content>{description}</Card.Content>
  {children}
</Card>

References

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by inspecting the existing @json-render/shadcn integration and reading the HeroUI v3 documentation at v3.heroui.com. Determine how the registry should represent HeroUI's compound components and define the package's scope; done means an official @json-render/heroui integration that supports the requested catalog-to-component mapping.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, tailwindcss, typescript
Domain
frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.