chore: sync feature to main branch #843
Conversation
* fix(attachment): fix image display style (#751) * chore: update CodePreviewer to support React 19 (#758) * docs: update a new contributions charts (#761) * fix: fix some potential issue (#773) * refactor: using setState function (#774) Co-authored-by: vanndxh <wangyuezhou.wyz@digital-engine.com> * type: fix some potential issue (#775) * fix: watch config three sub-items (#777) * feat: function setState * fix: watch config --------- Co-authored-by: vanndxh <wangyuezhou.wyz@digital-engine.com> * fix: fix Conversations ellipsis tooltip issues by removing it (#776) * fix: fix Conversations ellipsis tooltip issues by removing it * test: update snapshot * style: use native text overflow style * docs: changelog of 1.2.0 (#778) * fix: fix some potential issue * fix: fix some potential issue * fix: fix some potential issue * docs: changelog of 1.2.0 * docs: changelog of 1.2.0 * docs: changelog of 1.2.0 * docs: changelog of 1.2.0 * docs: changelog of 1.2.0 * docs: changelog of 1.2.0 * docs: changelog of 1.2.0 * 🏷️ type: add Conversation type export (#258) Co-authored-by: afc163 <afc163@gmail.com> * docs: fix the wrong docs of ThoughtChain (#781) * fix: fix some potential issue * fix: fix some potential issue * fix: fix some potential issue * docs: changelog of 1.2.0 * docs: changelog of 1.2.0 * docs: changelog of 1.2.0 * docs: changelog of 1.2.0 * docs: changelog of 1.2.0 * docs: changelog of 1.2.0 * docs: changelog of 1.2.0 * docs: fix the wrong docs of ThoughtChain * docs: optimize Bubble.List scoll position * docs: fix thought-chain and changelog * fix: Prompts scroll styles (#785) * fix: Prompts srollX * fix: Prompts srollX * docs: optimize Bubble.List scroll bar position (#783) * docs: optimize Bubble.List scoll position * docs: optimize Bubble.List scoll position * test: demo snap * fix: Prompts srollX * chore: sync main to feature branch --------- Co-authored-by: wzc520pyfm <1528857653@qq.com> Co-authored-by: ice <49827327+coding-ice@users.noreply.github.com> Co-authored-by: Shinji-Li <1349021570@qq.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Vanndxh <77873426+vanndxh@users.noreply.github.com> Co-authored-by: vanndxh <wangyuezhou.wyz@digital-engine.com> Co-authored-by: afc163 <afc163@gmail.com>
chore: sync main to feature branch
…n get key (#683) * feat: 调整Bubble foot,header参数,支持头部获取上下文 * fix: # 支持useXAgent通过deps 获取最新状态 * fix: 剔多余提交 * fix: 英文文档格式修复 * fix 简化参数 * Update header-and-footer.tsx fix: 调整用例 * feat: bubble's footer and header * feat: bubble's footer and header * test: bubble's footer and header * fix: ts of key * fix: ts of key --------- Co-authored-by: Mickey <951203214@qq.com>
📝 WalkthroughWalkthrough本次变更主要扩展并泛化了 Bubble 组件的内容类型定义，对 Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant Bubble
participant HeaderFooterFn
User->>Bubble: 传入 content, header, footer, _key 等 props
Bubble->>HeaderFooterFn: renderSlot(header/footer, content, { key: _key })
HeaderFooterFn-->>Bubble: 返回渲染节点
Bubble-->>User: 渲染自定义内容气泡
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
Note ⚡️ AI Code Reviews for VS Code, Cursor, WindsurfCodeRabbit now has a plugin for VS Code, Cursor and Windsurf. This brings AI code reviews directly in the code editor. Each commit is reviewed immediately, finding bugs before the PR is raised. Seamless context handoff to your AI code agent ensures that you can easily incorporate review feedback. Note ⚡️ Faster reviews with cachingCodeRabbit now supports caching for code and dependencies, helping speed up reviews. This means quicker feedback, reduced wait times, and a smoother review experience overall. Cached data is encrypted and stored securely. This feature will be automatically enabled for all accounts on May 30th. To opt out, configure ✨ Finishing Touches
🧪 Generate Unit Tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
|
|
WalkthroughThis pull request synchronizes the feature branch with the main branch, incorporating various updates and fixes. It includes enhancements to the Bubble component, updates to the CHANGELOG, and improvements in demo and documentation files. Changes
|
Bundle ReportBundle size has no change ✅ |
size-limit report 📦
|
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (6)
components/bubble/demo/header-and-footer.tsx (1)
16-20: 更新 header 属性为函数形式将
header属性从静态字符串更改为接收messageContext参数的函数，展示了Bubble组件新的 API 能力。建议优化类型处理，避免使用
as string类型断言：-header={(messageContext) => ( +header={(messageContext: string) => ( <Space size={token.paddingXXS}> - <div>{messageContext as string} </div> + <div>{messageContext}</div> </Space> )}components/bubble/Bubble.tsx (2)
43-44:_key命名易与 React 内置key概念混淆虽然通过前缀
_避免了属性被透传到 DOM，但实际在renderSlot中仍会转换成{ key: _key }，对使用者来说需要同时理解两套名字。建议统一命名（如messageKey），并在文档中明确说明其作用，降低理解成本。
120-121:renderSlot每次渲染都会新建函数，可能导致子组件额外重渲
renderSlot依赖于闭包中的typedContent和_key，目前在每次组件渲染时都会重新创建。若header/footer是纯 ReactNode，此行为无影响；但如果是函数并且内部使用React.memo或存在依赖比较，频繁的引用变更可能触发不必要的重渲。可以借助useCallback/useMemo缓存：-const renderSlot = (node: BubbleProps<any>['footer'] | BubbleProps<any>['header']) => - typeof node === 'function' ? node(typedContent, { key: _key }) : node; +const renderSlot = React.useCallback( + (node: BubbleProps<any>['footer'] | BubbleProps<any>['header']) => + typeof node === 'function' ? node(typedContent, { key: _key }) : node, + [typedContent, _key], +);components/bubble/demo/custom-content.tsx (1)
27-31: 图片缺少alt文案会影响可访问性Ant Design
Image组件未填写alt属性将给屏幕阅读器带来阻碍。建议使用内容文本或空串补全：-<Image height={50} src={content.imageUrl} /> +<Image height={50} src={content.imageUrl} alt={content.text} />components/bubble/demo/list-custom.tsx (2)
24-31: 同样补充图片alt属性提升无障碍体验示例中的
Image组件亦应提供alt：-<Image height={50} src={content?.imageUrl} /> +<Image height={50} src={content?.imageUrl} alt={content?.text} />
120-136:as any断言掩盖类型安全，可用范型精准声明
messageRender: (items) => <Prompts … />与<Attachments.FileCard>部分通过as any绕过了类型检查。考虑为Prompts、Attachments.FileCard等组件补充范型支持，或在此处显式定义内容数组类型，避免潜在的运行时错误。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (2)
components/bubble/__tests__/__snapshots__/demo-extend.test.ts.snapis excluded by!**/*.snapcomponents/bubble/__tests__/__snapshots__/demo.test.ts.snapis excluded by!**/*.snap
📒 Files selected for processing (19)
CHANGELOG.en-US.md(1 hunks)components/bubble/Bubble.tsx(4 hunks)components/bubble/BubbleList.tsx(1 hunks)components/bubble/demo/custom-content.md(1 hunks)components/bubble/demo/custom-content.tsx(1 hunks)components/bubble/demo/debug.tsx(1 hunks)components/bubble/demo/header-and-footer.tsx(1 hunks)components/bubble/demo/list-custom.tsx(1 hunks)components/bubble/hooks/useTypedEffect.ts(2 hunks)components/bubble/index.en-US.md(2 hunks)components/bubble/index.zh-CN.md(2 hunks)components/bubble/interface.ts(2 hunks)components/prompts/style/index.ts(1 hunks)components/thought-chain/demo/collapsible.tsx(1 hunks)components/use-x-agent/index.en-US.md(1 hunks)components/use-x-agent/index.zh-CN.md(1 hunks)components/use-x-chat/index.ts(1 hunks)docs/playground/copilot.tsx(2 hunks)docs/playground/independent.tsx(4 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (5)
components/prompts/style/index.ts (4)
components/conversations/style/index.ts (1)
ComponentToken(7-7)components/bubble/style/index.ts (1)
ComponentToken(39-39)components/welcome/style/index.ts (1)
ComponentToken(6-6)components/theme/cssinjs-utils.ts (1)
FullToken(22-26)
components/bubble/hooks/useTypedEffect.ts (1)
components/bubble/interface.ts (1)
BubbleContentType(21-21)
components/bubble/Bubble.tsx (1)
components/bubble/interface.ts (1)
BubbleProps(26-45)
components/bubble/demo/debug.tsx (1)
components/bubble/interface.ts (1)
BubbleProps(26-45)
components/bubble/interface.ts (1)
components/_util/type.ts (1)
AnyObject(1-1)
🪛 markdownlint-cli2 (0.17.2)
components/bubble/index.en-US.md
53-53: Table column count
Expected: 5; Actual: 11; Too many cells, extra data will be missing
(MD056, table-column-count)
⏰ Context from checks skipped due to timeout of 90000ms (5)
- GitHub Check: test / react component workflow
- GitHub Check: build preview
- GitHub Check: size
- GitHub Check: Analyze (javascript-typescript)
- GitHub Check: Cloudflare Pages
🔇 Additional comments (38)
components/use-x-chat/index.ts (1)
181-186: 简化条件判断逻辑，保留原有功能
将多行的if分支合并为一行，逻辑等价。已正确判断requestParams是否为含有message属性的对象，不会引入空值或null访问风险。components/use-x-agent/index.en-US.md (1)
60-61: 修复接口声明语法，移除意外的分号
将RequestFnInfo接口的结束分号改为正确的闭合大括号，保持与对应的中文版文档一致。components/prompts/style/index.ts (2)
7-7: 格式调整：清理空接口声明内部空格
ComponentToken空接口声明移除多余空格，与其他组件保持一致。
9-9: 格式调整：清理空接口声明内部空格
PromptsToken接口声明同样移除内部多余空格，保持统一风格。docs/playground/copilot.tsx (2)
352-352: 添加逗号以保持对象属性列表格式一致
在style对象的最后一项marginInline: 16后添加了逗号，提升代码可维护性。
379-382: 修正缩进格式，增强可读性
调整了placeholder函数返回对象的缩进，使多行属性对齐，更易阅读。components/use-x-agent/index.zh-CN.md (1)
63-63: 修复接口声明语法，移除错误的分号
将RequestFnInfo接口定义末尾的};更正为}，与英文版文档保持一致。components/thought-chain/demo/collapsible.tsx (1)
47-47: 代码格式优化 - 删除多余空格和优化缩进这些变更是代码格式的改进，删除了不必要的空行和尾随空格，并调整了括号的缩进，使代码更加整洁。这些更改不影响功能，仅提高了代码的可读性。
Also applies to: 52-52, 58-58
docs/playground/independent.tsx (4)
429-429: 格式化变更 - 引号风格统一将双引号改为单引号，符合项目的代码风格规范。
447-452: JSX元素格式优化将单行的JSX元素重构为多行格式，提高了代码的可读性，特别是对于具有多个属性的组件。
520-523: 属性格式化 - 多行显示将placeholder对象的属性格式化为多行显示，提高了代码的可读性和可维护性。
537-538: 添加尾随逗号在对象字面量的最后一个属性后添加了尾随逗号，这是一种良好的编码实践，可以减少未来添加新属性时的差异，并使版本控制更加清晰。
components/bubble/interface.ts (5)
21-21: 类型定义扩展 - BubbleContentType将
BubbleContentType类型定义扩展为明确包含string和number类型，使其更为完整和明确，增强了类型安全性。
23-25: 新增SlotInfoType类型添加了
SlotInfoType类型，包含可选的key属性，为槽（slot）渲染提供上下文信息，增强了组件的可定制性。
36-36: 泛型参数应用 - content属性将
content属性的类型从固定的BubbleContentType改为泛型ContentType，提高了组件的灵活性和可重用性。
41-41: 新增_key属性添加了可选的
_key属性，类型为number | string，可用于标识和区分不同的气泡组件实例，便于在列表渲染和更新时提高效率。
43-44: 增强header和footer属性的回调函数扩展了
header和footer属性的函数签名，现在除了传递内容外，还可以传递包含键信息的上下文对象，增强了渲染的灵活性和可控性。components/bubble/demo/custom-content.md (1)
1-7: 新增双语示例文档为气泡组件的自定义内容渲染功能添加了中英文示例文档，清晰地说明了该功能的用途，有助于用户理解和使用这一特性。文档简洁明了，内容充分。
CHANGELOG.en-US.md (2)
22-22: 空行格式调整确保一致性将发布日期与版本内容之间添加空行，确保了整个变更日志的格式一致性和可读性。
24-46: 清理了尾随空格，提高了格式一致性这些修改移除了多个条目中的尾随空格，使得整个变更日志的格式更加一致和干净。
components/bubble/hooks/useTypedEffect.ts (1)
3-3: 类型更新以支持更通用的内容类型将
content参数的类型从特定类型更新为BubbleContentType，使得钩子函数能够处理更多类型的内容，与Bubble组件的类型泛化一致。Also applies to: 14-14
components/bubble/demo/debug.tsx (1)
55-58: 更新类型注解以匹配泛型参数要求将
bubbleDict的类型从Record<..., BubbleProps>更新为Record<..., BubbleProps<any>>，以适应BubbleProps接口的泛型更新。不过，考虑在实际应用中使用更精确的类型而不是
any，以获得更好的类型安全性。虽然在示例中使用any是可以接受的，但在实际代码中应避免。components/bubble/BubbleList.tsx (2)
22-25: 更新 BubbleDataType 类型以支持泛型内容将
BubbleDataType从BubbleProps更新为BubbleProps<any>，与Bubble组件的类型泛化保持一致。
27-27: 更新 RoleType 类型以支持泛型内容将
RoleType从Partial<Omit<BubbleProps, 'content'>>更新为Partial<Omit<BubbleProps<any>, 'content'>>，与BubbleProps泛型更新保持一致。components/bubble/demo/header-and-footer.tsx (2)
3-3: 添加 message 导入以支持复制反馈从 'antd' 中导入 message 组件，用于提供复制操作的用户反馈。
28-28: 更新复制按钮处理函数将复制按钮的
onClick处理函数更新为调用onCopy函数，实现更完整的交互体验。components/bubble/Bubble.tsx (1)
169-170: 复用renderSlot👍，但可考虑错误兜底当前如果传入的
header/footer为函数且内部抛出异常，会导致整个气泡渲染失败。可以在这里包一层try … catch，并在开发环境下输出警告，保障组件健壮性。Also applies to: 185-186
components/bubble/index.en-US.md (5)
26-27: 示例列表已更新
文档示例部分已新增Custom rendering content和Rendering markdown content两个演示，路径和展示文本与对应的 demo 文件保持一致。
31-31: 语义化自定义示例名称更新
已将旧有 “Semantic Custom” 演示替换为Semantic custom list content，并更新到正确的semantic-list-custom.tsx文件，名称和路径均已同步。
43-50: API 属性类型更新
content、footer和header属性类型已由原有的BubbleContentType泛化为ContentType，并新增(content, info)函数签名以支持传入 slot 信息。avatar与classNames也同步补充了版本列。
60-66: 新增 ContentType 类型定义
文档中已新增ContentType小节，清晰展示了默认类型React.ReactNode \| AnyObject \| string \| number。
68-76: 新增自定义内容类型用法示例
通过示例代码展示了如何使用泛型传入自定义内容类型，帮助开发者快速上手。components/bubble/index.zh-CN.md (6)
27-28: 示例列表已更新
已新增自定义渲染内容和渲染 markdown 内容的演示，名称与路径与对应 demo 文件保持一致。
32-32: 语义化自定义示例名称更新
已将 “bubble-custom.tsx” 演示替换为semantic-list-custom.tsx，并更新展示文案为“语义化自定义”。
49-51: API 属性类型更新
content、footer与header属性类型已由原有类型泛化为ContentType，并支持(content, info)函数签名返回节点，增强渲染灵活性。
59-59: 简化 messageRender 签名
messageRender已由泛型函数简化为接受ContentType的非泛函数签名，文档示例已同步更新。
62-68: 新增 ContentType 类型定义
已新增ContentType小节，说明默认类型为React.ReactNode \| AnyObject \| string \| number，增强文档可读性。
70-78: 新增自定义类型使用示例
示例中展示了如何声明自定义类型并通过泛型传入Bubble组件的用法，便于开发者参考。
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #843 +/- ##
==========================================
+ Coverage 92.36% 92.42% +0.05%
==========================================
Files 66 66
Lines 1494 1504 +10
Branches 388 385 -3
==========================================
+ Hits 1380 1390 +10
Misses 114 114 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
chore: sync feature to main branch
sync feature to main branch
Summary by CodeRabbit
新功能
文档
样式与格式优化
重构
修复