2015-07-02 14:17:35 +03:00
# Button
2015-10-29 09:42:14 +03:00
A button clearly communicates what action will occur when the user touches it. It consists of text, an image, or both, designed in accordance with your app’ s color theme.
2015-10-31 01:03:00 +03:00
<!-- example -->
2015-07-02 14:17:35 +03:00
```
2015-10-31 01:03:00 +03:00
class Test extends React.Component {
render () {
return (
< div >
< Button label = "Flat button" / >
< Button kind = "raised" label = "Raised" / >
< Button kind = "raised" label = "Raised accent" accent icon = "favorite" / >
< Button className = "primary" kind = "floating" icon = "add" / >
< Button mini kind = "floating" icon = "add" accent / >
< / div >
);
}
}
return < Test / > ;
2015-07-02 14:17:35 +03:00
```
## Properties
| Name | Type | Default | Description|
|:- |:-: | :- |:-|
| **className** | String | | Set the class-styles of the Component.|
2015-07-07 12:30:22 +03:00
| **disabled** | Boolean | | If true, component will be disabled.|
| **icon** | String | | Default value using JSON data.|
2015-09-18 22:03:08 +03:00
| **label** | String | | The text string to use for the floating label element.|
2015-07-07 12:30:22 +03:00
| **loading** | Boolean | | If true, component will be disabled and show a loading animation.|
2015-09-18 22:03:08 +03:00
| **ripple** | Boolean | | If true, component will have a ripple effect on click.|
| **type** | String | "flat" | Type of the component, overwrite this property if you need set a different stylesheet.|
2015-07-02 14:17:35 +03:00
## Methods
#### loading
If true, component will be disabled and show a loading animation.
```
input_instance.loading(true);
```