react-dribble-button

The Button component with pretty nice hive and click effects

Installation

$ npm install react-dribble-button

Demo

Try it out

| | |

Basic Usage

import DribbleButton from 'react-dribble-button';

// Inside of a component's render() method:
render() {
  return (
    <DribbleButton color="deep-orange" onClick={this.onClick} animationDuration={1000} >
      Try this cool color!
    </DribbleButton>
  );
}

Examples

Please clone the repo and run npm run storybook or yarn storybook to show examples of usages.

Usage (API)

The DribbleButton component has a few properties, as described below.

Property	Type	Defaut	Description
`color`	`string`	`default`	The color theme. Should be one of the folowing strings: 'red'
`onClick`	`function`	`null`	Click handler.
`children`	`any`	`null`	Children element.
`className`	`string`	`''`	Class name of the component.
`component`	`string or Component`	`button`	Component type.
`effectClassName`	`string`	`''`	Class name of the effect component.
`animationDuration`	`number`	`650`	The dribble animation duration in ms.

Contributing

I welcome contributions! Please open an issue if you have any feature ideas or find any bugs. I also accept pull requests with open arms. I will go over the issues when I have time. :)