Name | Type | Description |
action |
'solid' | 'outline' | 'flat' | 'flat-inline'
| Define the type of action the button triggers
- `solid`: buttons direct the user’s attention to the primary action the application is suggesting that the user take.
- `outline`: buttons indicate secondary actions that compliments a primary action or reduces visual noise when there are many actions on the page.
- `flat`: buttons are used as tertiary buttons. Can also be used inline because they are different from content in style and recognizable as buttons alongside content. |
status |
'primary' | 'success' | 'warning' | 'danger' | 'neutral' | 'inverse'
| Sets the color of the button to match the following string statuses |
size |
'icon' | 'sm' | 'md'
| Sets the overall height and width of the button based on the following string values: |
block |
boolean
| Sets if the button should be full width with display block |
loadingState |
default | loading | success | error
| `default`: shows the content of the button
- `loading`: disables the button and shows a spinner inside the button
- `success`: disables the button and shows a check mark inside the button; auto-triggers to change back to DEFAULT state after 1000 ms
- `error`: shows the content of the button (in the context of application, this state is usually entered from a LOADING state. the application should show appropriate error message) |
disabled |
boolean
| |
pressed |
boolean
| |
expanded |
boolean
| |
readonly |
boolean
| |
type |
'button' | 'submit'
| |
name |
string
| |
value |
string
| |
popup |
string
| |