Button Page
Examples
Buttons with different types
Primary, Secondary, Tertiary
Danger buttons
Primary, Secondary, Tertiary
Sizes
Two sizes available
Icon
Icon could be added to the right or left side of the button
Icon
Icon only
Statuses
Disabled and loading status buttons
Modifiers
Buttons could be made circular or have shadow effects
Props
PropertyTypeDescriptionRequiredDefault
with
textAndIcon
icon
text
To determine what are the rest of the props to be passed in.Ftext
type
primary
secondary
tertiary
T-
iconPosition
left
right
Fleft
circle
boolean
Ffalse
danger
boolean
Ffalse
disabled
boolean
Ffalse
shadow
boolean
Ffalse
size
large
small
Fsmall
noPadding
boolean
Ffalse
fullWidth
boolean
Ffalse
children
React.ReactNode
F-
htmlType
button
submit
Fbutton
imgIconUrl
string
F-
loading
boolean
Ffalse
onClick
(e: React.MouseEvent) => void
Fundefined
TBC
Guidelines
Figma