underdog-pup-react

Pup / React

React components powered by Pup.

Usage

1. Install with npm:

npm install underdog-pup-react --save

1. Import components.

import {Button} from 'underdog-pup-react';
 
// Do things with Button

1. Import styles for components.

@import './node_modules/underdog-pup-react/styles/pup-react';

Contributing

Adding a new component

Follow these steps to add a new component:

1. Create a new directory that matches the name of your new component to /components.

For example, if your component is named CandidatePreview, create a new directory at /components/candidate-preview.

1. Add the code for your component.

Create a file named index.js in your newly created directory, and add the code for your component to it. The file should be located at /components/component-name/index.js.

1. Add some documentation for your component.

Create a new file named docs.js in the directory for your component. This file must export a React Component, and it should contain a demonstration of how the component works.

Be sure to create a set of thorough test cases to make sure the component looks and works as expected in a variety situations.

You should also set the displayName property on your component to the name of the component the documentation is for. This value will used to label the component in the styleguide.

1. Add unit tests for your component in the /test/components directory.

Add tests to ensure the component behaves as expected.

1. Add your component as an export in lib/index.js.

This will make your component accessible to projects that depend on this library.

1. Add your component to the listing of components in app/components.js.

This will make the component visible in the styleguide.