<script setup lang="ts">
import { componentCount } from '../.vitepress/data/components'
</script>

# 组件总览

共 {{ componentCount }} 个组件与 `v-ripple` 指令，覆盖从按钮、表单控件到弹层与反馈的常见场景。

下面每张卡片里的预览都由**真实组件实时渲染**，可以直接点击体验；点进卡片即可看到完整用法、API 表格与可一键复制的源码。

::: tip 还没安装？
一条命令即可接入，详见[快速开始](/guide/getting-started)。

```bash
npm i miao-design
```
:::

<ComponentGallery :filter="true" />
