vercel-labs / vercel-labs/json-render
Feature request: Official HeroUI v3 registry package (`@json-render/heroui`)
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
- HeroUI v3 docs: https://v3.heroui.com
- Existing shadcn integration:
@json-render/shadcn
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- 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