minimoon

🌙 Minimoon

A minimalistic react component library with minimum css

Minimoon and this documentation is still under development ⚠️

Getting Started

Instalation

Just run

npm install minimoon

And import

import { MoonAlert, MoonTabs, ... } from 'minimoon'
import 'minimoon/build/css/index.css'

Components Examples

• ActionContainer - A container with embedded actions button.

• Alert - A confirm box modal that resembles javascripts confirm().

• Backdrop - Foreground element that blocks screen behind it.

• InputButton - An input groupped with a button. Greate for search.

• Modal - A dialog for custom content and multiple uses.

• Tabs - Dynamic tab for navbar links or display diferents containers.

• Toastr - A simple toaster with an action button.

• OffCanvas - An off-cavas component to use as collapsible menu or hide some others components.

• CollapsibleList - A list with retractable sub list itens.

So, why not headless components?

First, a headless component refers to a component that offers maximum visual flexibility by providing no interface. That said, if the objective is provide a lot flexibility, why not use this approach?

Because this lib aims to provide components that you can overide the overall style without to much gibberish that happens when you use some lib with to much style embedded. If this was headless, you would need to handle things like animations, displays, responsivity and other things that you problably don't wanna do since your're searching for a ui lib.

So, if you want some neat components, thats allow you to quickly write a few css lines to make them match your aplication overall style or just wanna keep things simple, just go for Minimoon!

Made with Minimoon

Build something using this lib? Wanna share? Just create a issue with a link and a small description about what you did!

Planning Poker Deck

Simple pwa for planning poker thats allow you to create your own deck or use one of defaults including: standard, fibonacci, t-shirt and risky.

Minimoon is develop with :hearts: by @victorheringer_