@wot-ui/cli 1.0.4 → 1.0.5-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- import { a as findComponent, d as resolveVersion, f as loadMetadataFile, i as lintProject, m as version, n as getCliUpdateStatus, o as listComponents, p as name } from "./update-check-DlG1c3ZB.mjs";
1
+ import { _ as version, c as toComponentSummary, g as name, h as loadMetadataFile, i as lintProject, l as toDemoSummary, m as resolveVersion, n as getCliUpdateStatus, o as findComponent, s as listComponents } from "./update-check-YZ9xD4u9.mjs";
2
2
  import process from "node:process";
3
3
  import { McpServer, StdioServerTransport } from "@modelcontextprotocol/server";
4
4
  import * as z from "zod/v4";
@@ -22,6 +22,9 @@ const WOT_PAGE_GENERATOR_PROMPT = [
22
22
  function jsonText(value) {
23
23
  return JSON.stringify(value, null, 2);
24
24
  }
25
+ function compactJsonText(value) {
26
+ return JSON.stringify(value);
27
+ }
25
28
  function registerMcpTools(server, options = {}) {
26
29
  server.registerTool("wot_status", {
27
30
  description: "Get wot-ui MCP server and CLI update status.",
@@ -61,7 +64,7 @@ function registerMcpTools(server, options = {}) {
61
64
  }, async ({ version: version$1 }) => {
62
65
  return { content: [{
63
66
  type: "text",
64
- text: jsonText({ components: listComponents(version$1) })
67
+ text: compactJsonText({ components: listComponents(version$1).map(toComponentSummary) })
65
68
  }] };
66
69
  });
67
70
  server.registerTool("wot_info", {
@@ -140,7 +143,7 @@ function registerMcpTools(server, options = {}) {
140
143
  };
141
144
  if (!demo) return { content: [{
142
145
  type: "text",
143
- text: jsonText({ demos: result.demos ?? [] })
146
+ text: jsonText({ demos: (result.demos ?? []).map(toDemoSummary) })
144
147
  }] };
145
148
  const matched = result.demos?.find((item) => item.name.toLowerCase() === demo.toLowerCase());
146
149
  if (!matched) return {
@@ -2,13 +2,13 @@ import process from "node:process";
2
2
  import { existsSync, mkdirSync, readFileSync, readdirSync, writeFileSync } from "node:fs";
3
3
  import { dirname, join, relative, resolve } from "node:path";
4
4
  import { fileURLToPath } from "node:url";
5
+ import { homedir } from "node:os";
5
6
  import { gunzipSync } from "node:zlib";
6
7
  import { parse } from "@vue/compiler-sfc";
7
- import { homedir } from "node:os";
8
8
 
9
9
  //#region package.json
10
10
  var name = "@wot-ui/cli";
11
- var version = "1.0.4";
11
+ var version = "1.0.5-beta.1";
12
12
 
13
13
  //#endregion
14
14
  //#region src/data/loader.ts
@@ -201,6 +201,37 @@ function loadResolvedMetadata(version$1) {
201
201
  function listComponents(version$1) {
202
202
  return loadResolvedMetadata(version$1).components;
203
203
  }
204
+ function filterComponents(components, keyword) {
205
+ const normalized = keyword?.trim().toLowerCase();
206
+ if (!normalized) return components;
207
+ return components.filter((component) => {
208
+ return [
209
+ component.name,
210
+ component.nameZh,
211
+ component.tag,
212
+ component.category,
213
+ component.description,
214
+ component.descriptionZh
215
+ ].some((value) => value.toLowerCase().includes(normalized));
216
+ });
217
+ }
218
+ function toComponentSummary(component) {
219
+ return {
220
+ name: component.name,
221
+ nameZh: component.nameZh,
222
+ tag: component.tag,
223
+ category: component.category,
224
+ description: component.descriptionZh || component.description,
225
+ since: component.since
226
+ };
227
+ }
228
+ function toDemoSummary(demo) {
229
+ return {
230
+ name: demo.name,
231
+ title: demo.title,
232
+ description: demo.description
233
+ };
234
+ }
204
235
  function findComponent(name$1, version$1) {
205
236
  const normalized = name$1.trim().toLowerCase();
206
237
  return listComponents(version$1).find((component) => component.name.toLowerCase() === normalized || component.tag.toLowerCase() === normalized);
@@ -544,4 +575,4 @@ function writeCache(cacheFile, cache) {
544
575
  }
545
576
 
546
577
  //#endregion
547
- export { findComponent as a, formatStatusLabel as c, resolveVersion as d, loadMetadataFile as f, lintProject as i, writeStderrLine as l, version as m, getCliUpdateStatus as n, listComponents as o, name as p, analyzeUsage as r, formatLogMessage as s, checkForCliUpdate as t, detectVersion as u };
578
+ export { version as _, filterComponents as a, toComponentSummary as c, formatStatusLabel as d, writeStderrLine as f, name as g, loadMetadataFile as h, lintProject as i, toDemoSummary as l, resolveVersion as m, getCliUpdateStatus as n, findComponent as o, detectVersion as p, analyzeUsage as r, listComponents as s, checkForCliUpdate as t, formatLogMessage as u };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@wot-ui/cli",
3
3
  "type": "module",
4
- "version": "1.0.4",
4
+ "version": "1.0.5-beta.1",
5
5
  "description": "面向 wot-ui 的 CLI、MCP 与数据提取工具集",
6
6
  "license": "MIT",
7
7
  "funding": "https://github.com/sponsors/antfu",
@@ -25,7 +25,9 @@
25
25
  },
26
26
  "files": [
27
27
  "data",
28
- "dist"
28
+ "dist",
29
+ "skills/wot-ui-cli",
30
+ "skills/wot-ui-v2"
29
31
  ],
30
32
  "engines": {
31
33
  "node": ">=20.0.0"
@@ -35,6 +37,8 @@
35
37
  "@modelcontextprotocol/server": "2.0.0-alpha.2",
36
38
  "@vue/compiler-sfc": "^3.5.13",
37
39
  "commander": "^14.0.0",
40
+ "jsonc-parser": "^3.3.1",
41
+ "smol-toml": "^1.7.0",
38
42
  "zod": "^4.1.12"
39
43
  },
40
44
  "devDependencies": {
@@ -0,0 +1,73 @@
1
+ ---
2
+ name: wot-ui-cli
3
+ description: '回答、使用、调试 @wot-ui/cli 时使用。关键词:wot、@wot-ui/cli、CLI、MCP、doctor、usage、lint、list、info、doc、demo、token、changelog、extract、wot mcp。适用于命令查询、参数说明、MCP 接入、本地调试、数据提取与 open-wot 仓库维护。'
4
+ argument-hint: '命令名、参数、MCP 场景、调试问题或数据提取需求'
5
+ ---
6
+
7
+ # Wot UI CLI Skill
8
+
9
+ 这个 skill 用于让 Agent 在处理 `@wot-ui/cli` 本身相关的问题时,优先基于本仓库 README 与实际命令能力回答,而不是把它误当成纯组件库文档。
10
+
11
+ ## 适用场景
12
+
13
+ - 用户询问 `wot` 命令怎么用。
14
+ - 用户需要区分 `list`、`info`、`doc`、`demo`、`token`、`changelog`、`doctor`、`usage`、`lint`、`mcp`、`extract` 的用途。
15
+ - 用户要接入 MCP Server,或需要 `wot mcp` 的配置与调试方法。
16
+ - 用户要在本仓库中调试 `@wot-ui/cli`、验证构建产物、重新提取数据。
17
+ - 用户的问题本质上是 open-wot 仓库维护问题,而不是单纯的 wot-ui 组件使用问题。
18
+
19
+ ## 适用范围
20
+
21
+ - 关注对象是 `@wot-ui/cli` 这个工具包,以及仓库 `open-wot` 的开发维护流程。
22
+ - 重点覆盖命令能力、通用参数、MCP、离线数据来源、提取流程、本地调试和发布包边界。
23
+ - 如果任务是生成 `wd-*` 页面代码、解释组件 props 或给出主题定制方案,应优先使用 `wot-ui-v2` skill。
24
+
25
+ ## 推荐流程
26
+
27
+ 1. 先确认用户是在问 CLI 工具本身,还是在借 CLI 查询组件知识。
28
+ 2. 如果是命令使用问题,优先按命令类别回答:组件知识、项目分析、MCP、数据提取、仓库开发。
29
+ 3. 如果是仓库维护问题,优先给出本仓库里的实际调试命令,而不是泛泛而谈。
30
+ 4. 如果涉及组件内容本身,可引导或切换到 `wot-ui-v2` skill。
31
+
32
+ ## 命令分组
33
+
34
+ ### 组件知识查询
35
+
36
+ - `wot list`
37
+ - `wot info <Component>`
38
+ - `wot doc <Component>`
39
+ - `wot demo <Component> [name]`
40
+ - `wot token [Component]`
41
+ - `wot changelog [version] [component]`
42
+
43
+ ### 项目分析
44
+
45
+ - `wot doctor [dir]`
46
+ - `wot usage [dir]`
47
+ - `wot lint [dir]`
48
+
49
+ ### MCP
50
+
51
+ - `wot mcp`
52
+
53
+ ### 数据提取与仓库维护
54
+
55
+ - `pnpm extract:cli --wot-dir ../wot-ui --output data/v2.json`
56
+ - `pnpm extract:clone`
57
+ - `pnpm exec tsx src/index.ts <command>`
58
+ - `pnpm build`
59
+ - `node dist/index.mjs <command>`
60
+
61
+ ## 工作规则
62
+
63
+ - 包名是 `@wot-ui/cli`,实际可执行命令是 `wot`。
64
+ - 回答命令问题时,优先用仓库 README 中已承诺的行为和参数,不臆造未声明子命令。
65
+ - 回答本地调试问题时,优先给源码入口:`pnpm exec tsx src/index.ts ...`。
66
+ - 回答构建产物问题时,再给 `node dist/index.mjs ...`。
67
+ - 回答 MCP 问题时,要说明 `wot mcp` 走 stdio,终端无交互输出通常是正常现象。
68
+ - 回答提取逻辑问题时,要说明数据主要来自上游 `wot-ui/wot-ui` 的 markdown 与 SCSS 源码。
69
+ - 当用户问的是组件知识但入口是 CLI,也要保留“这是通过 CLI 查询组件知识”这一层语义。
70
+
71
+ ## 参考资料
72
+
73
+ - [Wot UI CLI 概览](./references/overview.md)
@@ -0,0 +1,215 @@
1
+ # Wot UI CLI Overview
2
+
3
+ 本文件根据本仓库 README 整理,目标是让 Agent 快速理解 `@wot-ui/cli` 的能力边界、命令分组、MCP 接入方式、开发调试路径与数据来源。
4
+
5
+ ## Package Identity
6
+
7
+ - 包名:`@wot-ui/cli`
8
+ - 仓库:open-wot
9
+ - 可执行命令:`wot`
10
+ - 核心定位:wot-ui 的 AI 工具链仓库,提供 CLI、MCP Server、离线组件知识库与数据提取脚本。
11
+
12
+ ## Repository Positioning
13
+
14
+ - 面向 wot-ui v2 的组件知识查询工具。
15
+ - 面向本地项目的组件使用分析与 lint 工具。
16
+ - 面向 AI 客户端的 MCP stdio 服务。
17
+ - 面向仓库维护者的数据提取与同步工作流。
18
+
19
+ ## Core Capabilities
20
+
21
+ ### Component Knowledge
22
+
23
+ - `list`:列出可用组件。
24
+ - `info <Component>`:查看 props、events、slots、CSS 变量。
25
+ - `doc <Component>`:输出组件 markdown 文档。
26
+ - `demo <Component> [name]`:查看 demo 列表或指定 demo 源码。
27
+ - `token [Component]`:查看组件 CSS 变量与默认值。
28
+ - `changelog [version] [component]`:查看版本更新记录。
29
+
30
+ ### Project Analysis
31
+
32
+ - `doctor [dir]`:检查项目依赖、运行环境与基础集成情况。
33
+ - `usage [dir]`:统计 `.vue` 文件中的 `wd-*` 使用情况。
34
+ - `lint [dir]`:检查未知组件、空按钮等规则。
35
+
36
+ ### MCP Server
37
+
38
+ - `mcp`:启动 MCP stdio server。
39
+
40
+ ## Typical User Flows
41
+
42
+ ### Query Component Knowledge Through CLI
43
+
44
+ 常用顺序:
45
+
46
+ 1. `wot list`
47
+ 2. `wot info Button`
48
+ 3. `wot demo Button basic`
49
+ 4. `wot doc Button`
50
+ 5. `wot token Button`
51
+
52
+ ### Analyze A Local Project
53
+
54
+ 常用顺序:
55
+
56
+ 1. `wot doctor ./my-project`
57
+ 2. `wot usage ./my-project`
58
+ 3. `wot lint ./my-project`
59
+
60
+ ### Run MCP In A Client
61
+
62
+ 推荐自动接入:
63
+
64
+ ```bash
65
+ wot agent init --client cursor
66
+ wot agent status --client cursor
67
+ wot agent doctor --client cursor
68
+ ```
69
+
70
+ 只管理 MCP 时使用:
71
+
72
+ ```bash
73
+ wot mcp init --client cursor
74
+ wot mcp print --client cursor
75
+ wot mcp status --client cursor
76
+ wot mcp doctor --client cursor
77
+ wot mcp remove --client cursor
78
+ ```
79
+
80
+ 所有写操作支持 `--dry-run`;Agent 或 CI 非交互执行时显式传入 `--yes`。
81
+
82
+ 典型配置:
83
+
84
+ ```json
85
+ {
86
+ "mcpServers": {
87
+ "wot-ui": {
88
+ "command": "npx",
89
+ "args": ["-y", "@wot-ui/cli", "mcp"]
90
+ }
91
+ }
92
+ }
93
+ ```
94
+
95
+ 当前 README 明确列出的 MCP tools 有:
96
+
97
+ - `wot_list`
98
+ - `wot_info`
99
+ - `wot_doc`
100
+ - `wot_demo`
101
+ - `wot_token`
102
+ - `wot_changelog`
103
+ - `wot_lint`
104
+
105
+ ## Common Flags
106
+
107
+ 多数查询命令支持:
108
+
109
+ - `--format text`
110
+ - `--format json`
111
+ - `--version v2`
112
+
113
+ ## Install And Run
114
+
115
+ ### Global Install
116
+
117
+ ```bash
118
+ npm install -g @wot-ui/cli
119
+ ```
120
+
121
+ 安装后直接用 `wot`。
122
+
123
+ ### Source Mode In This Repo
124
+
125
+ ```bash
126
+ pnpm exec tsx src/index.ts list
127
+ pnpm exec tsx src/index.ts info Button
128
+ pnpm exec tsx src/index.ts mcp
129
+ ```
130
+
131
+ 适合本地调试源码,不依赖全局安装。
132
+
133
+ ### Built Artifact Mode
134
+
135
+ ```bash
136
+ pnpm build
137
+ node dist/index.mjs list
138
+ ```
139
+
140
+ 适合验证构建产物行为。
141
+
142
+ ## MCP Operational Notes
143
+
144
+ - `wot mcp` 走 stdio。
145
+ - 终端里没有交互输出通常是正常现象。
146
+ - 若要调试 tool 与 prompt 调用过程,建议配合 MCP Inspector 或编辑器内置 MCP 客户端。
147
+
148
+ ## Data Source And Extraction
149
+
150
+ 当前版本聚焦 `wot-ui v2`。
151
+
152
+ 离线数据主要提取自上游 `wot-ui/wot-ui` 的:
153
+
154
+ - `docs/component/*.md`
155
+ - `docs/guide/changelog.md`
156
+ - `src/uni_modules/wot-ui/components/*/index.scss`
157
+
158
+ 重新生成数据有两种方式:
159
+
160
+ ### Use A Local Wot UI Repo
161
+
162
+ ```bash
163
+ pnpm extract:cli --wot-dir ../wot-ui --output data/v2.json
164
+ ```
165
+
166
+ ### Clone Latest Upstream And Extract
167
+
168
+ ```bash
169
+ pnpm extract:clone
170
+ ```
171
+
172
+ ## Repo Layout
173
+
174
+ - `src`:CLI、MCP 与项目分析源码。
175
+ - `data`:离线组件元数据。
176
+ - `scripts`:提取脚本。
177
+ - `skills`:面向 Agent 的技能说明。
178
+ - `test`:根包测试。
179
+
180
+ ## Local Development Commands
181
+
182
+ ### Environment
183
+
184
+ - Node.js `>= 20`
185
+ - pnpm `10.x`
186
+
187
+ ### Install
188
+
189
+ ```bash
190
+ pnpm install
191
+ ```
192
+
193
+ ### Common Validation
194
+
195
+ ```bash
196
+ pnpm lint
197
+ pnpm test:all
198
+ pnpm build:all
199
+ pnpm typecheck:all
200
+ ```
201
+
202
+ ### Package-Level Commands
203
+
204
+ ```bash
205
+ pnpm build
206
+ pnpm test
207
+ pnpm typecheck
208
+ ```
209
+
210
+ ## Agent Guidance
211
+
212
+ - 如果用户问的是命令怎么用,按“命令组 + 示例命令 + 输出用途”来回答。
213
+ - 如果用户问的是仓库维护或调试,优先给本仓库中的真实命令和目录。
214
+ - 如果用户问的是组件本身怎么写页面,不要停留在 CLI 层,应切换到 `wot-ui-v2` skill。
215
+ - 不要把 `wot` 命令和 `@wot-ui/ui` 组件库 API 混为一谈。
@@ -0,0 +1,46 @@
1
+ ---
2
+ name: wot-ui-v2
3
+ description: '回答、生成、重构、排查 wot-ui v2 相关代码时使用。关键词:wot-ui、uni-app、Vue3、wd-、ConfigProvider、useToast、useDialog、Form、Popup、theme、llms-full。适用于组件选型、API 查询、示例页面生成、主题定制、常见坑排查。'
4
+ argument-hint: '组件名、页面场景、问题描述或主题定制需求'
5
+ ---
6
+
7
+ # Wot UI V2 Skill
8
+
9
+ 这个 skill 用于让 Agent 在处理 wot-ui v2 相关任务时,优先采用组件库既有能力、遵守 uni-app 场景限制,并结合本仓库提供的 `wot` CLI 查询离线知识。
10
+
11
+ ## 适用场景
12
+
13
+ - 用户询问某个 `wd-*` 组件的基础用法、属性、事件、插槽或样式变量。
14
+ - 需要生成或重构 `uni-app + Vue 3 + TypeScript` 的 wot-ui 页面或组件代码。
15
+ - 需要在 `ConfigProvider`、主题变量、暗黑模式、国际化、反馈类 hooks、表单等场景下给出正确做法。
16
+ - 需要排查文档中常见的 `Toast`、`Dialog`、`Popup`、`Tabs`、`Slider`、样式覆盖问题。
17
+ - 用户只是泛化地提到主题定制,但还没有明确要求按“单文件主题 SCSS + App.vue 只 `@use`”的结构生成时。
18
+
19
+ ## 推荐流程
20
+
21
+ 1. 先用本仓库 CLI 或 MCP 工具查组件知识。
22
+ 2. 再根据项目实际安装方式决定导入路径与集成方式。
23
+ 3. 优先复用现成的 `wd-*` 组件、hooks、主题变量与组合模式,不要退化成原生标签堆砌。
24
+ 4. 如果问题涉及约束或坑位,再查阅 [参考知识](./references/overview.md)。
25
+ 5. 如果用户明确要求生成 `src/themes/styles/{主题名}.scss` 单文件主题,并把挂载逻辑收进主题文件,优先切换到 `create-wot-ui-theme` skill。
26
+
27
+ ## 查询顺序
28
+
29
+ 1. `wot list` 找组件名。
30
+ 2. `wot info <Component>` 看 props、events、slots、CSS 变量。
31
+ 3. `wot demo <Component>` 看 demo 名称或具体 demo 代码。
32
+ 4. `wot doc <Component>` 看完整 markdown 文档。
33
+ 5. `wot token <Component>` 看主题变量。
34
+
35
+ ## 工作规则
36
+
37
+ - 默认把 wot-ui 视为 `uni-app + Vue 3 + TypeScript` 组件库。
38
+ - 写页面时优先输出 `script setup` 风格。
39
+ - 反馈类能力如 `useToast`、`useDialog`、`useNotify`、`useImagePreview`、`useVideoPreview`,除了 hook 调用外,通常还需要页面内显式声明对应组件实例。
40
+ - 文档里经常出现 `@/uni_modules/wot-ui` 导入路径;如果用户项目采用 npm 安装,应切换成 `@wot-ui/ui`。
41
+ - 主题定制优先走 `ConfigProvider` 和 CSS 变量,不优先建议深度覆盖内部类名。
42
+ - 生成代码时尽量沿用组件库文档里的命名和交互模式,例如 `v-model:visible`、`before-confirm`、`confirm`、`change`、`custom-class`、`custom-style`。
43
+
44
+ ## 参考资料
45
+
46
+ - [Wot UI V2 概览](./references/overview.md)
@@ -0,0 +1,85 @@
1
+ # Wot UI V2 Overview
2
+
3
+ 本文件根据 wot-ui v2 的 `llms-full.txt` 与本仓库现有 CLI 工作流提炼,目标是帮助 Agent 快速掌握适合生成代码与回答问题的高价值知识,而不是逐字复制官方文档。
4
+
5
+ ## Product Positioning
6
+
7
+ - Wot UI v2 是面向 `uni-app` 的 `Vue 3 + TypeScript` 组件库。
8
+ - 覆盖微信小程序、支付宝小程序、钉钉小程序、H5、APP 等平台。
9
+ - 组件命名统一为 `wd-*`。
10
+ - 组件库强调 AI 友好、主题定制、暗黑模式、国际化与跨端一致性。
11
+
12
+ ## Installation And Integration
13
+
14
+ - npm 安装:`pnpm add @wot-ui/ui`
15
+ - 使用前需要安装 `sass`。
16
+ - `uni_modules` 安装模式天然支持 easycom 自动引入。
17
+ - npm 安装模式通常需要配置 vite resolver 或 easycom。
18
+ - CLI 项目在 npm 模式下可在 `tsconfig.json` 中加入 `@wot-ui/ui/global` 以增强全局组件类型提示。
19
+
20
+ ## Import Rules
21
+
22
+ - npm 安装项目:组合式函数、类型和工具优先从 `@wot-ui/ui` 导入。
23
+ - `uni_modules` 安装项目:文档中的 `@/uni_modules/wot-ui` 路径通常可直接使用。
24
+ - 官方文档示例很多基于 `uni_modules` 路径,回答时要按用户项目实际安装方式转换。
25
+
26
+ ## High Value Conventions
27
+
28
+ - 反馈类组件不能依赖全局挂载。页面内通常需要显式写出 `wd-toast`、`wd-dialog`、`wd-notify`、`wd-image-preview`、`wd-video-preview` 等实例。
29
+ - `useToast`、`useDialog`、`useNotify`、`useQueue` 等 hooks 基于 `provide/inject`,应在 `setup` 中调用。
30
+ - 页面内如果存在多个 `wd-dialog` 或 `wd-toast`,需要通过 `selector` 区分,否则可能出现实例冲突或重复弹出。
31
+ - 自定义组件中如果要覆盖 wot-ui 内部样式,小程序环境通常需要把组件配置为 `styleIsolation: 'shared'`。
32
+ - 在 `Popup`、`ActionSheet`、`DropDownItem` 等延迟渲染弹层里使用 `Slider`、`Tabs` 等依赖尺寸计算的组件时,打开后应调用实例方法重新初始化,例如 `initSlider()` 或 `updateLineStyle()`。
33
+
34
+ ## Theme And Styling
35
+
36
+ - 主题定制优先走 CSS 变量。
37
+ - Design Token 分三层:基础变量、语义变量、组件变量。
38
+ - 局部或全局主题可通过 `wd-config-provider` 的 `theme` 和 `theme-vars` 控制。
39
+ - 深色模式通过 `wd-config-provider theme="dark"` 开启。
40
+ - 更推荐覆盖语义变量或组件变量,不推荐优先依赖深层 class 选择器覆盖。
41
+
42
+ ## Common UI Patterns
43
+
44
+ - 表单场景优先组合 `wd-form`、`wd-form-item`、`wd-input`、`wd-textarea`、`wd-picker`、`wd-calendar`、`wd-select-picker`。
45
+ - 弹层类场景优先使用 `wd-popup`、`wd-dialog`、`wd-action-sheet`、`wd-tooltip`、`wd-popover`。
46
+ - 反馈类场景优先使用 `useToast`、`useDialog`、`useNotify`,不要直接手写临时弹层。
47
+ - 列表和展示类场景优先考虑 `wd-cell`、`wd-card`、`wd-tag`、`wd-badge`、`wd-empty`、`wd-loadmore`、`wd-skeleton`。
48
+ - 导航与布局类场景优先考虑 `wd-navbar`、`wd-tabs`、`wd-tabbar`、`wd-sidebar`、`wd-row`、`wd-col`、`wd-gap`。
49
+
50
+ ## Interaction Patterns
51
+
52
+ - 大量组件采用 `v-model` 或 `v-model:visible` 控制状态。
53
+ - 表单和选择类组件普遍提供 `confirm`、`change`、`close` 等事件。
54
+ - 反馈组件常通过 hook 返回方法对象,例如 `toast.success()`、`dialog.confirm()`。
55
+ - `Popover`、`Tooltip`、`SwipeAction` 等场景常与 `useQueue().closeOutside()` 配合,实现点击外部关闭。
56
+
57
+ ## Component Selection Hints
58
+
59
+ - 需要主操作按钮时用 `wd-button`,不要先写原生 `button`。
60
+ - 需要列表入口、设置页、表单容器时优先用 `wd-cell` 和 `wd-cell-group`。
61
+ - 需要轻量提示时优先用 `useToast`;需要确认交互时优先用 `useDialog`。
62
+ - 需要单选或多选弹层时优先用 `wd-select-picker`、`wd-picker`、`wd-cascader`。
63
+ - 需要统一主题或暗黑模式时优先用 `wd-config-provider`。
64
+
65
+ ## Common Pitfalls
66
+
67
+ - `Toast`、`Dialog` 等函数式调用没有效果,先检查页面里是否声明了对应组件实例。
68
+ - 同一个页面里多个无 `selector` 的反馈组件可能相互干扰。
69
+ - npm 模式使用国际化时,开发态可能需要在 Vite 的 `optimizeDeps.exclude` 中排除 `@wot-ui/ui`。
70
+ - 文档里的导入路径和项目实际安装方式不一致时,回答要主动修正。
71
+ - 在弹层中直接渲染依赖尺寸测量的组件时,初始化时机往往比 API 本身更关键。
72
+
73
+ ## AI Response Heuristics
74
+
75
+ - 回答基础用法时,优先给最小可运行模板,再补充常用 props。
76
+ - 生成页面时,优先给完整的 `template + script setup + style` 结构。
77
+ - 如果项目已使用 wot-ui,不要建议换用其他 UI 库。
78
+ - 如果 wot-ui 已有现成组件,就不要用原生结构重复造轮子。
79
+ - 如果用户只问某个组件,优先给该组件最常见 3 到 5 个用法,不要把整份文档全部展开。
80
+
81
+ ## Repo-Specific Workflow
82
+
83
+ - 在本仓库中,优先使用 `wot list`、`wot info`、`wot doc`、`wot demo`、`wot token` 获取组件知识。
84
+ - 当仓库数据与线上文档不一致时,以用户目标为准,并明确指出仓库离线数据可能需要重新提取。
85
+ - 若要补数据或修提取逻辑,关注 `scripts/extract.ts`、`data/v2.json`、`src/data/*` 与相应命令实现。