` 操作）。
+- `button.scss`: 此为需要贯通和统一多端的唯一真实样式源文件。在其中对于特殊设备布局的强要求是：只采用及尽量使用诸如 Flex 或者现代的 Grid 网络等能够保证多终端/跨浏览器表现一致的 CSS 现代盒模型布局模式。
+- `demo.tsx` 及 `demo.taro.tsx`：用于配套的，分别支持官方文档和移动端预览生成的样例调试场景代码，是向外传达用法的第一窗口，必需严格保证正确性。
+- `doc.md` / `doc.en-US.md` / `doc.taro.md`：不同语言和环境的详细 API 文档说明等。
+
+## 第五章：React 核心组件开发范式与规约
+
+面对具有声明式哲学但极易因为乱用特性而发生性能坍塌灾难的 React 系统，我们给出不可触碰和必须遵循的执行范式框架：
+
+### 5.1 Props 规范与向下兼容策略
+
+1. **统一基础属性继承**：
+ 定义组件 Props 前，**必须（MUST）**继承全局抽象类型 `BasicComponent`（或 `MiniProgramBasicProps` 等多端公共类型），确保组件基础能力的统一。
+
+2. **强类型声明与规范**：
+
+ - **禁止 `any`**：Props 参数需使用显式联合类型，严禁使用 `any` 逃避类型检查。
+ - **事件命名**：对外事件统一以 `onXXX`（小驼峰）命名。
+ - **精简通信**：事件通信仅传递必要数据，避免携带冗余的组件实例或私有变量。
+ - **Ref 导出**：通过 Ref 抛出的函数须采用动词起首的指令式命名（如 `close()`, `play()`）。
+
+3. **样式透传与覆写 (Overwrite)**：
+ - **必选逃生口**：根节点渲染时，**必须（MUST）**支持透传外部传入的 `className` 与 `style`。
+ - **类名合并**：推荐使用 `classnames` 库合并内部与外部样式，确保开发者能灵活定制外观。
+
+### 5.2 Refs 透传机制
+
+- **强制 `forwardRef`**：所有组件必须使用 `React.forwardRef` 包裹，确保能正常透传 Ref 引用。
+- **保护性暴露**：支持高阶组件集成及指令式操作（如手动唤起弹窗、聚焦等）。
+- **受控 API 暴露**：若需暴露内部方法，应配合 `useImperativeHandle` 仅抛出必要的 API 指令。
+
+示例结构：
+
+```tsx
+export const Button = React.forwardRef
>((props, ref) => { ... })
+```
+
+### 5.3 Hooks 与数据不可变原则
+
+1. **计算备忘 (useMemo)**：
+ 复杂逻辑或昂贵的 UI 计算结果必须使用 `useMemo`，减少父组件更新导致的重复计算卡顿。
+
+2. **函数持久化 (useCallback)**：
+ 传递给深层嵌套子组件的回调函数，须使用 `useCallback` 稳定引用，防止子组件无意义的重渲染。
+
+3. **不可变更新 (Immutable)**：
+ 严禁直接修改私有状态。必须采用“副本替换”模式（如结构赋值）产生新对象/数组，确保状态可追溯且符合 React 渲染机制。
+
+### 5.4 组件防御与容灾红线
+
+1. **防阻断式崩溃**：
+
+ - 针对入参异常、异步失败、逻辑边界等风险点，必须内置 `try-catch` 或提供兜底 UI。
+ - 组件内部错误不得外溢导致整个前端应用白屏死机。
+
+2. **禁止越权行为**：
+ - **禁止全局拦截**：组件严禁私自内置 `Error Boundary` 接管系统错误。
+ - **禁止私自追踪**：严禁在基础组件内内置埋点、错误上报 SDK 或任何侵入业务方的监控行为。
+
+## 第六章：多端适配与降级策略
+
+多端开发的核心挑战在于应对宿主环境的分裂。本章旨在规范跨端适配逻辑，确保代码在不同环境下的可维护性与健壮性。
+
+### 6.1 平台私有特性处理规范
+
+在针对特定宿主环境（如鸿蒙专属系统交互、特定小程序 API）实施私有特性时，必须遵循“逻辑解耦”原则，防止平台差异代码侵蚀核心业务逻辑。
+
+**核心准则：**
+
+1. **禁止“面条式”硬编码**：严禁在组件主脉络中直接堆砌大量的 `if (env === 'WECHAT') ...` 等环境判断语句。此类写法会导致代码难以维护，并造成工程体量失控。
+2. **抽象适配层 (Adapter)**：将平台相关的底层执行模块或交互逻辑提取到独立的适配层中，通过专用接口或方法进行桥接，实现业务逻辑与底层环境的无害化隔离。
+3. **条件编译自动剪裁**：充分利用构建环境（Webpack/Vite）的条件编译能力（如识别 `__TARO_ENV` 变量），在编译阶段自动剪裁非目标平台的代码模块，确保产物精简且物理隔离。
+
+### 6.2 特性缺失的降级与静默处理 (Fallbacks / Silencing)
+
+当组件的某项特性在目标端缺乏底层支撑时，应遵循以下降级逻辑：
+
+1. **平滑补偿**：优先设计降级表现方案，确保视觉或交互体验的连贯性。
+2. **静默容错**：若物理条件导致特性完全无法实现且无降级方案，应采取“忽略策略”，确保程序逻辑不中断、不崩溃，严禁因非核心特性缺失导致应用白屏。
+
+---
+
+## 第七章：现代前端工程化标准与工作流
+
+在现代化组件库的建设中，**60% 的核心重任在于底层工程架构的统筹与自动化流水线的建立**。只有构建好这套“骨干”，剩下 40% 的具体业务代码产出才能如同精准执行的模块搭建。
+
+希望可以通过 **TS 类型堡垒** 确保逻辑的健壮性，通过 **BEM 规范** 确保样式的稳定性。这种“标准化驱动”的工作流能够将开发者从琐碎的维护中解放出来，专注于组件逻辑的高质量产出。
+
+### 7.1 TypeScript 类型堡垒：全维度静态防御
+
+为彻底杜绝代码隐患，必须构建 100% 覆盖的 TS 防御体系，严禁“降级”开发行为。
+
+- **零容忍 `any` 与 强制断言**：
+ - 严禁为了追求开发速度而滥用 `any`。
+ - 严格限制 `as unknown as Type` 等强制类型扭转操作。
+ - 所有组件接口、方法入参、返回载体必须经过精准的类型标注与推理设计。
+- **公共服务的“防爆墙”设计**：
+ - **封装隔离**：在 `index.ts` 等入口文件中，对对外暴露的 `Props`、`Event` 接口进行统一归口管理。
+ - **自说明文档（JSDoc）**：所有公开接口必须配载详尽的 **JSDoc 注释**，标明使用场景、边界条件与注意事项。
+ - **自动化补给**：利用自研脚本提取代码中的类型与注释信息，实现**线上官方文档的自动化生成**，确保代码即文档。
+
+### 7.2 BEM 命名规范：样式结构的抽象法则
+
+为解决传统 CSS 命名空间缺失、易引发全局样式污染的痛点，组件库强制执行 **BEM (Block Element Modifier)** 方法学。
+
+| 核心概念 | 定义与职责 | 命名示例与规范 |
+| --- | --- | --- |
+| **Block (块)** | 独立的功能实体，组件最外层包裹环境。 | 使用统一前缀，如 `.nut-button`。 |
+| **Element (元素)** | 依赖于 Block 的内部子组成部分，不可脱离块独立存在。 | 使用 **单连字符** 连接：`.nut-button-icon`。 |
+| **Modifier (修饰符)** | 定义 Block 或 Element 的不同状态、版本或外观变体。 | 使用 **单连字符** 连接：`.nut-button-primary`。 |
+
+#### 落地细则：
+
+1. **Block 独立性**：每个组件必须拥有唯一的标识性前缀（如 `nut-`），确保样式在任何业务环境下具有“隔离防护性”。
+2. **Element 从属性**：通过 `-` 明确层级关系，严禁出现三级以上的嵌套（如 `.a-b-c` 是错误的），保持结构的扁平化。
+3. **Modifier 语义化**：修饰符仅用于描述状态（如 `active`、`disabled`）或规格（如 `small`、`large`），不得用于构建基础结构。
+
+---
+
+## 第八章：AI 在组件库架构与研发生态中的演进探索
+
+组件库的未来不仅在于端侧能力的扩展，更在于研发效率与生态的智能化革新。NutUI-React 将通过引入大模型 (LLM) 与 AI Agent，将 AI 深度植入开发、维护及消费全链路，构建智能化组件库新形态。
+
+### 8.1 研发效能增强：自动化文档与测试体系（Doc & Test Agent）
+
+- **现实痛点**：维护 80+ 组件的多语言文档、交互 Demo 以及高覆盖率（90%+）的单测极其耗费精力，是拖慢迭代节奏的主因。
+- **实施路径**：
+ 1. **大模型驱动的 JSDoc 文档自动补偿**：基于 `*.tsx` 严格的 Props 类型系统，利用 AI 解析上下文语义。自动生成中英双语参数描述、边缘情况警告，并结合 CI 流水线在 PR 提交前进行智能化校验与文档补全。
+ 2. **测试用例（Vitest）自生成**：利用 RAG（检索增强生成）技术读取仓库既有测试规范。当检测到新增组件或 Hooks 时，自动产出涵盖常规路径（Happy Path）与非法入参验证的单测基片，开发者仅需微调确认，预计可节省 50% 以上的开发成本。
+
+### 8.2 赋能业务消费方：智能物料与代码助手（Local UI Copilot）
+
+- **现实痛点**：传统“查阅文档 -> 拷贝代码 -> 手动拼装”的链路存在严重断层，业务方接入组件库的学习成本较高。
+- **实施路径**：
+ 1. **专精化 IDE 插件引擎**：将 NutUI-React 源码结构、Design Tokens 限制及 BEM 规范整合为知识库，构建专用的 IDE Copilot。在业务开发中实现高命中的组件导入预测与参数补全。
+ 2. **自然语言驱动的 UI 生成（Text to UI）**：在文档站集成意图理解能力。支持通过自然语言（如：“生成一个带滑动删除的商品购物车单元”）自动调度基础组件（`Swipe`, `Cell`, `InputNumber`）进行逻辑拼装，直接产出符合工程标准的 React 代码块。
+
+### 8.3 防御性治理：智能架构审查与风险预警（AI Reviewer）
+
+- **现实痛点**：核心团队难以 24 小时保持高强度审查，且人工难以完全规避细微的代码规范冲突。
+- **实施路径**：
+ 在 GitHub Actions 流程中引入 AI Reviewer，对每个 PR 进行深度扫描与风险拦截：
+ 1. **规范背离拦截**：强力识别并拦截违反 BEM 命名法则、在样式中硬编码（Hardcoding）色值等破坏系统一致性的行为。
+ 2. **跨端架构一致性监测**：针对 Taro 与 H5 的双代码基建，自动比对 API 接口层。若 `button.tsx` 新增逻辑而在 `button.taro.tsx` 中未实现对等匹配或降级补偿，系统将立即报警并打回，将不一致性风险扼杀在合并阶段。
+
+经此，AI 在 NutUI-React 生态中的角色正从**“辅助生成”**转向**“规范管控”**。通过 Doc & Test Agent 释放人力，Copilot 降低门槛，AI Reviewer 守护底线，最终实现从代码编写到生态消费的全链路智能化闭环。
+
+## 第九章：坚如磐石的质量保障体系 (QA)
+
+作为广泛依赖的基础设施，任何微小缺陷都会在业务线中被无限放大。NutUI-React 设定了极其严苛的自动化与流程化质量体系，以确保底层基石的稳固。
+
+### 9.1 测试驱动：坚守 90% 覆盖率的红线
+
+**不可无测试发版**。新增组件或大规模重构必须守住 `90%` 以上的功能分支覆盖率。
+
+- **异常与边界防御**：测试重点不仅在于主流程（Happy Path），更在于防御性场景。包括：非法属性入参的平稳恢复、高并发触发下的防抖/节流处理、以及组件销毁时事件监听的强制卸载。
+- **精准 UI 断言**：利用 Vitest 矩阵，对 DOM 核心节点及交互状态（如 Loading 图标的显隐）进行像素级的状态判定。
+
+### 9.2 严苛的性能预算限额 (Performance Budget) —— 2026 标准版
+
+针对移动端设备的硬件长尾效应，NutUI-React 参照行业顶尖标准，将性能指标从“固定上限”进化为“分级动态限额”。
+
+#### 1. 包体积预算：从“单体体积”到“树摇 (Tree Shaking) 效率”
+
+业内标准（如 Ant Design）极其关注**原子化体积**。我们不应只看总包，更要看业务方引入单一组件时的增量。
+
+| 指标 | 业内对标 (Benchmark) | NutUI 严苛标准 (Limit) |
+| --- | --- | --- |
+| **原子组件增量** | < 5KB (Gzipped) | **≤ 3KB** (如 Button, Icon) |
+| **复合组件增量** | < 30KB (Gzipped) | **≤ 20KB** (如 Picker, Calendar) |
+| **Tree Shaking 损耗** | < 10% | **≤ 5%** (禁止任何副作用 Side Effects) |
+
+- **标准升级**：所有组件必须通过 `size-limit` 监控。若新功能导致 Gzip 体积增量超过 `500B`，必须在 PR 中提交体积膨胀说明。
+
+#### 2. 运行时预算：基于 RAIL 模型的感知阈值
+
+参考 Google 的 RAIL 性能模型，组件的响应必须符合人类直觉的生理极限。
+
+- **交互响应 (Response)**：从用户点击到组件视觉反馈（如波纹效果或状态切换），必须在 **50ms** 内完成，确保极速手感。
+- **动画流畅度 (Animation)**：所有过渡动画（如 Drawer 弹出）必须稳定在 **60fps**。折合每帧渲染时间 **≤ 16.6ms**（高刷屏设备要求 **≤ 8ms**）。
+- **长列表滚动 (Jank-free)**：在百级数据下，滚动时的脚本执行时间（Scripting Time）不得连续超过 **2 帧 (32ms)**，防止掉帧。
+
+#### 3. 渲染效率：虚拟化与时间分片 (Time Slicing)
+
+针对复杂组件，我们引入 React 18+ 的并发特性指标：
+
+- **渲染中断时长**：单个组件的同步渲染（Blocking Render）时长不得超过 **100ms**。超过此阈值的复杂计算必须使用 `useTransition` 或 `useDeferredValue` 降级，避免阻塞主线程。
+- **虚拟化强制令**：对于 List、Table、Tree 等容器类组件，当数据量超过 **50 条**时，必须强制开启（或提供）**虚拟滚动 (Virtual List)** 方案。
+
+#### 4. 内存与稳定性：防患于“泄露”未然
+
+内存预算不仅是总量控制，更是对“增长曲线”的监控。
+
+- **内存增量红线**：连续操作组件（如反复打开/关闭 Modal）10 次后，堆内存（Heap Size）增量应 **< 1MB**。
+- **对象持有检查**：严禁在全局作用域持有组件实例。卸载后，组件关联的 DOM 节点必须被完全垃圾回收（通过 Chrome DevTools 的 Detached Elements 检查）。
+
+#### 5. 自动化性能监控流水线 (Performance CI)
+
+为了让上述标准不沦为纸面文档，我们强制执行以下流程：
+
+1. **Lighthouse CI**：在预览环境下自动跑分，性能（Performance）分值低于 **90** 自动拦截合并。
+2. **Chrome Trace Bot**：利用自动化脚本模拟用户操作，抓取 `long tasks` 指标，若 PR 引入了超过 **50ms** 的 long task，则触发报警。
+
+### 9.3 绝对防御：硬核前端安全红线
+
+作为底层框架，组件库必须为业务方构筑第一道安全屏障：
+
+1. **注入攻击防护**：涉及外部输入渲染的模块（如富文本 Props），**必须**内置严格的 XSS 转义过滤与 URL 协议白名单检测，阻断恶意脚本渗透。
+2. **敏感信息脱敏**：严禁在生产环境包中保留 `console.log()` 或带有框架内部特征的调试信息。所有关键路径必须具备异常隔离机制，防止底层调用特性被恶意探测。
+
+### 9.4 拥抱无障碍体验 (Accessibility - A11y)
+
+我们坚持让视障或运动障碍群体也能无障碍地使用 NutUI。
+
+- **语义化注入**：所有组件强制支持 Web ARIA 标准属性。
+- **A11y 落地准则**：
+ - **视觉隔离**：装饰性图标需显式标注 `aria-hidden="true"`，避免读屏器冗余干扰。
+ - **交互补全**：无文本按钮必须具备 `aria-label` 描述词；表单组件须实时联动 `aria-checked` 或 `aria-invalid` 等状态控制标记。
+
+本章所设立的**覆盖率红线、性能预算、安全防御及 A11y 标准**，共同构成了 NutUI-React 的质量围栏。这不仅是对代码负责，更是对千万级业务流量的底线承诺。
+
+## 第十章：版本发布与代码审查规范 (CR)
+
+代码是团队的集体财产，而非个人的艺术画板。NutUI-React 的审查规则旨在防范“破窗效应”，确保每一行合并进主干的代码都符合工程化基准。
+
+### 10.1 严密的语义化版本模型 (SemVer)
+
+所有发布必须严格遵循 `SemVer` 规范，确保版本号单向线性递增，严禁隐性变更。
+
+- **主版本号 (Major - x.0.0)**：仅用于架构级巨变或**不可向后兼容的 Breaking Changes**（如底层框架升级、核心 API 彻底重构）。
+- **次版本号 (Minor - 0.y.0)**：用于**新增功能**。如发布新组件、为主力组件新增向下兼容的 Props 或方法。
+- **修订号 (Patch - 0.0.z)**：仅用于**缺陷修复 (Bugfixes)** 与静默的性能优化，必须保证对业务方的完全透明与兼容。
+
+### 10.2 生命周期管理：回退与废弃准则
+
+- **应急回退 (Rollback)**：若版本更新引发生产级灾难，必须在执行回滚的同时，同步发布**公开回退声明**，并归档事故追踪日志（Post-mortem），指引受影响的业务方平稳降级。
+- **克制的废弃 (Deprecation)**：禁止对陈旧组件进行“暴力砍除”。废弃流程必须分步执行：
+ 1. **标记**：添加 `@deprecated` 标注，在控制台输出升级指引。
+ 2. **陪伴期**：在接下来的一个完整 **Minor** 周期内，继续提供严重的 Bug 修复支持。
+ 3. **清退**：仅在跨 Major 版本时，方可正式移除已废弃的代码。
+
+### 10.3 PR 审查“三关口”核查法则 (The SWAT Checklist)
+
+任何特性分支（PR）在合并前，必须由核心成员（Maintainer）参照以下准则进行强制审查：
+
+#### 第一关：自动化预审 (Pre-Review Auto-Check)
+
+- [ ] **语法与 Lint**：`npm run lint` 无报错，命名符合 BEM 规范，无硬编码颜色/边距。
+- [ ] **类型安全**：`npm run tsc` 无类型错误，Props 继承自 `BasicComponent`，严禁 `any` 侵袭。
+- [ ] **测试覆盖率**：自动化 CI 流水线绿灯，新增/修改代码的功能分支覆盖率必须 > 90%。
+
+#### 第二关：架构与多端一致性 (Core Architecture Review)
+
+- [ ] **多端对齐**：确保 `.tsx` (H5) 与 `.taro.tsx` (Taro) 的功能实现、API 签名及交互体验高度一致。
+- [ ] **环境隔离**：核实 Taro 实现中严禁使用原生 DOM API，且使用了正确的语义化标签（如 `View` 替代 `div`）。
+- [ ] **API 设计**：事件回调以 `on` 起首，属性命名符合语义描述，确保 API 具备良好的向下兼容性。
+- [ ] **物料同步**：中/英/Taro 文档已同步更新，且配套的 Demo 示例代码能准确演示本次变更的特性。
+
+#### 第三关：性能、健壮性与安全 (Performance & Robustness)
+
+- [ ] **渲染效率**：检查昂贵逻辑的 `useMemo` 及回调函数的 `useCallback` 缺失风险，避免无意义的重渲染。
+- [ ] **副作用管理**：所有 `useEffect` 必须具备对应的 `cleanup` 逻辑（如解绑事件、销毁观察者）。
+- [ ] **容灾与安全**：关键路径有错误捕获（Try/Catch）及防御性布局，无 `console.log` 等调试信息遗留，富文本类 Props 经过脱敏转义处理。
+- [ ] **Ref 透传**：底层组件通过 `React.forwardRef` 正确暴露了必要的内部实例或命令式方法。
+
+本章不仅是发布指南，更是 NutUI-React 的**“基本法”**。通过严密的 SemVer 保护外部调用者，通过三道 CR 关口保护内部代码质量，最终实现组件库的长效健康。
+
+## 第十一章：社区共建与未来演进 (Community & Evolution)
+
+NutUI-React 的繁衍脱变离不开开源社区的支持与贡献。构建一套透明、高效的开源协同机制，是确保项目长青的核心方针。
+
+### 11.1 Issue 处理与需求分流机制
+
+为了平衡社区诉求与框架的通用性，所有问题反馈应遵循以下机制：
+
+- **缺陷限时响应**：确认属于核心代码或兼容性设计的 Issue，核心团队将快速打标并分配处理，并在最近的 Patch 版本中发布补丁。
+- **需求研讨机制 (Discussions)**：对于非通用型组件或偏门特性的新增诉求，不再直接进入开发流，而是引导至 `Discussions` 区域进行场景合理性研讨。当需求具备充分的通用性并达成社区共识后，方可转入正式开发规划。
+
+### 11.2 后续长期演进战略蓝图
+
+组件生态的建设是一项长期工程。在夯实前十章所述的基础规范之上，NutUI-React 将在以下深水区持续探索：
+
+- **深度适配鸿蒙原生生态**：超越目前的编译态适配，探索与鸿蒙底层设备特性的深度融合，实现真正的原生性能体验。
+- **全链路响应式与大屏适配**：打通跨端（折叠屏、Pad、桌面端）的布局边界，提供更智能的响应式布局方案。
+- **业务域复合块 (Business UI Blocks) 建设**：由原子组件向高阶业务块进化，提供具备完整业务逻辑内聚的领域级组件模版。
+
+NutUI-React 期待与全球开发者共同打磨这款跨端利刃。标准的演进是一个动态迭代的过程，唯有敬畏规范、拥抱变化，才能确保代码库生命树的基业长青。
+
+---
+
+由于文章系统构建复杂，涉及广阔的工程边界，极具深度。上述白皮书全本（共十一章）现已涵盖组件标准最为基层的建设价值观理念、深度横向跨多端的复杂架构模型策略导向方案、纯粹的且苛刻的代码级防线开发要求的全部底线说明等。也指明了未来我们将面临且拥抱在包括诸如 AI 化提效大潮乃至拥抱原生生态的体系内演进化工程发展目标长久愿景。这是 NutUI-React 稳步行走向前的“基本法”。我们由衷期待并将继续见证更多的开发者以此书作为契机，投身加入到这片开源共荣生态建设，一同推动属于每一个人的 NutUI 体系走向远大前程。
+
+> **状态**：第一版 (最终稿)
+> **编写团队**：NutUI-React 核心自治委员会
+> **维护预期**：本标准具备即时约束力。在通过 PR/Merge 时将严格以此文件规约作为检验核心。
diff --git a/scripts/a11y-governance.mjs b/scripts/a11y-governance.mjs
new file mode 100644
index 0000000000..b870c8817e
--- /dev/null
+++ b/scripts/a11y-governance.mjs
@@ -0,0 +1,154 @@
+import fs from 'fs'
+import path from 'path'
+import { glob } from 'glob'
+
+/**
+ * NutUI-React 无障碍治理统一脚本
+ *
+ * 功能：
+ * 1. 自动为装饰性图标添加 aria-hidden (Web) / ariaHidden (Taro)。
+ * 2. 自动将 Taro (.taro.tsx) 中的无障碍属性转为驼峰式。
+ * 3. 修复 JSX 语法瑕疵 (如 / /> 转为 />) 并保护箭头函数。
+ * 4. 排除系统级非图标组件 (SearchBar, Tag 等)。
+ */
+
+// 提取文件中从 @nutui/icons-react 引入的组件名
+const getImportedIcons = (content) => {
+ const iconImports = []
+ const importRegex = /import\s+\{([^}]+)\}\s+from\s+['"]@nutui\/icons-react(?:-taro)?['"]/g
+ let match
+ while ((match = importRegex.exec(content)) !== null) {
+ const imports = match[1]
+ .split(',')
+ .map((s) => s.trim())
+ .filter(Boolean)
+ .map((s) => s.split(/\s+as\s+/)[0]) // 处理 import { Close as MyClose }
+ iconImports.push(...imports)
+ }
+ return new Set(iconImports)
+}
+
+// 定义功能性图标及其默认标签 (中文字符串)
+const functionalLabels = {
+ Close: '关闭',
+ Plus: '增加',
+ Minus: '减少',
+ Del: '删除',
+ Delete: '删除',
+ Failure: '失败',
+ Error: '错误',
+ Success: '成功',
+ Check: '完成',
+ Left: '上一页',
+ Right: '下一页',
+ ArrowLeft: '上一页',
+ ArrowRight: '下一页',
+ Notice: '通知',
+}
+
+const runGovernance = async () => {
+ const files = await glob('src/packages/**/*.{tsx,taro.tsx}')
+ console.log(`🚀 Starting Intelligent A11y Governance for ${files.length} files...`)
+
+ let processedCount = 0
+
+ files.forEach((file) => {
+ const isTaro = file.endsWith('.taro.tsx')
+ let content = fs.readFileSync(file, 'utf-8')
+ const originalContent = content
+
+ const importedIcons = getImportedIcons(content)
+
+ // 步骤 1：Taro 属性规范化 (仅限 .taro.tsx)
+ if (isTaro) {
+ const mapping = {
+ 'aria-label=': 'ariaLabel=',
+ 'aria-checked=': 'ariaChecked=',
+ 'aria-disabled=': 'ariaDisabled=',
+ 'aria-busy=': 'ariaBusy=',
+ 'aria-hidden="true"': 'ariaHidden',
+ 'aria-hidden ': 'ariaHidden ',
+ }
+ Object.entries(mapping).forEach(([key, val]) => {
+ content = content.replace(new RegExp(key, 'g'), val)
+ })
+ }
+
+ // 步骤 2：图标智能治理
+ const iconPattern = /<([A-Z][a-zA-Z0-9]+)\s+([^>]*?)\/?>/g
+ content = content.replace(iconPattern, (match, tagName, attrs) => {
+ if (importedIcons.has(tagName)) {
+ // 识别交互属性 (onClick, onTouchStart, onXxx)
+ const hasEventHandler = /on[A-Z][a-zA-Z]+[=\s{]/.test(attrs)
+ const label = functionalLabels[tagName]
+
+ // 如果已经是正确的功能图标治理，且已有 label，或者是不需要的治理，跳过
+ const hasLabel = attrs.includes('aria-label') || attrs.includes('ariaLabel')
+ const hasHidden = attrs.includes('aria-hidden') || attrs.includes('ariaHidden')
+
+ // 判定：是否有事件，或者该图标在功能性映射表中
+ const isFunctional = hasEventHandler || !!label
+
+ const labelAttrPrefix = isTaro ? 'ariaLabel' : 'aria-label'
+ const hiddenAttr = isTaro ? 'ariaHidden' : 'aria-hidden="true"'
+
+ let cleanAttrs = attrs.replace(/\/\s*$/, '').trim()
+
+ if (isFunctional) {
+ // 如果是功能图标，必须有 label 且不能有 hidden
+ if (hasHidden) {
+ // 纠错：移除 aria-hidden (包括两边的空格)
+ cleanAttrs = cleanAttrs.replace(/\s*(aria-hidden="true"|ariaHidden)\s*/g, ' ').trim()
+ }
+
+ if (!hasLabel) {
+ const finalLabel = label || '操作'
+ const labelAttr = `${labelAttrPrefix}="${finalLabel}"`
+ if (cleanAttrs === '') {
+ return `<${tagName} ${labelAttr} />`
+ }
+ return `<${tagName} ${labelAttr} ${cleanAttrs} />`
+ }
+
+ // 如果已经有 label 且之前有 hidden，返回修复后的标签
+ if (hasHidden) {
+ if (cleanAttrs === '') {
+ return `<${tagName} />`
+ }
+ return `<${tagName} ${cleanAttrs} />`
+ }
+ return match
+ } else {
+ // 如果是装饰性图标，必须有 hidden 且最好没 label
+ if (hasHidden || hasLabel) return match // 已经治理过或被标记为功能性
+
+ if (cleanAttrs === '') {
+ return `<${tagName} ${hiddenAttr} />`
+ }
+ return `<${tagName} ${hiddenAttr} ${cleanAttrs} />`
+ }
+ }
+ return match
+ })
+
+ // 步骤 3：语法清理 & 保护箭头函数
+ // 将 "/ />" 修复为 "/>"，但防止误伤 "=>"
+ content = content.replace(/\/ \/>/g, '/>')
+
+ // 步骤 4：恢复由于误匹配可能导致的箭头函数损坏 (针对极极端情况)
+ content = content.replace(/= \/>/g, '=>')
+
+ if (content !== originalContent) {
+ fs.writeFileSync(file, content, 'utf-8')
+ console.log(`✅ [FIXED] ${file}`)
+ processedCount++
+ }
+ })
+
+ console.log(`\n✨ Governance complete! Modified ${processedCount} files.`)
+}
+
+runGovernance().catch((err) => {
+ console.error('❌ Error during A11y governance:', err)
+ process.exit(1)
+})
diff --git a/scripts/build-copilot-ctx.mjs b/scripts/build-copilot-ctx.mjs
new file mode 100644
index 0000000000..921cee421f
--- /dev/null
+++ b/scripts/build-copilot-ctx.mjs
@@ -0,0 +1,93 @@
+import fs from 'fs'
+import path from 'path'
+
+const PROPERTIES_PATH = './scripts/properties.json'
+const VARIABLES_PATH = './src/styles/variables.scss'
+const OUTPUT_PATH = './scripts/copilot/instructions.md' // 改为脚本同级的 copilot 文件夹下
+
+async function buildKnowledge() {
+ console.log('🚀 Starting NutUI-React AI Knowledge Building...')
+
+ // 1. Load Properties (Component APIs)
+ if (!fs.existsSync(PROPERTIES_PATH)) {
+ console.error('❌ properties.json not found')
+ return
+ }
+ const properties = JSON.parse(fs.readFileSync(PROPERTIES_PATH, 'utf-8'))
+
+ // Group by Component
+ const components = {}
+ properties.forEach(item => {
+ const name = item['组件名']
+ if (!components[name]) components[name] = []
+ components[name].push({
+ prop: item['第一列'],
+ desc: item['第二列'],
+ type: item['第三列'],
+ default: item['第四列']
+ })
+ })
+
+ // 2. Load Tokens (Styles)
+ if (!fs.existsSync(VARIABLES_PATH)) {
+ console.error('❌ variables.scss not found')
+ return
+ }
+ const variablesContent = fs.readFileSync(VARIABLES_PATH, 'utf-8')
+ const tokenRegex = /\x24(color|font|spacing|radius)-([\w-]+):\s*var\((--nutui-[\w-]+).*?\)/g
+ const tokens = []
+ let match
+ while ((match = tokenRegex.exec(variablesContent)) !== null) {
+ tokens.push({
+ sass: match[0].split(':')[0],
+ css: match[3],
+ })
+ }
+
+ // 3. Generate Markdown for Copilot
+ let md = `# NutUI-React AI 研发助手指令库 (Single Source of Truth)\n\n`
+
+ md += `## 1. 核心工程规范 (Core Rules)\n`
+ md += `### 命名规范 (Naming Convention)\n`
+ md += `- **前缀**: 所有组件和业务类名强制使用 \`nut-\` 前缀。\n`
+ md += `- **模式**: \`.nut-{block}-{suffix}\`（NutUI 采用扁平化的单连字符模式，而非标准的双下划线 BEM）。\n`
+ md += `- **示例**:\n`
+ md += ` - 正确: \`...
\`\n`
+ md += ` - 正确: \`...
\`\n`
+ md += ` - 错误: \`...
\` (不要使用双下划线)\n\n`
+
+ md += `### Design Tokens 使用原则\n`
+ md += `- **严禁硬编码**: 禁止在 SCSS/Inline Style 中使用 Hex/RGB 颜色（如 #FFFFFF）。\n`
+ md += `- **变量映射**: 必须使用 CSS 变量，格式为 \`var(--nutui-[\w-]+)\`。\n`
+ md += `- **常见变量**:\n`
+ tokens.slice(0, 50).forEach(t => {
+ md += ` - \`${t.css}\` (用途: ${t.sass.replace('$color-', '').replace('$spacing-', '')})\n`
+ })
+ md += `\n`
+
+ md += `## 2. 组件 API 智能参考 (Component Dictionary)\n`
+ md += `以下是 NutUI-React 核心组件的参数规范，补全时请参考中文描述：\n\n`
+
+ Object.keys(components).forEach(name => {
+ md += `### <${name} />\n`
+ md += `| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |\n`
+ md += `| :--- | :--- | :--- | :--- |\n`
+ components[name].forEach(p => {
+ md += `| ${p.prop} | ${p.desc} | \`${p.type}\` | ${p.default} |\n`
+ })
+ md += `\n`
+ })
+
+ md += `\n---\n*Generated by NutUI AI Metadata Tool. DO NOT manual edit.*\n`
+
+ // Ensure directory exists
+ const dir = path.dirname(OUTPUT_PATH)
+ if (!fs.existsSync(dir)) {
+ fs.mkdirSync(dir, { recursive: true })
+ }
+
+ fs.writeFileSync(OUTPUT_PATH, md)
+ console.log(`✅ AI Knowledge Base generated at ${OUTPUT_PATH}`)
+}
+
+buildKnowledge()
diff --git a/scripts/copilot/README.md b/scripts/copilot/README.md
new file mode 100644
index 0000000000..1dd8f6e88e
--- /dev/null
+++ b/scripts/copilot/README.md
@@ -0,0 +1,37 @@
+# NutUI-React AI 研发助手库使用说明
+
+这是一个为 AI 编程助手（如 GitHub Copilot, Cursor）设计的 NutUI-React 专用知识增强包。通过它，AI 能更精准地理解 NutUI 的 **BEM 规范**、**Design Tokens** 以及 **组件 API**。
+
+## 📂 目录结构
+
+- `instructions.md`: 核心指令库。包含全量补全规范与 API 索引。
+- `../build-copilot-ctx.mjs`: 知识库自动提取脚本（建议组件库更新后运行）。
+
+## 🛠 如何使用 (业务方开发同学)
+
+### 方式一：作为项目指令 (推荐)
+
+1. 将 `instructions.md` 拷贝到你的业务项目根目录。
+2. 重命名为 `.github/copilot-instructions.md`。
+3. **效果**：你的 Copilot Chat 和自动补全将自动识别 NutUI 规范。当你说“写一个按钮”时，AI 会自动帮你带上 `nut-button` 前缀。
+
+### 方式二：在 Copilot Chat 中按需挂载
+
+1. 在 VS Code 的 Copilot 聊天框中输入 `#file`。
+2. 选择本目录下的 `instructions.md`。
+3. **效果**：AI 会在本次对话中参考最新的 NutUI 组件参数。
+
+## 🔄 维护与更新 (组件库核心成员)
+
+如果您在 `src/packages` 中新增了组件或修改了 `Props`，请运行以下命令刷新知识库：
+
+```bash
+node scripts/build-copilot-ctx.mjs
+```
+
+脚本会自动同步 `scripts/properties.json` 和 `src/styles/variables.scss` 的最新数据。
+
+## 💡 开发 Tip
+
+- **类名自动生成**：引入该指令后，AI 生成类名时会严格遵循 `.nut-{block}-{suffix}` 格式（如 `.nut-button-text`）。
+- **Token 智能联想**：尝试输入 `color: var(--nut`，AI 会根据本知识库的内容提示正确的 Token 变量。
diff --git a/scripts/copilot/instructions.md b/scripts/copilot/instructions.md
new file mode 100644
index 0000000000..ab8fc19efb
--- /dev/null
+++ b/scripts/copilot/instructions.md
@@ -0,0 +1,1456 @@
+# NutUI-React AI 研发助手指令库 (Single Source of Truth)
+
+## 1. 核心工程规范 (Core Rules)
+
+### 命名规范 (Naming Convention)
+
+- **前缀**: 所有组件和业务类名强制使用 `nut-` 前缀。
+- **模式**: `.nut-{block}-{suffix}`（NutUI 采用扁平化的单连字符模式，而非标准的双下划线 BEM）。
+- **示例**:
+ - 正确: `...
`
+ - 正确: `...
`
+ - 错误: `...
` (不要使用双下划线)
+
+### Design Tokens 使用原则
+
+- **严禁硬编码**: 禁止在 SCSS/Inline Style 中使用 Hex/RGB 颜色（如 #FFFFFF）。
+- **变量映射**: 必须使用 CSS 变量，格式为 `var(--nutui-[w-]+)`。
+- **常见变量**:
+ - `--nutui-color-primary` (用途: primary)
+ - `--nutui-color-primary-stop-1` (用途: primary-stop-1)
+ - `--nutui-color-primary-stop-2` (用途: primary-stop-2)
+ - `--nutui-color-primary-pressed` (用途: primary-pressed)
+ - `--nutui-color-primary-disabled` (用途: primary-disabled)
+ - `--nutui-color-primary-icon` (用途: primary-icon)
+ - `--nutui-color-default` (用途: default)
+ - `--nutui-color-default-pressed` (用途: default-pressed)
+ - `--nutui-color-default-light` (用途: default-light)
+ - `--nutui-color-default-disabled` (用途: default-disabled)
+ - `--nutui-color-info` (用途: info)
+ - `--nutui-color-info-pressed` (用途: info-pressed)
+ - `--nutui-color-info-disabled` (用途: info-disabled)
+ - `--nutui-color-info-light` (用途: info-light)
+ - `--nutui-color-info` (用途: info-text)
+ - `--nutui-color-success` (用途: success)
+ - `--nutui-color-success-disabled` (用途: success-disabled)
+ - `--nutui-color-success-text` (用途: success-text)
+ - `--nutui-color-warning` (用途: warning)
+ - `--nutui-color-warning-disabled` (用途: warning-disabled)
+ - `--nutui-color-warning-text` (用途: warning-text)
+ - `--nutui-color-danger` (用途: danger)
+ - `--nutui-color-danger-pressed` (用途: danger-pressed)
+ - `--nutui-color-danger-light` (用途: danger-light)
+ - `--nutui-color-danger-text` (用途: danger-text)
+ - `--nutui-color-background` (用途: background)
+ - `--nutui-color-mask` (用途: mask)
+ - `--nutui-color-mask-part` (用途: mask-part)
+ - `--nutui-color-border` (用途: border)
+ - `--nutui-color-border-disabled` (用途: border-disabled)
+ - `--nutui-color-title` (用途: title)
+ - `--nutui-color-text` (用途: text)
+ - `--nutui-color-text-help` (用途: text-help)
+ - `--nutui-color-text-disabled` (用途: text-disabled)
+ - `--nutui-color-text-link` (用途: text-link)
+ - `--nutui-font-size-xxxs` (用途: $font-size-xxxs)
+ - `--nutui-font-size-xxs` (用途: $font-size-xxs)
+ - `--nutui-font-size-xs` (用途: $font-size-xs)
+ - `--nutui-font-size-s` (用途: $font-size-s)
+ - `--nutui-font-size-base` (用途: $font-size-base)
+ - `--nutui-font-size-l` (用途: $font-size-l)
+ - `--nutui-font-size-icon` (用途: $font-size-icon)
+ - `--nutui-font-size-xl` (用途: $font-size-xl)
+ - `--nutui-font-size-xxl` (用途: $font-size-xxl)
+ - `--nutui-font-size-10` (用途: $font-size-xxxl)
+ - `--nutui-font-size-11` (用途: $font-size-xxxxl)
+ - `--nutui-font-weight-light` (用途: $font-weight-light)
+ - `--nutui-font-weight` (用途: $font-weight)
+ - `--nutui-font-weight-medium` (用途: $font-weight-medium)
+ - `--nutui-font-weight-bold` (用途: $font-weight-bold)
+
+## 2. 组件 API 智能参考 (Component Dictionary)
+
+以下是 NutUI-React 核心组件的参数规范，补全时请参考中文描述：
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| type | 按钮的样式 | ``default` | `primary` | `info` | `warning` | `danger` | `success`` | default |
+| size | 按钮的尺寸 | ``normal` | `large` | `small`` | normal |
+| shape | 按钮的形状 | ``square` | `round`` | round |
+| color | 按钮颜色，支持传入 linear-gradient 渐变色 | `string` | - |
+| fill | 填充模式 | ``solid` | `ouline` | `none`` | solid |
+| disabled | 是否禁用按钮 | `boolean` | false |
+| block | 是否为块级元素 | `boolean` | false |
+| icon | 按钮图标 | `ReactNode` | - |
+| loading | 按钮loading状态 | `boolean` | false |
+| onClick | 点击按钮时触发 | `onClick: (e: MouseEvent) => void` | false |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| title | 分组标题 | `ReactNode` | - |
+| description | 分组描述 | `ReactNode` | - |
+| divider | 单元格之间是否有分割线 | `boolean` | true |
+
+### |
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| title | 标题 | `ReactNode` | - |
+| description | 描述 | `ReactNode` | - |
+| extra | 右侧描述 | `ReactNode` | - |
+| radius | 圆角半径 | `string` | 6px |
+| align | 纵轴方向上的对齐方式，可选值为：`flex-start`、`center`、`flex-end` | `string` | flex-start |
+| onClick | 点击事件 | `onClick: (event: React.MouseEvent) => void` | false |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| locale | 设置多语言包 | `BaseLang` | zhCN |
+| theme | 设置主题 | `Record` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| name | 图标名称或图片链接 | `string` | - |
+| color | 图标颜色 | `string` | - |
+| width | 图标大小，如 `20px` `2em` `2rem` | ``string` | `object`` | - |
+| height | 图标大小，如 `20px` `2em` `2rem` | ``string` | `object`` | - |
+| onClick | 点击图标时触发 | `event: Event` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| name | 图标名称或图片链接 | `string` | - |
+| color | 图标颜色 | `string` | - |
+| size | 图标大小，如 `20px` `2em` `2rem` | ``string` | `number`` | - |
+| classPrefix | 类名前缀，用于使用自定义图标 | `string` | nut-iconfont |
+| fontClassName | 自定义 icon 字体基础类名 | `string` | nutui-iconfont |
+| tag | tsx 标签 | `string` | i |
+| onClick | 点击图标时触发 | `event: Event` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| src | 图片链接 | `string` | - |
+| fit | 图片填充模式，等同于原生的 object-fit 属性 | `ImageFit` | fill |
+| position | 图片位置，等同于原生的 object-position 属性 | `ImagePosition` | center |
+| alt | 替代文本 | `string` | - |
+| width | 宽度，默认单位`px` | `string` | - |
+| height | 高度，默认单位`px` | `string` | - |
+| radius | 圆角大小 | ``string` | `number`` | - |
+| error | 是否展示图片加载失败 | ``boolean | ReactNode`` | true |
+| loading | 是否展示加载中图片 | ``boolean | ReactNode`` | true |
+| lazy | 是否为懒加载图片 | `boolean` | false |
+| onClick | 点击图片时触发 | `(e: MouseEvent) => void` | - |
+| onLoad | 图片加载完后触发 | `() => void` | - |
+| onError | 图片加载失败后触发 | `() => void` | - |
+| contain | 保持宽高缩放图片，使图片的长边能完全显示出来 | `` | |
+| cover | 保持宽高缩放图片，使图片的短边能完全显示出来，裁剪长边 | `` | |
+| fill | 拉伸图片，使图片填满元素 | `` | |
+| none | 保持图片原有尺寸 | `` | |
+| scale-down | 取 none 或 contain 中较小的一个 | `` | |
+| center | 居中对齐 | `` | |
+| top | 顶部对齐 | `` | |
+| right | 右侧对齐 | `` | |
+| bottom | 底部对齐 | `` | |
+| left | 左侧对齐 | `` | |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| visible | 当前组件是否显示 | `boolean` | false |
+| zIndex | 遮罩层级 | `number` | 2000 |
+| duration | 动画时长，单位秒 | `number` | 0.3 |
+| lockScroll | 背景是否锁定 | `boolean` | true |
+| closeOnOverlayClick | 是否点击遮罩关闭 | `boolean` | true |
+| onClick | 点击时触发 | `event: Event` | - |
+| afterClose | 完全关闭后触发 | `() => void` | - |
+| afterShow | 完全展示后触发 | `() => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| contentPosition | 内容位置 | ``left` | `center` | `right`` | center |
+| direction | 水平还是垂直类型 | ``horizontal` | `vertical`` | horizontal |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| columns | 列数 | ``number` | `string`` | 4 |
+| gap | 格子之间的间距，默认单位为`px` | ``number` | `string`` | 0 |
+| center | 是否将格子内容居中显示 | `boolean` | true |
+| square | 是否将格子固定为正方形 | `boolean` | false |
+| reverse | 内容翻转 | `boolean` | false |
+| direction | 格子内容排列的方向 | ``horizontal` | `vertical`` | vertical |
+| onClick | 宫格子项点击事件 | `(index) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| text | 文字 | ``string` | `ReactNode`` | - |
+| onClick | 点击格子时触发 | `(event: Event) => void` | - |
+
+### |
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| type | 布局方式，可选值为flex | `string` | - |
+| gutter | 列元素之间的间距（单位为px） | ``string` | `number`` | 0 |
+| justify | Flex 主轴对齐方式，可选值为 start end center space-around space-between | `string` | start |
+| align | Flex 交叉轴对齐方式，可选值为 flex-start center flex-end | `string` | flex-start |
+| wrap | Flex是否换行，可选值为 nowrap wrap reverse | `string` | nowrap |
+| onClick | Fired when clicked | ``event: MouseEvent, type: 'row' | 'col'`` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| span | 列元素宽度（共分为24份，例如设置一行3个，那么span值为8） | ``string` | `number`` | 24 |
+| offset | 列元素偏移距离 | ``string` | `number`` | 0 |
+| onClick | 点击时触发 | ``event: MouseEvent, type: 'row' | 'col'`` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| position | 吸附位置 | ``top` | `bottom`` | top |
+| threshold | 距离，当 position 为 top 时，设置的是 top | `number` | 0 |
+| zIndex | 吸附时的层级 | `number` | 2000 |
+| container | 容器的 ref | `React.RefObject` | - |
+| onChange | 吸附状态改变时触发 | `(val: boolean) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| target | 获取监听的目标元素 | `string` | - |
+| threshold | 页面垂直滚动多高后出现 | `number` | 200 |
+| zIndex | 设置组件页面层级 | `number` | 10 |
+| duration | 设置动画持续时间，为 0 时表示无动画 | `number` | 1000 |
+| onClick | 按钮点击时触发事件 | `(event: MouseEvent) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| height | 电梯区域的高度 | ``number` | `string`` | 200px |
+| floorKey | 索引 key 值 | `string` | title |
+| list | 索引列表 | `Array（item 需包含 id、name 属性, name 支持传入 html 结构）` | [{id: 0, name: ''}] |
+| sticky | 索引是否吸顶 | `boolean` | false |
+| showKeys | 展示右侧导航 | `boolean` | true |
+| spaceHeight | 右侧锚点的上下间距 | `number` | 23 |
+| titleHeight | 左侧索引的高度 | `number` | 35 |
+| onClickItem | 点击内容 | `onClickItem:(key: string, item: { id: number, name: string })=>void` | false |
+| onClickIndex | 点击索引 | `onClickIndex:(key: string)=>void` | false |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| visible | 是否打开 | `boolean` | false |
+| list | 悬浮列表内容数据 | `Array` | [] |
+| activeText | 收起列表按钮文案 | `string` | 收起导航 |
+| inactiveText | 展开列表按钮文案 | `string` | 快速导航 |
+| type | 导航方向 | ``left` | `right`` | right |
+| overlay | 展开时是否显示遮罩 | `boolean` | true |
+| position | fixed 垂直位置 | `object` | {top: 'auto', bottom: 'auto'} |
+| content | 自定义按钮 | `ReactNode` | - |
+| onChange | 展开收起按钮回调 | `value: boolean` | - |
+| onSelect | 选择之后触发 | `item, event: MouseEvent` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| right | 右侧内容 | `ReactNode` | - |
+| left | 左侧内容，渲染在返回区域的右侧 | `ReactNode` | - |
+| back | 返回区域的文字 | `ReactNode` | - |
+| fixed | 是否固定 | `boolean` | false |
+| safeArea | 是否适配安全区 | `boolean` | false |
+| placeholder | 固定在顶部时，是否在标签位置生成一个等高的占位元素 | `boolean` | false |
+| zIndex | 导航栏层级 | ``number` | `string`` | 10 |
+| onClickBack | 点击返回区域后的回调 | `onClickBack:(event: Event)=>void` | false |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| visible | 组件是否显示 | `boolean` | false |
+| title | 整体标题 | `string` | - |
+| width | 遮罩宽度百分比 | `string` | 80% |
+| position | 弹出位置 | ``left` | `right`` | left |
+| indent | 缩进宽度 | `number` | 20 |
+| onClose | 关闭遮罩时触发 | `-` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| value | 导航唯一标识 | ``string` | `number`` | - |
+| title | 整体标题 | `string` | - |
+| open | 导航是否默认展开 | `boolean` | true |
+| onClick | 导航点击 | ``data: {title: string, value: string | number, isShow: boolean}`` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| value | 导航唯一标识 | ``string` | `number`` | - |
+| title | 整体标题 | `string` | - |
+| onClick | 导航点击 | ``data: {title: string, value: string | number}`` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| defaultValue | 默认选中的标签的索引值 | `number` | 0 |
+| value | 选中的标签的索引值 | `number` | - |
+| fixed | 是否固定在页面底部，为 true 时默认开启 safeArea | `boolean` | false |
+| activeColor | icon激活的颜色 | `string` | #1989fa |
+| inactiveColor | icon未激活的颜色 | `string` | #7d7e80 |
+| safeArea | 是否开启iphone系列全面屏底部安全区适配 | `boolean` | false |
+| onSwitch | 切换页签时触发事件 | `(value) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| title | 标签页的标题 | `ReactNode` | - |
+| icon | 自定义图标 | `ReactNode` | - |
+| value | 徽标中显示的内容，支持数字、字符和自定义内容 | `ReactNode` | - |
+| max | value 为数值时，最大值 | `number` | 99 |
+| dot | 徽标是否为小点 | `boolean` | false |
+| top | 徽标的上下偏移量，支持单位设置，可设置为：5 等 | `number` | 0 |
+| right | 徽标的左右偏移量，支持单位设置，可设置为：5 等 | `number` | 0 |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| value | 当前激活 tab 面板的值 | ``number` | `string`` | 0 |
+| defaultValue | 初始化激活 tab 的值 | ``number` | `string`` | 0 |
+| activeColor | 标签选中色 | `string` | #1a1a1a |
+| direction | 使用横纵方向 | ``horizontal` | `vertical`` | horizontal |
+| activeType | 选中底部展示样式 可选值 `line`、`smile` | `string` | line |
+| duration | 切换动画时长,单位 ms 0 代表无动画 | ``number` | `string`` | 300 |
+| title | 自定义导航区域 | `() => JSX.Element[]` | - |
+| align | 标题左对齐 | ``left` | `right`` | - |
+| autoHeight | 自动高度。设置为 true 时，nut-tabs 和 nut-tabs\_\_content 会随着当前 nut-tabpane 的高度而发生变化。 | `boolean` | false |
+| tabStyle | 标签栏样式 | `CSSProperties` | {} |
+| onClick | 点击标签时触发 | ``(index: string | number) => void`` | - |
+| onChange | 当前激活的标签改变时触发 | ``(index: string | number) => void`` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| title | 标题 | `string` | - |
+| value | 标签 Key , 匹配的标识符, 默认为索引值 | ``string` | `number`` | - |
+| disabled | 是否禁用标签 | `boolean` | false |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| visible | 是否打开地址选择 | `boolean` | - |
+| type | 地址选择类型 exist/custom | `string` | custom |
+| existList | 已存在地址列表，每个地址对象中，必传值provinceName、cityName、countyName、townName、addressDetail、selectedAddress（字段解释见下） | `Array` | [] |
+| defaultIcon | 已有地址列表默认图标，type='exist' 时生效 | `ReactNode` | - |
+| selectIcon | 已有地址列表选中图标，type='exist' 时生效 | `ReactNode` | - |
+| closeIcon | 自定义关闭弹框按钮图标 | `ReactNode` | - |
+| backIcon | 自定义地址与已有地址切换时，自定义返回的按钮图标 | `ReactNode` | - |
+| custom | 是否可以切换自定义地址选择，type='exist' 时生效 | ``boolean` | `string`` | true |
+| onExistSelect | 选择已有地址列表时触发 | `(data: AddressList) => void` | - |
+| onSwitch | 点击'选择其他地址'或自定义地址选择左上角返回按钮触发 | `(data: { type: string }) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| visible | 是否可见 | `boolean` | false |
+| type | 类型，日期选择'single'，区间选择'range' | `string` | single |
+| popup | 是否弹窗状态展示 | `boolean` | true |
+| autoBackfill | 自动回填 | `boolean` | false |
+| title | 显示标题 | `string` | 日期选择 |
+| defaultValue | 默认值，日期选择 string 格式，区间选择 Array 格式 | ``string | Array`` | - |
+| startDate | 开始日期， 如果不限制开始日期传 null | `string` | 今天 |
+| endDate | 结束日期，如果不限制结束日期传 null | `string` | 距离今天 365 天 |
+| showToday | 是否展示今天标记 | `boolean` | true |
+| startText | 范围选择，开始信息文案 | `ReactNode` | 开始 |
+| endText | 范围选择，结束信息文案 | `ReactNode` | 结束 |
+| confirmText | 底部确认按钮文案 | `ReactNode` | 确认 |
+| showTitle | 是否在展示日历标题 | `boolean` | true |
+| showSubTitle | 是否展示日期标题 | `boolean` | true |
+| scrollAnimation | 是否启动滚动动画 | `boolean` | true |
+| renderHeaderButtons | 自定义日历标题下部，可用以添加自定义操作 | ``() => string` | JSX.Element |
+| renderDay | 日期信息 | ``(date: Day) => string` | JSX.Element |
+| renderDayTop | 日期顶部信息 | ``(date: Day) => string` | JSX.Element |
+| renderDayBottom | 日期底部信息 | ``(date: Day) => string` | JSX.Element |
+| onClickDay | 点击/选择后触发 | `(data: string) => {}` | |
+| onPageChange | 年月子标题到达顶部时触发 | `(param: string) => {}` | |
+| onConfirm | 选择之后或是点击确认按钮触发 | `(param: string) => {}` | |
+| onClose | 关闭时触发 | `() => {}` | |
+| day | `string | number` | `` | |
+| type | `string` | `` | |
+| scrollToDate | 滚动到指定日期所在月,如：'2023-06-30' | `string` | |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| value | 选中值，受控 | ``(number | string)[]`` | - |
+| defaultValue | 默认选中值 | ``(number | string)[]`` | - |
+| options | 级联数据 | `Array` | - |
+| popup | 是否弹窗状态展示 | `boolean` | true |
+| visible | 级联显示隐藏状态 | `boolean` | false |
+| activeColor | 选中激活颜色 | `string` | - |
+| activeIcon | 标记选中的Icon | `string` | ReactNode |
+| lazy | 是否开启动态加载 | `boolean` | false |
+| optionKey | 自定义`options`结构中，包含 textKey、valueKey、childrenKey | `object` | - |
+| format | 当options为可转换为树形结构的扁平结构时，配置转换规则 | `object` | - |
+| title | 标题 | `string` | - |
+| closeIconPosition | 取消按钮位置，继承 Popup 组件 | `string` | top-right |
+| closeIcon | 自定义关闭按钮，继承 Popup 组件 | `ReactNode` | close |
+| closeable | 是否显示关闭按钮，继承 Popup 组件 | `boolean` | true |
+| onLoad | 动态加载回调，开启动态加载时生效 | `(node: any, resolve: any) => void` | - |
+| onChange | 选中值改变时触发 | `(value: CascaderValue, params?: any) => void` | - |
+| onPathChange | 选中项改变时触发 | `(value: CascaderValue, params: any) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| checked | 是否选中 | `boolean` | false |
+| defaultChecked | 初始是否选中 | `boolean` | false |
+| disabled | 是否禁用选择 | `boolean` | false |
+| labelPosition | 文本所在的位置 | ``left` | `right`` | right |
+| icon | 选中前 | `ReactNode` | 'CheckNormal' |
+| activeIcon | ，选中后 | `ReactNode` | 'Checked' |
+| indeterminateIcon | 半选状态 | `ReactNode` | 'CheckDisabled' |
+| label | 复选框的文本内容 | `string` | - |
+| value | 标识值，用于 Group 模式 | ``string` | `number`` | - |
+| onChange | 值变化时触发 | `(value: boolean) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| value | 当前选中项的标识符 | ``string` | `number`` | - |
+| defaultValue | 初始选中项的标识符 | ``string` | `number`` | - |
+| disabled | 是否禁用选择,将用于其下的全部复选框 | `boolean` | false |
+| max | 限制最大可选数 | `number` | - |
+| labelPosition | 文本所在的位置 | ``left` | `right`` | right |
+| direction | 使用横纵方向 可选值 horizontal、vertical | `string` | vertical |
+| options | 配置 options 渲染复选按钮 | `Array<{ label: string value: string disabled?: boolean }>` | - |
+| onChange | 值变化时触发 | `(value: string[]) => void` | - |
+| toggle | 全选/取消 | `传 `true`,表示全选，传 `false`,表示取消全选` | |
+| reverse | 反选 | `-` | |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| defaultValue | 初始值 | `Date` | null |
+| value | 受控 | `Date` | null |
+| visible | 是否可见 | `boolean` | false |
+| type | 类时间类型，可选值 date time year-month month-day datehour datetime hour-minutes | `string` | date |
+| minuteStep | 分钟步进值 | `number` | 1 |
+| showChinese | 每列是否展示中文 | `boolean` | false |
+| title | 设置标题 | `string` | null |
+| startDate | 开始日期 | `Date` | 十年前 |
+| endDate | 结束日期 | `Date` | 十年后 |
+| formatter | 选项格式化函数 | `(type: string, option: PickerOption) => PickerOption` | - |
+| filter | 选项过滤函数 | `(type: string, option: PickerOption) => PickerOption[]` | - |
+| threeDimensional | 是否开启3D效果 | `boolean` | true |
+| onConfirm | 点击确定按钮时触发 | `(options, value) => void` | - |
+| onClose | 关闭时触发 | `(options, value) => void` | - |
+| onChange | 选项改变时触发 | `(options, value, index) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| form | 经 Form.useForm() 创建的 form 控制实例，不提供时会自动创建 | `FormInstance` | - |
+| footer | 表单底部区域，一般放置确认和重置按钮 | `ReactNode` | null |
+| initialValues | 表单初始值 | `any` | - |
+| name | 表单名称 | `any` | - |
+| labelPosition | 表单项 label 的位置 | ``top` | `left` | `right`` | right |
+| starPosition | 必填表单项 label 的红色星标位置 | ``left` | `right`` | left |
+| onFinish | 校验成功后触发 | `(values: any) => void` | - |
+| onFinishFailed | 任一表单项被校验失败后触发 | `(values: any, errorFields: any) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| required | 必填表单项 label 的红色星标,仅用于控制样式 | `boolean` | false |
+| name | 在使用表单校验功能的情况下，该属性是必填的 | `string` | - |
+| errorMessageAlign | 错误提示文案对齐方式 | ``center` | `right` | `left`` | left |
+| initialValue | 设置子元素默认值 | `any` | - |
+| trigger | 设置收集字段值变更的时机 | `string` | - |
+| valuePropName | 子节点的值的属性，如 Checkbox 的是 'checked' | `string` | - |
+| getValueFromEvent | 设置如何将 event 的值转换成字段值 | `(...args: any) => any` | - |
+| onClick | 点击事件并收集子组件 Ref | `(event: React.MouseEvent, componentRef: React.MutableRefObject) => void` | - |
+| required | 是否为必选字段 | `boolean` | |
+| message | 错误提示文案 | `string` | |
+| len | string 类型时为字符串长度；number 类型时为确定数字； array 类型时为数组长度 | `number` | |
+| max | 必须设置 type：string 类型为字符串最大长度；number 类型时为最大值；array 类型时为数组最大长度 | `number` | |
+| min | 必须设置 type：string 类型为字符串最小长度；number 类型时为最小值；array 类型时为数组最小长度 | `number` | |
+| pattern | 正则表达式匹配 | `RegExp` | |
+| transform | 将字段值转换成目标值后进行校验 | `(value) => any` | |
+| validator | 自定义校验，接收 Promise 作为返回值 | `(rule, value) => Promise` | |
+| getFieldValue | 获取对应字段名的值 | `(name: NamePath) => any` | |
+| setFieldsValue | 设置表单的值 | `(values) => void` | |
+| resetFields | 重置表单提示状态 | `() => void` | |
+| submit | 提交表单进行校验的方法 | `Promise` | |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| defaultValue | 初始默认值 | `string` | - |
+| value | 初始默认值 | `string` | - |
+| type | 输入框类型，支持原生 `input` 标签的所有 `type` 属性，另外还支持 `number` `digit` | `string` | text |
+| name | 组件名字，用于表单提交获取数据 | `string` | - |
+| placeholder | 输入框为空时占位符 | `string` | - |
+| align | 输入框内容对齐方式，可选值 `left`、`center`、`right` | `string` | left |
+| disabled | 是否禁用 | `boolean` | false |
+| readOnly | 是否只读 | `boolean` | false |
+| autoFocus | 是否自动获得焦点，iOS 系统不支持该属性 | `boolean` | false |
+| maxLength | 限制最长输入字符 | ``string` | `number`` | - |
+| clearable | 展示清除 Icon | `boolean` | false |
+| clearIcon | 清除图标 Icon 可参考 Icon | `ReactNode` | MaskClose |
+| confirmType | 键盘右下角按钮的文字，仅在type='text'时生效,可选值 send：发送、search：搜索、next：下一个、go：前往、done：完成 | `string` | done |
+| formatter | 输入内容格式化函数 | `(val: string) => string` | - |
+| formatTrigger | 格式化函数触发的时机，可选值为 `onChange`、`onBlur` | `string` | - |
+| onChange | 输入框内容变化时触发 | `(value: string) => void` | - |
+| onBlur | 失去焦点后触发 | `(value: string) => void` | - |
+| onFocus | 获得焦点后触发 | `(value: string) => void` | - |
+| onClear | 点击清空按钮时触发 | `(value: string) => void` | - |
+| onClick | 点击 input 容器触发 | `(value: MouseEvent) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| allowEmpty | 是否允许内容为空 | `boolean` | false |
+| defaultValue | 默认值 | ``string` | `number`` | 0 |
+| value | 当前值，受控值 | ``string` | `number`` | - |
+| min | 最小值限制 | ``string` | `number`` | 1 |
+| max | 最大值限制 | ``string` | `number`` | 9999 |
+| step | 步长 | ``string` | `number`` | 1 |
+| digits | 设置保留的小数位 | ``string` | `number`` | 0 |
+| disabled | 禁用所有功能 | `boolean` | false |
+| readOnly | 只读状态禁用输入框操作行为 | `boolean` | false |
+| async | 支持异步修改 | `boolean` | false |
+| formatter | 指定输入框展示值的格式 | ``function(value: number | string): string`` | - |
+| onPlus | 点击增加按钮时触发 | `(e: MouseEvent) => void` | - |
+| onMinus | 点击减少按钮时触发 | `(e: MouseEvent) => void` | - |
+| onOverlimit | 点击不可用的按钮时触发 | `(e: MouseEvent) => void` | - |
+| onChange | 值改变时触发 | ``(param: string | number, e: MouseEvent | ChangeEvent) => void`` | - |
+| onFocus | 输入框获得焦点时触发 | `(e: FocusEvent) => void` | - |
+| onBlur | 输入框失去焦点时触发 | `(e: ChangeEvent) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| activeColor | 选项的选中态图标颜色 | `string` | #F2270C |
+| closeOnOverlayClick | 是否在点击遮罩层后关闭菜单 | `boolean` | true |
+| lockScroll | 背景是否锁定 | `boolean` | true |
+| scrollFixed | 滚动后是否固定，可设置固定位置 | ``boolean` | `string` | `number`` | true |
+| icon | 自定义标题图标 | `React.ReactNode` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| title | 菜单项标题 | `string` | 当前选中项文字 |
+| options | 选项数组 | `array` | - |
+| disabled | 是否禁用菜单 | `boolean` | false |
+| columns | 可以设置一行展示多少列 options | `number` | 1 |
+| icon | 自定义选项图标 | `React.ReactNode` | Check |
+| direction | 菜单展开方向，可选值为up | `string` | down |
+| onChange | 选择 option 之后触发 | `(event: any) => void` | - |
+| toggle | 切换菜单展示状态，传 true 为显示，false 为隐藏，不传参为取反 | `show?: boolean` | |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| visible | 是否显示键盘 | `boolean` | false |
+| title | 键盘标题 | `ReactNode` | - |
+| type | 键盘模式, default：默认样式 rightColumn：带右侧栏 | `string` | default |
+| random | 随机数 | `boolean` | false |
+| custom | 自定义键盘额外的键, 数组形式最多支持添加 2 个, 超出默认取前 2 项 | `string[]` | - |
+| confirmText | 自定义完成按钮文字，如"支付"，"下一步"，"提交"等 | `string` | 完成 |
+| onChange | 点击按键时触发 | `(value: string) => void` | - |
+| onDelete | 点击删除键时触发 | `-` | - |
+| onClose | 点击关闭按钮或非键盘区域时触发 | `-` | - |
+| onConfirm | 点击确定按钮时触发 | `-` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| visible | 是否可见 | `boolean` | false |
+| title | 设置标题 | `string` | - |
+| options | 列表数据 | `Array` | [] |
+| value | 选中值，受控 | `Array` | [] |
+| defaultValue | 默认选中 | `Array` | [] |
+| threeDimensional | 是否开启3D效果 | `boolean` | true |
+| duration | 快速滑动时惯性滚动的时长，单位 ms | ``string` | `number`` | 1000 |
+| onConfirm | 点击确认按钮时候回调 | `(options, value) => void` | - |
+| onChange | 每一列值变更时调用 | `(options, value) => void` | - |
+| onClose | 关闭时触发 | `(options, value) => void` | - |
+| afterClose | 联动时，关闭时回调 | `(options, value) => void` | - |
+| text | 选项的文字内容 | ``string` | `number`` | - |
+| value | 选项对应的值，且唯一 | ``string` | `number`` | - |
+| children | 用于级联选项 | `Array` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| checked | 指定当前是否选中 | `boolean` | - |
+| defaultChecked | 初始是否选中 | `boolean` | - |
+| disabled | 是否禁用选择 | `boolean` | false |
+| value | 携带的标识值，用于 Group 模式 | ``string` | `number`` | - |
+| labelPosition | 文本所在的位置 | ``left` | `right`` | right |
+| icon | 图标名称，选中前(建议和`activeIcon`一起修改) | `ReactNode` | 'CheckNormal' |
+| activeIcon | 图标名称，选中后(建议和`icon`一起修改) | `ReactNode` | 'CheckChecked' |
+| shape | 形状 | ``button` | `round` | `round`` | round |
+| onChange | 选中态变化时触发 | `(checked: boolean) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| value | 当前选中项的标识符 | ``string` | `number`` | - |
+| labelPosition | 文本所在的位置 | ``left` | `right`` | right |
+| disabled | 是否禁用 | `boolean` | false |
+| direction | 使用横纵方向 | ``horizontal` | `vertical`` | vertical |
+| options | 配置 options 渲染单选按钮 | `Array<{ label: string value: string disabled?: boolean }>` | - |
+| onChange | 值变化时触发 | ``(value: string | number) => void`` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| defaultValue | 默认进度百分比，非受控 | ``number` | `number[]`` | 0 |
+| value | 当前进度百分比，受控 | ``number` | `number[]`` | 0 |
+| range | 是否开启双滑块模式 | `boolean` | false |
+| max | 最大值 | `number` | 100 |
+| min | 最小值 | `number` | 0 |
+| maxDescription | 最大值描述，传 `null` 表示隐藏 | `ReactNode` | - |
+| minDescription | 最小值描述，传 `null` 表示隐藏 | `ReactNode` | - |
+| currentDescription | 当前值描述，传 `null` 表示隐藏 | ``((value) => ReactNode)` | `null`` | - |
+| step | 步长 | `number` | 1 |
+| disabled | 是否禁用滑块 | `boolean` | false |
+| vertical | 是否竖向展示 | `boolean` | false |
+| marks | 刻度标示 | `Object{key: number}` | {} |
+| button | 自定义滑动按钮 | `ReactNode` | - |
+| onChange | 进度实时变化，通常在受控方式中与 value 一起使用 | `(value) => void` | - |
+| onStart | 开始拖动时触发 | `-` | - |
+| onEnd | 结束拖动时触发 | `(value) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| defaultValue | 非受控的 star 默认值 | `number` | 0 |
+| value | 受控的 star 数值 | `number` | 0 |
+| count | star 总数 | `number` | 5 |
+| min | 最少选中star数量 | `number` | 0 |
+| uncheckedIcon | 使用图标(未选中) | `ReactNode` | star-n |
+| checkedIcon | 使用图标(选中) | `ReactNode` | star-n |
+| allowHalf | 是否半星 | `boolean` | false |
+| readOnly | 是否只读 | `boolean` | false |
+| disabled | 是否禁用 | `boolean` | false |
+| onChange | 当前 star 数修改时触发 | `(value: number) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| value | 当前输入的值 | `string` | - |
+| placeholder | 输入框默认暗纹 | `string` | 请输入 |
+| shape | 搜索框形状，可选值为 `round` | `string` | square |
+| disabled | 是否禁用输入框 | `boolean` | false |
+| readOnly | 输入框只读 | `boolean` | false |
+| maxLength | 最大输入长度 | `number` | 9999 |
+| clearable | 是否展示清除按钮 | `boolean` | true |
+| autoFocus | 是否自动聚焦 | `boolean` | false |
+| left | 搜索框左侧区域 | `ReactNode` | - |
+| right | 搜搜框右侧区域 | `ReactNode` | - |
+| leftIn | 输入框内左侧区域 | `ReactNode` | |
+| rightIn | 输入框内右侧区域 | `ReactNode` | - |
+| onChange | 输入内容时触发 | `(value: string, event: Event) => void` | - |
+| onFocus | 聚焦时触发 | `(value: string, event: Event) => void` | - |
+| onBlur | 失焦时触发 | `(value: string, event: Event) => void` | - |
+| onClear | 点击清空时触发 | `(event: Event) => void` | - |
+| onSearch | 确定搜索时触发 | `(val: string) => void` | - |
+| onClickInput | 点击输入区域时触发 | `(event: Event) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| value | 密码字符串 | `string` | - |
+| visible | 是否展示短密码框 | `boolean` | false |
+| plain | 是否展示明文 | `boolean` | false |
+| title | 标题 | `ReactNode` | 请输入密码 |
+| description | 密码框描述 | `ReactNode` | 您使用了虚拟资产，请进行验证 |
+| tips | 提示语 | `ReactNode` | 忘记密码 |
+| hideFooter | 是否隐藏底部按钮 | `boolean` | true |
+| length | 密码长度，取值为4~6 | `number` | 6 |
+| error | 错误信息提示 | `ReactNode` | - |
+| autoFocus | 自动聚焦 | `boolean` | false |
+| onChange | 输入密码时触发事件 | `(value) => void` | - |
+| onConfirm | 点击确认时触发事件 | `(value) => void` | - |
+| onCancel | 点击取消时触发事件 | `() => void` | - |
+| onClose | 点击关闭图标和遮罩时触发事件 | `() => void` | - |
+| onTips | 点击忘记密码时触发事件 | `() => void` | - |
+| onComplete | 输入完成的回调 | `(value) => void` | - |
+| onFocus | 输入框聚焦 | `() => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| customClass | 自定义 class | `string` | - |
+| lineWidth | 线条的宽度 | `number` | 3 |
+| strokeStyle | 绘图笔触颜色 | `string` | #000 |
+| type | 图片格式 | `string` | png |
+| unsupported | 不支持 Canvas 情况下的展示文案 | `ReactNode` | 对不起，当前浏览器不支持 Canvas，无法使用本控件！ |
+| onConfirm | 点击确认按钮触发事件回调函数 | `onConfirm: (canvas: HTMLCanvasElement, dataurl: string) => void` | - |
+| onClear | 点击重签按钮触发事件回调函数 | `onClear: () => void` | - |
+| confirm | 确认签字 | `() => void` | |
+| clear | 清除签字 | `() => void` | |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| defaultChecked | 开关状态，非受控 | `boolean` | false |
+| checked | 开关状态，受控 | `boolean` | false |
+| disabled | 禁用状态 | `boolean` | false |
+| activeText | 打开时文字描述 | `string` | - |
+| inactiveText | 关闭时文字描述 | `string` | - |
+| onChange | 切换开关时触发 | `onChange:(value: boolean, event: Event)` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| value | 输入框内容，受控 | `string` | - |
+| defaultValue | 初始默认值，非受控 | `string` | - |
+| placeholder | 设置占位提示文字 | `string` | 请输入内容 |
+| maxLength | 限制最长输入字符，-1 表示无限制 | `number` | 140 |
+| rows | textarea 的行数 | `number` | 2 |
+| showCount | textarea 是否展示输入字符。须配合`maxLength`使用 | `boolean` | false |
+| autoSize | 高度是否可拉伸 | `boolean` | false |
+| readOnly | 只读属性 | `boolean` | false |
+| disabled | 禁用属性 | `boolean` | false |
+| onChange | 输入内容时触发 | `(value) => void` | - |
+| onFocus | 聚焦时触发 | `(event) => void` | - |
+| onBlur | 失焦时触发 | `(event) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| autoUpload | 是否在选取文件后立即进行上传，false 时需要手动执行 ref submit 方法进行上传 | `Boolean` | true |
+| name | `input` 标签 `name` 的名称，发到后台的文件参数名 | `string` | file |
+| url | 上传服务器的接口地址 | `string` | - |
+| defaultValue | 默认已经上传的文件列表 | `FileType[]` | [] |
+| value | 已经上传的文件列表 | `FileType[]` | [] |
+| preview | 是否上传成功后展示预览图 | `boolean` | true |
+| previewUrl | 当上传非图片('image')格式的默认图片地址 | `string` | - |
+| deletable | 是否展示删除按钮 | `boolean` | true |
+| method | 上传请求的 http method | `string` | post |
+| previewType | 上传列表的内建样式，支持两种基本样式 picture、list | `string` | picture |
+| capture | 图片[选取模式](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/input#htmlattrdefcapture")，直接调起摄像头 | `string` | false |
+| maxFileSize | 可以设定最大上传文件的大小（字节） | ``number` | `string`` | Number.MAX_VALUE |
+| maxCount | 文件上传数量限制 | ``number` | `string`` | 1 |
+| imageFit | 图片填充模式 | ``contain` | `cover` | `fill` | `none` | `scale-down`` | cover |
+| clearInput | 是否需要清空`input`内容，设为`true`支持重复选择上传同一个文件 | `boolean` | true |
+| accept | 允许上传的文件类型，[详细说明]("https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/file#%E9%99%90%E5%88%B6%E5%85%81%E8%AE%B8%E7%9A%84%E6%96%87%E4%BB%B6%E7%B1%BB%E5%9E%8B") | `string` | \* |
+| headers | 设置上传的请求头部 | `object` | {} |
+| data | 附加上传的信息 formData | `object` | {} |
+| uploadIcon | 上传区域图标名称 | `React.ReactNode` | - |
+| uploadLabel | 上传区域图片下方文字 | `React.ReactNode` | - |
+| xhrState | 接口响应的成功状态（status）值 | `number` | 200 |
+| withCredentials | 支持发送 cookie 凭证信息 | `Boolean` | false |
+| multiple | 是否支持文件多选 | `boolean` | false |
+| disabled | 是否禁用文件上传 | `boolean` | false |
+| timeout | 超时时间，单位为毫秒 | ``number` | `string`` | 1000 \* 30 |
+| beforeUpload | 上传前的函数需要返回一个`Promise`对象 | ``(file: File[]) => Promise`` | - |
+| beforeXhrUpload | 执行 XHR 上传时，自定义方式 | `(xhr: XMLHttpRequest, options: any) => void` | - |
+| beforeDelete | 除文件时的回调，返回值为 false 时不移除。支持返回一个 `Promise` 对象，`Promise` 对象 resolve(false) 或 reject 时不移除 | `(file: FileItem, files: FileItem[]) => boolean` | - |
+| onStart | 文件上传开始 | `options` | - |
+| onProgress | 文件上传的进度 | `event, options, percentage` | - |
+| onOversize | 文件大小超过限制时触发 | `files` | - |
+| onSuccess | 上传成功 | `responseText, options` | - |
+| onFailure | 上传失败 | `responseText, options` | - |
+| onChange | 上传文件改变时的状态 | `fileList, event` | - |
+| onDelete | 文件删除之前的状态 | `files, fileList` | - |
+| onFileItemClick | 文件上传成功后点击触发 | `fileItem` | - |
+| status | 文件状态值，可选'ready,uploading,success,error,removed' | `ready` | |
+| uid | 文件的唯一标识 | `new Date().getTime().toString()` | |
+| name | 文件名称 | `-` | |
+| url | 文件路径 | `-` | |
+| type | 文件类型 | `image/jpeg` | |
+| formData | 上传所需的data | `new FormData()` | |
+| submit | 手动上传模式，执行上传操作 | `-` | - |
+| clear | 清空已选择的文件队列（该方法一般配合在手动模式上传时使用） | `index` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| visible | 遮罩层可见 | `boolean` | false |
+| title | 设置列表面板标题 | `string` | - |
+| description | 设置列表面板副标题/描述 | `string` | - |
+| options | 列表项 | `Array` | [] |
+| optionKey | 列表项的自定义设置 | `{ [key: string]: string }` | - |
+| cancelText | 取消文案 | `string` | 取消 |
+| onSelect | 选择之后触发 | `(item: any, index: number) => void` | - |
+| onCancel | 点击取消文案时触发 | `() => void` | - |
+| name | 列表项的标题key值 | `string` | - |
+| description | 列表项的描述key值 | `string` | - |
+| danger | 高亮颜色 | `string` | $primary-color |
+| disable | 禁用状态 | `string` | $color-text-disabled |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| value | 显示的内容，支持数字、字符和自定义内容 | `ReactNode` | - |
+| max | value 为数值时，最大值 | `number` | 99 |
+| dot | 是否为小点 | `boolean` | false |
+| top | 上下偏移量，支持单位设置，可设置为：5 等 | `number` | 0 |
+| right | 左右偏移量，支持单位设置，可设置为：5 等 | `number` | 0 |
+| color | 徽标背景颜色,默认值为当前主题色 | `string` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| visible | 对话框是否可见 | `boolean` | - |
+| title | 标题 | `ReactNode` | - |
+| content | 对话框的内容，适用于函数式调用 | `ReactNode` | - |
+| footer | 自定义页脚，传入 null 则不显示 | `ReactNode` | - |
+| confirmText | 确认按钮文案 | `ReactNode` | 确定 |
+| cancelText | 取消按钮文案 | `ReactNode` | 取消 |
+| overlay | 是否展示遮罩 | `boolean` | true |
+| hideConfirmButton | 是否隐藏确定按钮 | `boolean` | false |
+| hideCancelButton | 是否隐藏取消按钮 | `boolean` | false |
+| disableConfirmButton | 禁用确定按钮 | `boolean` | false |
+| closeOnOverlayClick | 点击蒙层是否关闭对话框 | `boolean` | true |
+| footerDirection | 使用横纵方向 可选值 horizontal、vertical | `string` | horizontal |
+| lockScroll | 背景是否锁定 | `boolean` | true |
+| beforeCancel | 取消前回调，点击取消时触发 | `() => boolean` | - |
+| beforeClose | 关闭前回调 | `() => boolean` | - |
+| onConfirm | 确定按钮回调 | ``(e?: MouseEvent) => Promise | void`` | - |
+| onCancel | 取消按钮回调 | `() => void` | - |
+| onClose | 关闭回调，任何情况关闭弹窗都会触发 | `() => void` | - |
+| onClick | 点击自身回调 | `() => void` | - |
+| onOverlayClick | 点击蒙层触发 | `() => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| attract | 是否开启自动吸边 | `boolean` | false |
+| direction | 拖拽元素的拖拽方向限制 | ``x` | `y` | `all`` | all |
+| boundary | 拖拽元素的拖拽边界 | `Object` | {top: 0, left: 0, right: 0, bottom: 0} |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| image | 图片,支持传入图片 URL | `ReactNode` | - |
+| imageSize | 图片大小，number 类型单位为 px | ``number` | `string`` | - |
+| description | 图片下方的描述文字 | `ReactNode` | - |
+| status | 默认图片错误类型 | ``empty` | `error` | `network`` | empty |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| hasMore | 是否还有更多数据 | `boolean` | true |
+| threshold | 距离底部多远加载 | `number` | 200 |
+| capture | 是否使用捕获模式 true 捕获 false 冒泡 | `boolean` | false |
+| target | 获取监听的目标元素 | `string` | - |
+| loadMoreText | “没有更多数”据展示文案 | `string` | 哎呀，这里是底部了啦 |
+| pullRefresh | 是否开启下拉刷新 | `boolean` | false |
+| pullingText | 下拉刷新提示文案 | `ReactNode` | 松手刷新 |
+| loadingText | 上拉加载提示文案 | `ReactNode` | 加载中... |
+| onRefresh | 下拉刷新事件回调 | `(param: () => void) => void` | - |
+| onLoadMore | 继续加载的回调函数 | `(param: () => void) => void` | - |
+| onScroll | 实时监听滚动高度 | `(param: number) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| direction | 滚动的方向，可选 horizontal、vertical | `string` | horizontal |
+| content | 提示的信息 | `string` | - |
+| closeable | 是否启用关闭模式 | `boolean` | false |
+| leftIcon | 左边的 icon，closeable 模式下默认为空 | `ReactNode` | - |
+| rightIcon | 右边的 icon，在 closeable 模式下默认为 `` | `ReactNode` | - |
+| delay | 延时多少秒 | ``string` | `number`` | 1 |
+| scrollable | 是否可以滚动 | `boolean` | true |
+| speed | 滚动速率 (px/s) | `number` | 50 |
+| wrap | 是否开启文本换行 | `boolean` | false |
+| onClick | 外层点击事件回调 | `(event: any) => void` | - |
+| onClose | 关闭通知栏时触发 | `(event: any) => void` | - |
+| onClickItem | 垂直滚动多条数据时，点击当前展示的信息时触发 | `(event: any, value: any) => void` | - |
+| list | 纵向滚动数据列表 | `Array` | [] |
+| speed | 滚动的速度 | `number` | 50 |
+| duration | 停留时间(毫秒) | `number` | 1000 |
+| height | 每一个滚动列的高度(px) | `number` | 40 |
+| closeable | 是否启用右侧关闭图标，可以通过 rightIcon 自定义图标 | `boolean` | false |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| type | 提示的信息类型（primary，success ，danger，warning） | `string` | danger |
+| duration | 展示时长(ms)，值为 0 时，notify 不会消失 | `string` | 3000 |
+| position | 自定义位置 (top, bottom) | `string` | top |
+| onClick | 点击事件回调 | `onClick: () => void` | - |
+| onClose | 关闭事件回调 | `onClose: () => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| list | 选项列表 | `List[]` | [] |
+| visible | 是否展示气泡弹出层 | `boolean` | false |
+| location | 弹出位置，里面具体的参数值可以参考上面的位置自定义例子 | `string` | bottom |
+| offset | 出现位置的偏移量 | ``string[] | number[]`` | [0, 12] |
+| showArrow | 是否显示小箭头 | `boolean` | true |
+| closeOnClickAction | 是否在点击选项后关闭 | `boolean` | true |
+| closeOnClickOutside | 是否在点击外部元素后关闭菜单 | `boolean` | true |
+| targetId | 自定义目标元素 id | `string` | - |
+| onClick | 点击切换 popover 展示状态 | `() => void` | () => {} |
+| onSelect | 点击选项时触发 | `(item: List, index: number) => void` | (item, index) => {} |
+| onOpen | 点击菜单时触发 | `() => void` | () => {} |
+| onClose | 关闭菜单时触发 | `() => void` | () => {} |
+| key | 选项 key 值 | `string` | - |
+| name | 选项文字 | `string` | - |
+| icon | 参考 Icon 组件 | `ReactNode` | - |
+| disabled | 是否为禁用状态 | `boolean` | false |
+| className | 为对应选项添加额外的类名 | `string` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| visible | 当前组件是否显示 | `boolean` | false |
+| zIndex | 遮罩层级 | ``string` | `number`` | 2000 |
+| duration | 遮罩动画时长，单位秒 | `number` | 0.3 |
+| overlayClassName | 自定义遮罩类名 | `string` | - |
+| overlayStyle | 自定义遮罩样式 | `CSSProperties` | - |
+| lockScroll | 背景是否锁定 | `boolean` | true |
+| overlay | 是否显示遮罩 | `boolean` | true |
+| closeOnOverlayClick | 是否点击遮罩关闭 | `boolean` | true |
+| position | 弹出位置 | ``top` | `bottom` | `left` | `right` | `center`` | center |
+| transition | 动画名 | `string` | - |
+| style | 自定义弹框样式 | `CSSProperties` | - |
+| className | 自定义弹框类名 | `string` | - |
+| closeable | 是否显示关闭按钮 | `boolean` | false |
+| closeIconPosition | 关闭按钮位置 | ``top-left` | `top-right` | `bottom-left` | `bottom-right`` | top-right |
+| closeIcon | 自定义 Icon | `ReactNode` | close |
+| destroyOnClose | 组件不可见时，卸载内容 | `boolean` | false |
+| round | 是否显示圆角 | `boolean` | false |
+| portal | 指定节点挂载 | ``HTMLElement` | `(() => HTMLElement)`` | null |
+| onClick | 点击弹框时触发 | `event: MouseEvent` | - |
+| onClickCloseIcon | 点击关闭图标时触发 | `event: MouseEvent` | - |
+| onOpen | 打开弹框时触发 | `-` | - |
+| onClose | 关闭弹框时触发 | `-` | - |
+| afterShow | 继承于`Overlay`, 遮罩打开动画结束时触发 | `event: HTMLElement` | - |
+| afterClose | 继承于`Overlay`, 遮罩关闭动画结束时触发 | `event: HTMLElement` | - |
+| onClickOverlay | 点击遮罩触发 | `event: MouseEvent` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| canReleaseText | 释放的提示文案 | `ReactNode` | 释放立即刷新 |
+| completeText | 完成时的提示文案 | `ReactNode` | 刷新成功 |
+| completeDelay | 完成后延迟消失的时间，单位为 ms | `number` | 500 |
+| disabled | 是否禁用下拉刷新 | `boolean` | false |
+| headHeight | 头部提示内容区的高度，单位为 px | `number` | 40 |
+| pullingText | 下拉的提示文案 | `ReactNode` | 下拉刷新 |
+| refreshingText | 刷新时的提示文案 | `ReactNode` | 加载中…… |
+| renderText | 根据下拉状态，自定义下拉提示文案 | `ReactNode` | - |
+| threshold | 触发刷新需要下拉多少距离，单位为 px | `number` | 60 |
+| onRefresh | 触发刷新时的处理函数 | `() => Promise` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| visible | 是否显示骨架屏(true不显示骨架屏，false显示骨架屏) | `boolean` | true |
+| animated | 是否开启骨架屏动画 | `boolean` | false |
+| avatar | 是否显示头像 | `boolean` | false |
+| avatarShape | 头像形状：正方形/圆形 | `string` | round |
+| avatarSize | 头像大小 | `string` | 50px |
+| rows | 设置段落行数 | `string` | 1 |
+| title | 是否显示段落标题 | `boolean` | true |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| name | 标识符，可以在事件参数中获取到 | ``number` | `string`` | - |
+| leftAction | 左侧滑动区域的内容 | `ReactNode` | - |
+| rightAction | 右侧滑动区域的内容 | `ReactNode` | - |
+| beforeClose | 关闭前的回调函数，返回滑动区域所在方向 `position` | ``(position: 'left | 'right') => void`` | - |
+| disabled | 是否禁用滑动 | `boolean` | false |
+| onOpen | 打开单元格侧边栏 | ``(name, position): { name: string | number, position: 'left' | 'right' } => void`` | - |
+| onClose | 收起单元格侧边栏 | ``(name, position): { name: string | number, position: 'left' | 'right' } => void`` | - |
+| onActionClick | 点击左侧或者右侧时触发 | ``(event: Event, position: 'left' | 'right') => void`` | - |
+| onTouchStart | onTouchStart | `(event: Event) => void` | - |
+| onTouchMove | onTouchMove | `(event: Event) => void` | - |
+| onTouchEnd | onTouchEnd | `(event: Event) => void` | - |
+| open | 打开单元格侧边栏，`side`参数默认为`right` | ``(side?: 'left' | 'right') => void`` | |
+| close | 收起单元格侧边栏 | `() => void` | |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| content | Toast文本内容 | `React.ReactNode` | - |
+| duration | 展示时长（秒）
值为 0 时，toast 不会自动消失 | `number` | 2 |
+| position | toast展示位置 | ``top` | `center` | `bottom`` | center |
+| title | 标题 | `string` | - |
+| icon | 自定义图标 | ``success` | `fail` | `loading` | `warn` | `React.ReactNode`` | - |
+| size | 文案尺寸，三选一 | ``small` | `base` | `large`` | base |
+| contentClassName | 自定义内容区类名 | `string` | - |
+| contentStyle | 自定义内容区样式 | `React.CSSProperties` | - |
+| closeOnOverlayClick | 是否在点击遮罩层后关闭提示 | `boolean` | false |
+| lockScroll | 背景是否锁定 | `boolean` | false |
+| onClose | 关闭时触发的事件 | `() => void` | () => void |
+| clear | 关闭所有显示中的`Toast` | `-` | |
+| config | `Toast`全局配置 | ``{ duration: number, position: 'top' | 'center' | 'bottom', closeOnOverlayClick: boolean, lockScroll: boolean }`` | |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| type | 动画类型，见下方type值说明 | `AnimateType` | shake |
+| action | 触发方式，'initial'--初始化执行; 'click'--点击执行 | ``initial` | `click`` | initial |
+| loop | 是否循环执行。true-循环执行;false-执行一次 | `boolean` | false |
+| onClick | 点击元素时触发 | `event: Event` | - |
+| 1 | shake | `抖动，建议loop为true` | |
+| 2 | ripple | `不循环则是放大后缩小，循环则是心跳` | |
+| 3 | breath | `呼吸灯，建议loop为true` | |
+| 4 | float | `漂浮，建议loop为true` | |
+| 5 | slide-right | `由右向左划入` | |
+| 6 | slide-left | `由左向右划入` | |
+| 7 | slide-top | `由上至下划入` | |
+| 8 | slide-bottom | `由下至上划入` | |
+| 9 | jump | `跳跃，建议loop为true` | |
+| 10 | twinkle | `水波，建议loop为true` | |
+| 11 | flicker | `擦亮按钮，建议loop为true` | |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| length | 设置最大展示长度，数值位数不够，数值前面按位补 0 | `number` | 0 |
+| value | 结束值,必填项 | `string` | number |
+| delay | 等待动画执行时间，单位 ms | `number` | 300 |
+| duration | 动画执行时间，单位 s | `number` | 1 |
+| thousands | 是否有千位分隔符 | `boolean` | false |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| src | 语音资源链接 | `string` | - |
+| muted | 是否静音 | `boolean` | false |
+| autoPlay | 是否自动播放 | `boolean` | false |
+| loop | 是否循环播放 | `boolean` | false |
+| preload | 是否预加载语音 | ``none` | `metadata` | `auto`` | auto |
+| type | 展示形式，可选值：controls 控制面板 progress 进度条 icon 图标 none 自定义 | `string` | progress |
+| onBack | 语音快退回调，type = progress 时生效 | `(event：HTMLAudioElement) => void` | - |
+| onForward | 语音快进回调，type = progress 时生效 | `(event：HTMLAudioElement) => void` | - |
+| onPause | 暂停回调 | `(event：HTMLAudioElement) => void` | - |
+| onEnd | 语音播放完成，loop = false 时生效 | `(event：HTMLAudioElement) => void` | - |
+| onMute | 静音回调 | `(event：HTMLAudioElement) => void` | - |
+| onCanPlay | 可以播放媒体时触发 | `(event：HTMLAudioElement) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| size | 设置头像的大小 | ``large` | `normal` | `small` | `numbers`` | - |
+| shape | 设置头像的形状 | ``round` | `square`` | round |
+| background | 设置 Icon、字符类型头像的背景色 | `string` | #eee |
+| color | 设置 Icon、字符类型头像的颜色 | `string` | #666 |
+| fit | 图片填充模式 | ``contain` | `cover` | `fill` | `none` | `scale-down` | `cover`` | - |
+| src | 设置图片类型头像的地址 | `string` | - |
+| alt | 设置图片类型头像无法显示时的替代文本 | `string` | - |
+| icon | 设置 Icon 类型头像图标 | `ReactNode` | - |
+| onClick | 点击头像触发事件 | `(e: MouseEvent) => void` | - |
+| onError | 图片加载失败的事件 | `() => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| max | 显示的最大头像个数 | ``string` | `number`` | - |
+| maxContent | 头像数量超出时，会出现一个头像折叠元素。该元素内容可为...、more、+N。 | `string` | - |
+| size | 设置头像的大小，可选值为：large、normal、small，支持直接输入数字 | ``large` | `normal` | `small`` | - |
+| shape | 设置头像的形状 | ``string` | `round`` | - |
+| maxBackground | 设置 Icon、字符类型头像的背景色 | `string` | #eee |
+| maxColor | 设置 Icon、字符类型头像的颜色 | `string` | #666 |
+| gap | 设置头像之间的间距 | `string` | -8 |
+| level | 头像之间的层级关系，可选值为：left、right | ``left` | `right`` | left |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| percent | 百分比 | ``number` | `string`` | 必传项，无默认值 |
+| strokeWidth | 圆弧的宽度 | ``number` | `string`` | 5 |
+| radius | 半径 | ``number` | `string`` | 50 |
+| color | 圆环进度条颜色，传入对象格式可以定义渐变色 | ``object | string`` | - |
+| background | 圆环轨道颜色 | `string` | #d9d9d9 |
+| strokeLinecap | 圆环进度条端点形状 | ``butt` | `round` | `square` | `inherit`` | round |
+| clockwise | 是否顺时针展示 | `boolean` | true |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| defaultActiveName | 默认展开面板的 name，非受控 | ``Array` | `string`` | - |
+| activeName | 当前展开面板的 name，受控 | ``Array` | `string`` | - |
+| accordion | 是否开启手风琴模式 | `boolean` | false |
+| rotate | 点击折叠和展开的旋转角度,在自定义图标模式下生效 | ``string` | `number`` | 180 |
+| expandIcon | 自定义展开图标 | `ReactNode` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| name | 唯一标识符，必填 | `string` | - |
+| title | 标题栏左侧内容 | `ReactNode` | - |
+| disabled | 标题栏是否禁用 | `boolean` | false |
+| extra | 标题栏副标题 | `ReactNode` | - |
+| rotate | 点击折叠和展开的旋转角度,在自定义图标模式下生效 | ``string` | `number`` | 180 |
+| expandIcon | 自定义展开图标 | `ReactNode` | - |
+| onChange | 切换面板时触发 | `(activeName, name, status) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| startTime | 开始时间 | `number` | Date.now() |
+| endTime | 结束时间 | `number` | Date.now() |
+| remainingTime | 剩余时间，单位是毫秒 | `number` | 0 |
+| paused | 是否暂停 | `boolean` | false |
+| format | 时间格式 | `string` | HH:mm:ss |
+| millisecond | 是否开启毫秒级渲染 | `boolean` | false |
+| autoStart | 是否自动开始倒计时 | `boolean` | true |
+| time | 倒计时显示时间，单位是毫秒。autoStart 为 false 时生效 | `number` | 0 |
+| destroy | 销毁实例 | `boolean` | false |
+| onEnd | 倒计时结束时回调函数 | `无` | - |
+| onPaused | 暂停倒计时回调函数 | `onPaused: (restTime: number) => void` | - |
+| onRestart | 重新开始倒计时回调函数 | `onRestart: (restTime: number) => void` | - |
+| onUpdate | 自定义展示内容时，实时更新倒计时数据回调函数 | `onUpdate: (restTime: any) => void` | - |
+| DD | 天数 | `` | |
+| HH | 小时 | `` | |
+| mm | 分钟 | `` | |
+| ss | 秒数 | `` | |
+| S | 毫秒（1位） | `` | |
+| SS | 毫秒（2位） | `` | |
+| SSS | 毫秒（3位） | `` | |
+| start | 开始倒计时 | `() => void` | |
+| pause | 暂停倒计时 | `() => void` | |
+| reset | 重设倒计时，若 auto-start 为 true，重设后会自动开始倒计时 | `() => void` | |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| content | 文本内容 | `string` | - |
+| direction | 省略位置 | ``start` | `end` | `middle`` | end |
+| rows | 展示几行 | `number` | 1 |
+| expandText | 展开操作的文案 | `string` | - |
+| collapseText | 收起操作的文案 | `string` | - |
+| symbol | 省略的符号 | `string` | ... |
+| lineHeight | 容器的行高 | ``string` | `number`` | 20 |
+| onClick | 文本点击时触发 | `() => void` | - |
+| onChange | 点击展开收起时触发 | `(type: string) => void` | - |
+
+###
+
+| 属性 (Prop) | 说明 (Description) | 类型 (Type) | 默认值 (Default) |
+| --- | --- | --- | --- |
+| visible | 是否展示预览图片 | `boolean` | false |
+| videos | 预览的视频数组（视频自动放到图片之前） | `Array