The Button component with pretty nice hive and click effects
$ npm install react-dribble-button
| 
| 
|
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>
);
}Please clone the repo and run npm run storybook or yarn storybook to show examples of usages.
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. |
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. :)
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent