Long Button is one of the most used components in the application. This is a button that stretches 100% of the width of the container. It can have different states such as:

• Primary
  • the background color is yellow
• Secondary
  • the background color is dark grey
• Light
  • the background color is white
• Disabled
  • the background color is light grey

The button is highly customizable and can have its content changed using props:

• buttonShadow - is button shadow going to be set
  • Boolean
  • Default - true
• buttonShadowOpacity - adjust button opacity by passing in a value
  • Default - 0.5 (number passed in should range from 0-1)
  • Number
• circularIconBackgroundColor - background color of the circular icon
  • String
• circularIconBorderColor - border color of the circular icon
  • String
• circularIconComponent - circular icon component
  • Object
• hasCircularIcon - determines if the circular icon is visible
  • Default - false
  • Boolean
• hasTailingIcon - Tailing icons are placed right next to the title of the button
  • Default - false
  • Boolean
• onPress - execute a passed-in function on the press of the button
  • Function
• tailingIconComponent - tailing icon component
  • Object
• tailingIconPaddingLeft - padding to the left of tailing icon
  • Number
• title - button's title
  • String
• titleFontColor - title's color
  • Default - black
  • String