weifuwu 0.85.0 → 0.87.0

package/content/components/breadcrumb.md

@@ -0,0 +1,49 @@
+# Breadcrumb · components
+
+## 概述
+
+面包屑导航，支持 aria-current
+
+## 典型场景
+
+- 页面模式：docs（复制即用蓝本——examples/patterns/）
+- 页面导航——侧栏、页头、标签页、步骤、分页
+
+## API
+
+| prop | 类型 | 必填 | 说明 |
+|------|------|------|------|
+| `items` | `BreadcrumbItem[]` | 是 |  |
+
+## 用法示例
+
+```tsx
+<Breadcrumb items={[
+  { label: '首页', href: '/' },
+  { label: '用户管理' },
+  { label: '编辑' },
+]} />
+```
+
+## 纪律/坑
+
+> 键盘可达（P1）：方向键导航焦点跟随（roving tabindex）；受控 props 配回调
+
+## 关系
+
+- ↑ 用于页面模式：[docs](../patterns/docs.md)
+- ↑ 用于应用：（暂无）
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| 源码 | `src/client/components/Breadcrumb/Breadcrumb.ts` |
+| 样式 | `src/client/components/Breadcrumb/Breadcrumb.css` |
+| 测试 | `src/client/components/Breadcrumb/Breadcrumb.test.ts` |
+| demo | `apps/showcase/src/demos/DemoBreadcrumb.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/navigation/breadcrumb` ——（P1 填充具体步骤）

package/content/components/button.md

@@ -0,0 +1,63 @@
+# Button · components
+
+## 概述
+
+4 variants × 3 sizes + loading + block + disabled
+
+## 典型场景
+
+- 页面模式：app-shell、workspace、focus-task、docs、landing、list-page、detail-page、settings-page（复制即用蓝本——examples/patterns/）
+- 应用模板：todo、auth、multi（examples/apps/ 完整可跑）
+- 基础元素（按钮/图标/文本/卡片/标签）——任意页面的构成单元
+
+## API
+
+| prop | 类型 | 必填 | 说明 |
+|------|------|------|------|
+| `variant` | `'primary' \| 'secondary' \| 'ghost' \| 'danger' \| 'danger-ghost'` | 否 |  |
+| `size` | `'sm' \| 'md' \| 'lg'` | 否 |  |
+| `block` | `boolean` | 否 |  |
+| `loading` | `boolean` | 否 |  |
+| `disabled` | `boolean` | 否 |  |
+| `type` | `'button' \| 'submit'` | 否 |  |
+| `title` | `string` | 否 |  |
+| `id` | `string` | 否 | 透传 DOM id（测试定位/锚点） |
+| `class` | `string` | 否 | 透传原生 class（覆盖默认 wf-btn 组合） |
+| `onClick` | `(e: MouseEvent) => void` | 否 |  |
+| `children` | `any` | 否 |  |
+
+## 用法示例
+
+```tsx
+<Button variant="primary" onClick={...}>Primary</Button>
+<Button variant="secondary" />
+<Button variant="ghost" />
+<Button variant="danger" />
+<Button size="sm" /><Button size="md" /><Button size="lg" />
+<Button loading>Loading</Button>
+<Button disabled />
+<Button block />
+```
+
+## 纪律/坑
+
+> 浏览器纪律（§5.5）：组件能力经 ctx.browser / ctx.ui.useXXX——禁裸 window/document
+
+## 关系
+
+- ↑ 用于页面模式：[app-shell](../patterns/app-shell.md) · [workspace](../patterns/workspace.md) · [focus-task](../patterns/focus-task.md) · [docs](../patterns/docs.md) · [landing](../patterns/landing.md) · [list-page](../patterns/list-page.md) · [detail-page](../patterns/detail-page.md) · [settings-page](../patterns/settings-page.md)
+- ↑ 用于应用：[todo](../apps/todo.md) · [auth](../apps/auth.md) · [multi](../apps/multi.md)
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| 源码 | `src/client/components/Button/Button.ts` |
+| 样式 | `src/client/components/Button/Button.css` |
+| 测试 | `src/client/components/Button/Button.test.ts` |
+| demo | `apps/showcase/src/demos/DemoButton.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/core/button` ——（P1 填充具体步骤）

package/content/components/calendar-v2.md

@@ -0,0 +1,40 @@
+# Calendar 事件 · components
+
+## 概述
+
+事件标记 + 日期选择交互（变体覆盖）
+
+## 典型场景
+
+- 复杂数据交互——穿梭、树、级联、看板、流水线
+
+## API
+
+> props 提取降级（接口格式特殊）——见源码：`—`
+
+## 用法示例
+
+```tsx
+<Calendar month={5} year={2025} selectedDate="2025-06-10"
+  events={[{date:'2025-06-10',title:'需求评审'}]} onSelectDate={d => set(d)} />
+```
+
+## 纪律/坑
+
+> （该分类暂无通用纪律——组件级事故见源码注释）
+
+## 关系
+
+- ↑ 用于页面模式：（暂无）
+- ↑ 用于应用：（暂无）
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| demo | `apps/showcase/src/demos/DemoCalendarEvents.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/advanced/calendar-v2` ——（P1 填充具体步骤）

package/content/components/calendar.md

@@ -0,0 +1,50 @@
+# Calendar · components
+
+## 概述
+
+月历：事件点 + 月切换 + 日期选择（antd/EP Calendar）
+
+## 典型场景
+
+- 复杂数据交互——穿梭、树、级联、看板、流水线
+
+## API
+
+| prop | 类型 | 必填 | 说明 |
+|------|------|------|------|
+| `events` | `CalendarEvent[]` | 否 |  |
+| `month` | `number` | 否 | 受控年月：month 0-11，year 四位数 |
+| `year` | `number` | 否 |  |
+| `onMonthChange` | `(month: number, year: number) => void` | 否 |  |
+| `onSelectDate` | `(date: string) => void` | 否 |  |
+| `selectedDate` | `string` | 否 |  |
+
+## 用法示例
+
+```tsx
+<Calendar month={5} year={2025}
+  events={events} selectedDate="2025-06-10" />
+```
+
+## 纪律/坑
+
+- 受控纪律：受控 month/value 必须配回调——缺回调静默不可点（console.warn 防护）
+
+## 关系
+
+- ↑ 用于页面模式：（暂无）
+- ↑ 用于应用：（暂无）
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| 源码 | `src/client/components/Calendar/Calendar.ts` |
+| 样式 | `src/client/components/Calendar/Calendar.css` |
+| 测试 | `src/client/components/Calendar/Calendar.test.ts` |
+| demo | `apps/showcase/src/demos/DemoCalendar.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/advanced/calendar` ——（P1 填充具体步骤）

package/content/components/card.md

@@ -0,0 +1,58 @@
+# Card · components
+
+## 概述
+
+容器，支持 default/outlined/clickable
+
+## 典型场景
+
+- 页面模式：app-shell、focus-task、dashboard、data-screen、landing、list-page、detail-page（复制即用蓝本——examples/patterns/）
+- 应用模板：auth、multi（examples/apps/ 完整可跑）
+- 基础元素（按钮/图标/文本/卡片/标签）——任意页面的构成单元
+
+## API
+
+| prop | 类型 | 必填 | 说明 |
+|------|------|------|------|
+| `variant` | `'default' \| 'outlined'` | 否 |  |
+| `outlined` | `boolean` | 否 | 便捷：outlined = variant 'outlined' |
+| `padding` | `'sm' \| 'md' \| 'lg'` | 否 |  |
+| `clickable` | `boolean` | 否 |  |
+| `hover` | `boolean` | 否 | hover 抬升（阴影 + 上移），适合可点击/可悬停的卡片 |
+| `active` | `boolean` | 否 | 选中态（边框高亮 + 品牌浅底），适合选择卡片 |
+| `onClick` | `() => void` | 否 |  |
+| `className` | `string` | 否 |  |
+| `id` | `string` | 否 | id 属性（锚点定位——AgentDetail Tab 导航用） |
+| `style` | `Record<string, string>` | 否 |  |
+| `children` | `any` | 否 |  |
+
+## 用法示例
+
+```tsx
+<Card>默认卡片</Card>
+<Card variant="outlined">线框</Card>
+<Card clickable>可点击</Card>
+```
+
+## 纪律/坑
+
+> 浏览器纪律（§5.5）：组件能力经 ctx.browser / ctx.ui.useXXX——禁裸 window/document
+
+## 关系
+
+- ↑ 用于页面模式：[app-shell](../patterns/app-shell.md) · [focus-task](../patterns/focus-task.md) · [dashboard](../patterns/dashboard.md) · [data-screen](../patterns/data-screen.md) · [landing](../patterns/landing.md) · [list-page](../patterns/list-page.md) · [detail-page](../patterns/detail-page.md)
+- ↑ 用于应用：[auth](../apps/auth.md) · [multi](../apps/multi.md)
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| 源码 | `src/client/components/Card/Card.ts` |
+| 样式 | `src/client/components/Card/Card.css` |
+| 测试 | `src/client/components/Card/Card.test.ts` |
+| demo | `apps/showcase/src/demos/DemoCardShowcase.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/core/card` ——（P1 填充具体步骤）

package/content/components/carousel.md

@@ -0,0 +1,52 @@
+# Carousel · components
+
+## 概述
+
+轮播：箭头/圆点/循环 + 自动播放（三库共识）
+
+## 典型场景
+
+- 大数据列表/表格/树——千级+数据量的性能场景
+
+## API
+
+| prop | 类型 | 必填 | 说明 |
+|------|------|------|------|
+| `children` | `any[]` | 是 |  |
+| `autoplay` | `boolean` | 否 | 自动播放 |
+| `interval` | `number` | 否 | 自动播放间隔（ms），默认 3000 |
+| `showArrows` | `boolean` | 否 |  |
+| `showDots` | `boolean` | 否 |  |
+| `loop` | `boolean` | 否 | 循环播放（尾 → 头），默认 true |
+| `className` | `string` | 否 |  |
+
+## 用法示例
+
+```tsx
+<Carousel autoplay interval={3000}>
+  {slides.map(s => <div>{s}</div>)}
+</Carousel>
+```
+
+## 纪律/坑
+
+- 小尺寸 button 固定 min/max-height（§5.6）：圆点 8x45 竖条事故
+
+## 关系
+
+- ↑ 用于页面模式：（暂无）
+- ↑ 用于应用：（暂无）
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| 源码 | `src/client/components/Carousel/Carousel.ts` |
+| 样式 | `src/client/components/Carousel/Carousel.css` |
+| 测试 | `src/client/components/Carousel/Carousel.test.ts` |
+| demo | `apps/showcase/src/demos/DemoCarousel.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/virtual/carousel` ——（P1 填充具体步骤）

package/content/components/cascader-v2.md

@@ -0,0 +1,39 @@
+# Cascader 禁用/错误 · components
+
+## 概述
+
+disabled + error 校验态（状态矩阵覆盖）
+
+## 典型场景
+
+- 复杂数据交互——穿梭、树、级联、看板、流水线
+
+## API
+
+> props 提取降级（接口格式特殊）——见源码：`—`
+
+## 用法示例
+
+```tsx
+<Cascader options={regions} disabled error="地区必填" />
+```
+
+## 纪律/坑
+
+> （该分类暂无通用纪律——组件级事故见源码注释）
+
+## 关系
+
+- ↑ 用于页面模式：（暂无）
+- ↑ 用于应用：（暂无）
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| demo | `apps/showcase/src/demos/DemoCascaderDis.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/advanced/cascader-v2` ——（P1 填充具体步骤）

package/content/components/cascader.md

@@ -0,0 +1,54 @@
+# Cascader · components
+
+## 概述
+
+级联选择：多列面板逐级推进（antd/EP Cascader）
+
+## 典型场景
+
+- 复杂数据交互——穿梭、树、级联、看板、流水线
+
+## API
+
+| prop | 类型 | 必填 | 说明 |
+|------|------|------|------|
+| `options` | `CascaderOption[]` | 否 |  |
+| `value` | `string[]` | 否 | 选中路径（数组，如 ['zj','hz','xh']） |
+| `onChange` | `(value: string[]) => void` | 否 |  |
+| `placeholder` | `string` | 否 |  |
+| `disabled` | `boolean` | 否 |  |
+| `error` | `string` | 否 |  |
+| `label` | `string` | 否 |  |
+| `showSearch` | `boolean` | 否 | 显示搜索框（面板内，关键词时扁平过滤结果列表） |
+| `searchPlaceholder` | `string` | 否 | 搜索占位符 |
+
+## 用法示例
+
+```tsx
+<Cascader options={regions}
+  value={['zj','hz']} onChange={setPath} />
+```
+
+## 纪律/坑
+
+- 受控纪律：受控 value 必须配回调——缺回调静默不可点
+- 多选（multiple）已裁剪（低频——单选+搜索已够，见 components-cuts.md）
+
+## 关系
+
+- ↑ 用于页面模式：（暂无）
+- ↑ 用于应用：（暂无）
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| 源码 | `src/client/components/Cascader/Cascader.ts` |
+| 样式 | `src/client/components/Cascader/Cascader.css` |
+| 测试 | `src/client/components/Cascader/Cascader.test.ts` |
+| demo | `apps/showcase/src/demos/DemoCascader.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/advanced/cascader` ——（P1 填充具体步骤）

package/content/components/chart.md

@@ -0,0 +1,53 @@
+# Chart · components
+
+## 概述
+
+SVG 图表：line/bar/pie/radar/gauge/scatter——零依赖自绘
+
+## 典型场景
+
+- 应用模板：admin（examples/apps/ 完整可跑）
+- 数据看板/统计报表——指标卡、图表、趋势
+
+## API
+
+| prop | 类型 | 必填 | 说明 |
+|------|------|------|------|
+| `type` | `ChartType` | 否 |  |
+| `data` | `DataPoint[]` | 是 |  |
+| `options` | `ChartOptions` | 否 |  |
+| `title` | `string` | 否 |  |
+| `area` | `boolean` | 否 |  |
+| `className` | `string` | 否 |  |
+
+## 用法示例
+
+```tsx
+<Chart type="line" data={data} title="标题" />
+<Chart type="bar" data={data} />
+<Chart type="pie" data={data} />
+
+```
+
+## 纪律/坑
+
+> 图表自研 SVG：数据点 label 为轴名；交互 tooltip 经 usePopup（视口夹紧）
+
+## 关系
+
+- ↑ 用于页面模式：（暂无）
+- ↑ 用于应用：[admin](../apps/admin.md)
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| 源码 | `src/client/components/Chart/Chart.ts` |
+| 样式 | `src/client/components/Chart/Chart.css` |
+| 测试 | `src/client/components/Chart/Chart.test.ts` |
+| demo | `apps/showcase/src/demos/DemoChart.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/viz/chart` ——（P1 填充具体步骤）

package/content/components/chatinput.md

@@ -0,0 +1,63 @@
+# ChatInput · components
+
+## 概述
+
+独立聊天输入条（AiChat 抽取）：单行/多行 + streaming 停止 + IME 安全——不自带聊天逻辑
+
+## 典型场景
+
+- AI 对话/工具调用/审批/提示词——agent 场景全链路
+
+## API
+
+| prop | 类型 | 必填 | 说明 |
+|------|------|------|------|
+| `value` | `string` | 是 | 受控值（共享输入态——ChatInput 不持有聊天逻辑） |
+| `onChange` | `(v: string) => void` | 是 | 值变化（IME 安全：组合期间不触发） |
+| `onSend` | `(text: string) => void` | 是 | 发送（Enter 或按钮）——入参为当前输入文本（trim 后非空才触发） |
+| `streaming` | `boolean` | 否 | 流式状态——true 时按钮变「停止」 |
+| `onStop` | `() => void` | 否 | 停止回调（streaming 时按钮触发） |
+| `error` | `string \| null` | 否 | 错误——非流式时显示「重试」按钮 |
+| `onRetry` | `() => void` | 否 | 重试回调 |
+| `disabled` | `boolean` | 否 | 禁用（输入 + 按钮） |
+| `multiline` | `boolean` | 否 | 多行 textarea（Enter 发送 / Shift+Enter 换行）；默认 false = 单行 input |
+| `labels` | `Partial<ChatInputLabels>` | 否 | 标签（i18n 覆盖） |
+| `actions` | `VNode \| null` | 否 | 扩展位（附件/知识库/模型选择等） |
+| `onControl` | `(handle: ChatInputControl) => void` | 否 | 外部程序化控制（@ 补全等场景）——mount 期回调上抛稳定 handle（{ setKeyword, setValue }）—— |
+
+## 用法示例
+
+```tsx
+<ChatInput value={input} onChange={v => input = v}
+  onSend={text => send(text)}      // 回车/按钮触发（trim 后非空）
+  streaming={streaming}            // 流式 → 按钮变「停止」
+  onStop={() => stop()}
+  multiline                         // 多行 textarea（Shift+Enter 换行）
+  actions={<button>附件</button>}  // 扩展位插槽
+/>
+
+// 纯输入层：不自带聊天逻辑（useChat 组合在消费方）
+```
+
+## 纪律/坑
+
+> AI 协议纪律：消息流事件驱动（useChat 订阅）——高频 notify 由写者控制频率
+
+## 关系
+
+- ↑ 用于页面模式：（暂无）
+- ↑ 用于应用：（暂无）
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| 源码 | `src/client/components/ChatInput/ChatInput.ts` |
+| 样式 | `src/client/components/ChatInput/ChatInput.css` |
+| 测试 | `src/client/components/ChatInput/ChatInput.test.ts` |
+| demo | `apps/showcase/src/demos/DemoChatInput.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/ai/chatinput` ——（P1 填充具体步骤）

package/content/components/checkbox.md

@@ -0,0 +1,51 @@
+# Checkbox · components
+
+## 概述
+
+带 label 的复选框，支持 checked/disabled
+
+## 典型场景
+
+- 页面模式：focus-task（复制即用蓝本——examples/patterns/）
+- 应用模板：todo（examples/apps/ 完整可跑）
+- 表单输入/搜索/筛选——查询区、编辑表单、设置页
+
+## API
+
+| prop | 类型 | 必填 | 说明 |
+|------|------|------|------|
+| `label` | `string` | 否 |  |
+| `checked` | `boolean` | 否 |  |
+| `disabled` | `boolean` | 否 |  |
+| `onChange` | `(checked: boolean) => void` | 否 |  |
+
+## 用法示例
+
+```tsx
+<Checkbox label="同意"
+  checked={agree}
+  onChange={v => agree = v} />
+```
+
+## 纪律/坑
+
+> 受控输入纪律（§5.3）：输入期间 value 走内部态（useControlledInput）——依赖回流会重挂 input 丢焦点；IME composition 门控
+
+## 关系
+
+- ↑ 用于页面模式：[focus-task](../patterns/focus-task.md)
+- ↑ 用于应用：[todo](../apps/todo.md)
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| 源码 | `src/client/components/Checkbox/Checkbox.ts` |
+| 样式 | `src/client/components/Checkbox/Checkbox.css` |
+| 测试 | `src/client/components/Checkbox/Checkbox.test.ts` |
+| demo | `apps/showcase/src/demos/DemoCheckbox.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/input/checkbox` ——（P1 填充具体步骤）

package/content/components/checkboxgroup.md

@@ -0,0 +1,52 @@
+# CheckboxGroup · components
+
+## 概述
+
+复选框组：数组受控 + 栅格列数（antd Checkbox.Group）
+
+## 典型场景
+
+- 表单输入/搜索/筛选——查询区、编辑表单、设置页
+
+## API
+
+| prop | 类型 | 必填 | 说明 |
+|------|------|------|------|
+| `options` | `CheckboxGroupOption[]` | 否 |  |
+| `value` | `string[]` | 否 | 受控选中值 |
+| `onChange` | `(value: string[]) => void` | 否 |  |
+| `columns` | `1 \| 2 \| 3 \| 4` | 否 | 栅格列数（1-4） |
+| `size` | `'sm' \| 'md' \| 'lg'` | 否 |  |
+| `disabled` | `boolean` | 否 |  |
+| `label` | `string` | 否 | 组标题（可选） |
+| `className` | `string` | 否 |  |
+
+## 用法示例
+
+```tsx
+<CheckboxGroup options={[{value:'a',label:'A'}]}
+  value={selected} onChange={setSelected} />
+```
+
+## 纪律/坑
+
+> 受控输入纪律（§5.3）：输入期间 value 走内部态（useControlledInput）——依赖回流会重挂 input 丢焦点；IME composition 门控
+
+## 关系
+
+- ↑ 用于页面模式：（暂无）
+- ↑ 用于应用：（暂无）
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| 源码 | `src/client/components/CheckboxGroup/CheckboxGroup.ts` |
+| 样式 | `src/client/components/CheckboxGroup/CheckboxGroup.css` |
+| 测试 | `src/client/components/CheckboxGroup/CheckboxGroup.test.ts` |
+| demo | `apps/showcase/src/demos/DemoCheckboxGroup.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/input/checkboxgroup` ——（P1 填充具体步骤）

package/content/components/citationcard.md

@@ -0,0 +1,48 @@
+# CitationCard · components
+
+## 概述
+
+RAG 引用来源：折叠「引用 N 条」+ 条目列表（序号/标题/来源/片段/链接）+ 溢出 +N
+
+## 典型场景
+
+- AI 对话/工具调用/审批/提示词——agent 场景全链路
+
+## API
+
+| prop | 类型 | 必填 | 说明 |
+|------|------|------|------|
+| `items` | `Citation[]` | 是 |  |
+| `label` | `string` | 否 | 折叠头文案（默认「引用来源」） |
+| `maxVisible` | `number` | 否 | 折叠时最多显示条数（默认 3；溢出显示 +N 汇总条目） |
+| `defaultExpanded` | `boolean` | 否 | 初始展开（默认折叠） |
+| `onOpen` | `(citation: Citation) => void` | 否 | 点击条目回调（提供时不渲染链接，由调用方处理跳转/打开） |
+
+## 用法示例
+
+```tsx
+<CitationCard items={[{ id, title, source, snippet, url }]} maxVisible={3} />
+```
+
+## 纪律/坑
+
+> AI 协议纪律：消息流事件驱动（useChat 订阅）——高频 notify 由写者控制频率
+
+## 关系
+
+- ↑ 用于页面模式：（暂无）
+- ↑ 用于应用：（暂无）
+- → 后端能力：（暂无）
+
+## 文件位置
+
+| 文件 | 路径 |
+|------|------|
+| 源码 | `src/client/components/CitationCard/CitationCard.ts` |
+| 样式 | `src/client/components/CitationCard/CitationCard.css` |
+| 测试 | `src/client/components/CitationCard/CitationCard.test.ts` |
+| demo | `apps/showcase/src/demos/DemoCitationCard.tsx`（P1 拆分） |
+
+## 验证
+
+> agent-browser 走查：打开 `/components/ai/citationcard` ——（P1 填充具体步骤）