@include 'common'

## 按钮类型
按钮有三种视觉层次：主按钮、次按钮、普通按钮。不同的类型可以用来区别按钮的重要程度。

默认情况下 Button 组件使用 `<button>` 标签来渲染按钮，通过 `component` 属性可以自定义 `Button` 的标签类型。 可选值为 `button` 和 `a`。
@include 'demo1'

## 按钮标签
默认情况下 Button 组件使用 `<button>` 标签来渲染按钮，通过 `component` 属性可以自定义 `Button` 的标签类型。可选值为 `button` 和 `a`。
@include 'demo2'

@include 'demo3'

## 加载状态
通过设置 `loading` 属性即可以让按钮处于加载状态。
@include 'demo4'

## 幽灵按钮
幽灵按钮通常用在有色背景下，可以使用 `ghost` 属性开启，此时 Button 为透明背景。对于浅色背景和深色背景，通过取值 `light`, `dark` 可以配置使用幽灵按钮的场景。
@include 'demo5'

## 图标按钮
`Button` 可以嵌入 `Icon`，默认情况下 `Icon` 尺寸自动跟随 `Button` 的尺寸，可以通过 `iconSize` 属性进行设置。

通过设置 `icons` 属性中的 `loading` 即可自定义加载的 `icon`。
@include 'demo6'

## 按钮尺寸
可以通过设置 `size` 属性控制按钮的尺寸，可选值为 `large` `medium` `small` `tiny`，其中默认值为 `medium`。
@include 'demo7'

## 按钮组
`Button.Group` 子组件用于将多个按钮组合在一个容器中。
@include 'demo8'

## 无障碍支持
在使用不包含文本的icon Button组件时，我们需要添加 `aria-label` 对其进行描述，键盘操作请参考#无障碍键盘操作指南。
@include 'demo9'