docs(agents): add design references

.agents/skills/arco-design-vue/references/components/data-display/statistic.md

@@ -0,0 +1,89 @@
+---
+name: arco-vue-statistic
+description: "Arco Design Vue 数值显示 Statistic 组件参考。用于 Vue 3、`@arco-design/web-vue`、`<a-statistic>`、属性、事件、插槽、示例和实现细节。"
+user-invocable: false
+---
+
+# 数值显示 Statistic
+
+## 简介
+
+当需要突出某个或某组数字或展示带描述的统计类数据时使用。
+
+## 基本用法
+
+```vue
+<template>
+  <a-space size="large">
+    <a-statistic title="Downloads" :value="125670" show-group-separator />
+    <a-statistic extra="Comments" :value="40509" :precision="2" />
+  </a-space>
+</template>
+```
+
+## API
+
+### `<statistic>` 属性
+
+|参数名|描述|类型|默认值|版本|
+|---|---|---|:---:|:---|
+|title|数值显示的标题|`string`|`-`||
+|value|数值显示的值|`number \| Date`|`-`||
+|format|数值显示的格式 [dayjs](https://day.js.org/docs/en/display/format)（日期模式使用）|`string`|`'HH:mm:ss'`||
+|extra|额外的显示内容|`string`|`-`||
+|start|是否开始动画|`boolean`|`true`||
+|precision|小数保留位数（数字模式使用）|`number`|`0`||
+|separator|进位分隔符（数字模式使用）|`string`|`-`||
+|show-group-separator|是否展示进位分隔符（数字模式使用）|`boolean`|`false`||
+|animation|是否开启动画|`boolean`|`false`||
+|animation-duration|动画的过度时间|`number`|`2000`||
+|value-from|动画的起始值|`number`|`-`||
+|placeholder|提示文字（当 value 为 undefined 时显示）|`string`|`-`|2.28.0|
+
+> 仅列出常用项，低频属性按需查阅官方 API。
+
+### `<statistic>` 插槽
+
+|插槽名|描述|参数|
+|---|:---:|---|
+|title|标题|-|
+|prefix|前缀|-|
+|suffix|后缀|-|
+|extra|额外内容|-|
+
+### `<countdown>` 属性
+
+|参数名|描述|类型|默认值|版本|
+|---|---|---|:---:|:---|
+|title|倒计时的标题|`string`|`-`||
+|value|倒计时的值|`number`|`() => Date.now() + 300000`||
+|now|用于修正初始化时间显示不正确|`number`|`() => Date.now()`||
+|format|倒计时的展示格式 [dayjs](https://day.js.org/docs/en/display/format)|`string`|`'HH:mm:ss'`||
+|start|是否开始倒计时|`boolean`|`true`||
+|value-style|自定义显示值的样式|`CSSProperties`|`-`|2.32.0|
+
+### `<countdown>` 事件
+
+|事件名|描述|参数|
+|---|---|---|
+|finish|倒计时完成后触发的回调|-|
+
+### `<countdown>` 插槽
+
+|插槽名|描述|参数|
+|---|:---:|---|
+|title|标题|-|
+
+## 常用模式
+
+- **自定义前缀&后缀**：通过 `prefix` 和 `suffix` 插槽可以添加前后缀。
+- **数值动画**：通过 `animation` 可以开启数值动画。
+- **倒计时组件**：倒计时组件 `countdown` 的基本使用方法。
+
+## 最佳实践
+
+- 新代码优先使用 Vue 3、Composition API 和 `<script setup lang="ts">`。
+- 模板属性使用 kebab-case，事件使用 `@event-name`，插槽使用 `#slot-name`。
+- 不要套用 React 专属 API，例如 JSX children、`Component.Sub` 或 `Form.useForm`。
+- 数据展示组件只负责呈现，分页、筛选、排序等远程状态放在业务层维护。
+- 大数据量场景优先使用组件自带的分页、虚拟滚动或懒加载能力。