design-box v1.0.12

Environment for development, documentation, testing and visualization of components.

https://angelolucas.github.io/design-box/

Storybook is an open source tool for developing UI components in isolation. It makes building stunning UIs organized and efficient.

Features

• ⚛️ React - A JavaScript library for building user interfaces
• 📕 Storybook - Build bulletproof UI components faster.
• 💅 Styled components - Use the best bits of ES6 and CSS to style your apps without stress.
• 🃏 Jest - A delightful JavaScript Testing Framework with a focus on simplicity.
• 😎 Prettier - Code formatter.
• 👨‍🏫 ESLint - The pluggable linting utility for JavaScript and JSX.
• 🐶 Husky - To prevent bad git commit.

Install

yarn add design-box or npm install --save design-box

Usage

import { Button, Input } from 'design-box';

<Input placeholder="name" />
<Button>Save</Button>

Theme Definition

import { ThemeProvider, Button, Input } from 'design-box';

<ThemeProvider theme={{palette: {primary: 'blue'}}}>
  <Button color="primary" size="small" fullWidth>Salvar</Button>
  <Input placeholder="nome" />
</ThemeProvider>

Develop

To start server
$ yarn start

To build
$ yarn build

To deploy on gh-pages (https://angelolucas.github.io/design-box/)
$ yarn deploy