Button
Regular button, can be used as action trigger in any part of your application and support all native DOM events for buttons.
Usage
import { RButton } from '@rebilly/revel';
<r-button
:size="size"
:type="type"
:fluid="fluid"
:disabled="disabled"
:loading="loading"
:capitalizeFirstLetter="capitalizeFirstLetter"
:href="href"
@click="click"
@focus="focus"
@blur="blur"
>
{{text}}
</r-button>
| Name | Type | Default | Description |
|---|---|---|---|
| size | union, "small", "regular", "large" | 'regular' | Specify button size |
| link | boolean | false | Specify button as anchor link element |
| href | string | undefined | Anchor link element destination URL |
| type | union, "default", "primary", "danger", "positive", "plain", "unstyled", "link" | 'default' | Specify button type according to your theme colors |
| disabled | boolean | false | Disabled state just like for regular html button |
| active | boolean | false | Active state just like for regular button |
| fluid | boolean | false | Make button full width |
| loading | boolean | false | Append loading spinner to button |
| capitalizeFirstLetter | boolean | true | Capitalize the first letter |
| iconLeft | IconNames | undefined | Append icon to the left side of the button |
| iconRight | IconNames | undefined | Append icon to the right side of the button |
| icon | IconNames | undefined | Displays only icon |
| Name | Description |
|---|---|
| default | Text content inside anchor. |