kirandash / greenhouse-react-ui

🧩 React UI component library built with Tailwind CSS
https://6442bd489bd20422b7ada446-nmudwbaxnc.chromatic.com/
MIT License
9 stars 8 forks source link
component-library components contributions-welcome good-first-issue help-wanted open-source opensource react react-component-library reactjs tailwindcss

Greenhouse React UI

The react component library with Tailwind and a gorgeous design system to help you build awesome react projects.

Codecov Build npm MIT License

🎯 Mission

Build a light weight accessible component library ready to be used out of the box for building your next awesome react project.

🚀 Usage

Install

npm i greenhouse-react-ui

Inside tailwind.config.js

const greenhouse = require('greenhouse-react-ui/config')
module.exports = greenhouse({
    purge: [],
    theme: {
        extend: {},
    },
    variants: {},
    plugins: [],
})

Then place GreenHouse at the root of your project (the order doesn't matter, as long as your application is inside).

// index.js
import React from 'react'
import ReactDOM from 'react-dom'
import App from './App'
import { GreenHouse } from 'greenhouse-react-ui'

ReactDOM.render(
    <GreenHouse>
        <App />
    </GreenHouse>,
    document.getElementById('root'),
)

Use components inside your project

import { Button } from 'greenhouse-react-ui'

function App() {
    return <Button>Hi there!</Button>
}

export default App

🔌 Contributing

It will start a local server at localhost:6006 with all components rendered.

git commit to commit your changes

git push will trigger prettier format check, linting, audit and build.

🙏 Support

Please ⭐️ star this project and share it with others to show your support. Follow me ❤️ for updates on future projects and tutorials!