Skip to Main Content
HyperUI
GitHub 10.8k
Enjoy HyperUI? Give it a star on GitHub

How to Contribute to HyperUI

The idea of contributing to an open-source project can be intimidating. Let's explore how you can contribute to HyperUI.

Spotted a Bug?

If you find something that doesn't seem right, such as:

  • Spelling
  • Accessibility
  • SEO

Or anything else, please create an issue.

Once an issue is created, we can begin discussing a solution and approach to resolving the issue.

Want to Add Something?

If you have something to add to HyperUI, that's great! But before you dive in, I suggest you create an issue so we can discuss what you want to add.

If you're planning to add a new component, include some examples of how the component will look.

Pull Request Feedback

All pull requests must be reviewed before being merged into HyperUI, which means there might be feedback at times.

Getting HyperUI Running Locally

HyperUI is a Next JS project and can be quickly set up with the following commands.

git clone git@github.com:markmead/hyperui.git
yarn install
yarn dev
yarn css --watch

Creating a New Component

For this example, we will create a new footer component in the marketing category.

  1. Create a new file in /public/components/marketing-footers
  2. Add the new component to the components group in /src/data/components/marketing-footers.mdx

It should look like this.

components:
  21:
    title: An Amazing Footer
  22:
    title: My Awesome New Footer

As you can see, component files are named incrementally. Please follow this method.

You can use container: to position the component within the preview. However, any classes added here will be ignored when copying or viewing the component's code.

Notes on New Components

  1. Components must be written with Tailwind CSS
  2. Reference used Tailwind CSS plugins in the HTML

You can see examples of point 3 in the HTML of this input component.

Creating a New Collection

To create a new collection, please create an issue on GitHub. Then we can discuss the new collection and brainstorm components to add.

New Component Feedback

If you plan to add a component to HyperUI, I will provide feedback on both the design and development of the component.

For new component pull requests, I will review the work three times. If feedback from the first review remains unaddressed by the third review, I will close the PR. If there is new feedback on the third review, it's not an issue.