LoadingSpinnerButton for Fender React UI Kit
Description
A button component which has a spinner for a loading state.
Installation and Usage
yarn add @fenderdigital/react-loading-spinner-button --save
import LoadingSpinnerButton from '@fenderdigital/react-loading-spinner-button';Props
-
children- renders any child elements, usually the button text -
color- color of the button -
dataId- data id value, mainly for testing -
disabled- option to disable the button -
fontStyles- styles for button text -
loading- bool for whether or not the button is loading -
onClick- handler for when the button is clicked -
requireClick- Iftrue, require both a click andloading={true}before the button starts spinning. -
spinnerColor- color of the loading spinner -
spinnerWidth- width of the loading spinner for different size buttons -
styles- styles for the button itself -
type- button type.
| propName | propType | defaultValue | isRequired |
|---|---|---|---|
| children | node | - | yes |
| color | string | red | no |
| dataId | string | '' | no |
| disabled | bool | false | no |
| fontStyles | string | '' | no |
| loading | bool | false | yes |
| onClick | func | false | no |
| requireClick | boolean | false | no |
| spinnerColor | string | white | no |
| spinnerWidth | number | 15 | no |
| styles | string | '' | no |
| type | string | 'button' | no |
Development
Check the Monorepo README for development documentation.