Button

Props

  • text - the button text
  • color - red or blue (the default is green)
  • className - apply a custom class
  • action - callback function that is executed on click
  • params - object passed by the callback function
<Button
  color='blue'
  text='Save'
  action={ this.save() }
  params={{ id: 3141 }}
/>

Outline Button



Pass a className of btn-outline to any button component.

Text Button



Pass a className of btn-text to any button component.

Loading Button

Button with loading animation for actions that will take some time to process.

Props

  • text - button label
  • action - callback function executed on click
  • params - object passed to the callback function (optional)
  • color – red or blue (the default is green)
  • loading - boolean to determine if the loading animation is visible
  • className – apply a custom class name
<LoadingButton color='blue'>
 <Button/>
<LoadingButton/>

Icon Button

Props

  • action - callback function that is executed on click
  • params - object passed by the callback function
  • color – accepts dark/light or hex value
  • image - icon image to use (refer to icon docs)
  • className - apply a custom class