raulrene / react-utils-button

Lightweight React Button component, serving as an utility wrapper over the HTML button element.

React Utils Button

Lightweight React Button component, serving as an utility wrapper over the HTML button element.

Demo: https://raulrene.github.io/react-utils-button/example/

Installation

npm i --save react-utils-button

Usage

import Button from 'react-utils-button';

<Button value='Click me'
		className='my-extra-class'
		onClick={() => { console.log('clicked'); }}
		active={false}
		loading={false}
		disabled={false}/>

The library can also be loaded via require:

const Button = require('react-utils-button');

Options

• value (string, required) - value to be displayed inside the button
• className (string) - extra classes
• onClick (function) - callback function
• active (boolean, default: false) - force active state; adds a utils-button--active class
• disabled (boolean, default: false) - disabled state for the button; once disabled the onClick callback does not fire anymore
• loading (boolean, default: false) - sets a loading state, also automatically making it disabled; adds a utils-button--loading class. This can be used to style a loading state, for example a spinner to let the user know something is happening.

Licence

The code is open-source and available under the MIT Licence. More details in the LICENCE.md file.