@clippings/paper

Clippings Design System

Usage no npm install needed!

<script type="module">
  import clippingsPaper from 'https://cdn.skypack.dev/@clippings/paper';
</script>

README

Paper

Clippings Design System

This is Clippings design system called Paper built using Storybook.

Install

git clone git@github.com:clippings/paper.git
cd paper
yarn install
yarn storybook

With the above commands you'd be able to browse the design system locally with the local URL outputted in your terminal.

Usage

In order to use the Paper design system in your application, you need to install it as a dependency and import components from it:

yarn add @clippings/paper
import { Button, ThemeProvider } from '@clippings/paper';

<ThemeProvider theme={{mode: "light" }}>
<p>
This is a paper button: <Button>Click me!</Button>
</p>
</ThemeProvider>

Develop

When you develop Paper components, keep the storybook running and run the test script to watch for changes and run the tests.

yarn test

Make sure to run the linters before commiting:

yarn lint

License

Licensed to Clippings Limited under the MIT license.