Conversation
|
Note Other AI code review bot(s) detectedCodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review. 📝 WalkthroughWalkthrough升级依赖以兼容 antd v6，替换若干内部/第三方库（如 classnames→clsx、rc-→@rc-component/、TinyColor→FastColor），删除内部工具 Changes
Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 分钟
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing touches🧪 Generate unit tests (beta)
📜 Recent review detailsConfiguration used: CodeRabbit UI Review profile: CHILL Plan: Pro 📒 Files selected for processing (1)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
🔇 Additional comments (4)
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. Comment |
Summary of ChangesHello @li-jia-nan, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! This pull request focuses on a significant upgrade to ensure compatibility with Ant Design 6. It involves updating core dependencies to their latest versions within the Highlights
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request updates the project to support Ant Design v6. The changes primarily involve updating dependencies in package.json, including replacing rc-motion and rc-util with their new scoped packages @rc-component/motion and @rc-component/util, and classnames with clsx. The code has been updated to use the new dependencies, and a custom unstableRender utility has been removed in favor of the render function from @rc-component/util.
My main feedback is regarding how antd is handled as a dependency. For a theme library like this, it should be a peerDependency rather than a direct dependency to avoid version conflicts in consumer applications. I have provided specific suggestions to adjust package.json accordingly.
There was a problem hiding this comment.
Pull request overview
This PR upgrades the project to support Ant Design 6 by updating dependencies from the legacy rc-* packages to the newer @rc-component/* scoped packages, replacing classnames with clsx, and removing the custom unstable-render utility that was needed for antd 5 compatibility. The changes modernize the codebase to align with antd 6's dependency ecosystem while simplifying the rendering logic.
Key changes:
- Migrated from
rc-util,rc-motion, andclassnamesto@rc-component/util,@rc-component/motion, andclsx - Removed custom
unstable-renderutility and its associated version-specific workarounds for antd 5 - Refactored
HappyProviderto useReact.FC<React.PropsWithChildren<>>pattern and simplified render/unmount calls
Reviewed changes
Copilot reviewed 6 out of 7 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| package.json | Updated dependencies to antd 6 ecosystem (@rc-component packages, clsx), moved antd from peerDependencies to dependencies |
| src/HappyProvider.tsx | Refactored to use direct render/unmount from @rc-component/util, updated to React.FC pattern with PropsWithChildren |
| src/DotEffect/index.tsx | Migrated from classnames to clsx and updated motion/util imports to @rc-component packages |
| src/_utils/unstable-render.tsx | Removed (no longer needed with antd 6) |
| tests/unstable-render.test.tsx | Removed (tests for deleted utility) |
| tests/index.test.tsx | Updated import from rc-util to @rc-component/util |
| .gitignore | Added pnpm-lock.yaml to ignored files |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (7)
.gitignore(1 hunks)package.json(1 hunks)src/DotEffect/index.tsx(4 hunks)src/HappyProvider.tsx(4 hunks)src/_utils/unstable-render.tsx(0 hunks)tests/index.test.tsx(1 hunks)tests/unstable-render.test.tsx(0 hunks)
💤 Files with no reviewable changes (2)
- tests/unstable-render.test.tsx
- src/_utils/unstable-render.tsx
🧰 Additional context used
🧬 Code graph analysis (1)
src/HappyProvider.tsx (2)
src/index.tsx (1)
HappyProvider(3-3)src/DotEffect/index.tsx (1)
DotEffect(42-252)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: Agent
- GitHub Check: Socket Security: Pull Request Alerts
- GitHub Check: setup
🔇 Additional comments (11)
.gitignore (1)
30-30: LGTM!添加 pnpm-lock.yaml 到忽略列表符合最佳实践，与项目的依赖迁移保持一致。
src/DotEffect/index.tsx (3)
3-5: LGTM! 依赖迁移正确。已正确将依赖从旧的 rc-* 包迁移到新的 @rc-component/* 包：
classnames→clsx（更轻量的替代方案）rc-motion→@rc-component/motionrc-util/lib/raf→@rc-component/util/lib/raf
203-203: LGTM! clsx 使用正确。正确使用
clsx替换了原来的classNames来组合 CSS 类名。
225-225: LGTM! clsx 使用正确。正确使用
clsx来组合动画类名。src/HappyProvider.tsx (5)
2-2: LGTM! 导入路径更新正确。
useEvent的导入路径已从rc-util更新为@rc-component/util，与整体迁移保持一致。
5-5: LGTM! 渲染工具导入更新正确。从
@rc-component/util/lib/React/render导入render和unmount，替换了之前的unstableRender，这是一个更稳定的 API。
17-19: LGTM! 组件类型定义重构合理。将组件重构为
React.FC<React.PropsWithChildren<HappyProviderProps>>是现代 React 的推荐做法，PropsWithChildren自动提供children类型，无需在 props 接口中显式声明。
32-44: LGTM! 新的 render/unmount API 使用正确。正确使用了新的
render和unmountAPI：
render(element, holder)替代了之前的unstableRenderunmount(holder)返回 Promise，正确使用.then()等待卸载完成后再移除 holder 元素- 这种方式确保了清理操作的正确顺序，避免了潜在的内存泄漏
58-60: LGTM! 导出模式更新正确。导出模式从函数声明改为先定义常量再默认导出，与 React.FC 模式配合良好，保持了公共 API 的一致性。
package.json (2)
42-45: The review comment is based on incorrect information about the code state.The actual package.json at lines 42-45 contains
@rc-component/motion,@rc-component/util, andclsx—notantd. The antd package is listed indevDependencies(line 54), not in thedependenciessection. Additionally, antd is not present inpeerDependenciesand has never been moved from peerDependency to dependency based on the current file state.The architectural concerns about breaking changes and version conflicts are based on a false premise about what changed in the code. Please verify the actual changes being reviewed.
Likely an incorrect or invalid review comment.
52-52: Remove@types/nodefrom devDependencies — it is not needed for this React component library.This is a browser-based React component library with no Node.js runtime dependencies. The source code in
src/contains no usage of Node.js types, the build tools (dumi, father) and testing framework (rc-test) do not require@types/node, and it is not currently installed. Configuration files like.dumirc.tsimport Node.js modules, but TypeScript resolves these without needing the types package in this project setup. This dependency should be removed.Likely an incorrect or invalid review comment.
li-jia-nan
requested review from
Wxh16144,
afc163,
Copilot,
yoyo837 and
zombieJ
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 6 out of 7 changed files in this pull request and generated 1 comment.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
src/HappyProvider.tsx(3 hunks)
🧰 Additional context used
🧬 Code graph analysis (1)
src/HappyProvider.tsx (2)
src/index.tsx (1)
HappyProvider(3-3)src/DotEffect/index.tsx (1)
DotEffect(42-252)
🔇 Additional comments (4)
src/HappyProvider.tsx (4)
17-19: 很好的重构！将组件重构为
React.FC<React.PropsWithChildren<HappyProviderProps>>是符合 React 18 最佳实践的做法，children 现在通过 PropsWithChildren 隐式提供，提高了类型安全性。
47-52: 通过 memoization 优化性能。引入
React.useMemo避免不必要的 wave 配置重建。依赖数组[disabled]是正确的，因为showEffect通过useEvent创建，保证了引用稳定性。
54-57: LGTM！返回语句正确使用了
memoizedWaveConfig，导出方式符合重构后的组件定义。
32-32: Migrate fromunstableRenderto stablerenderAPI.Updated to use the stable
renderAPI from@rc-component/util/lib/React/render. The Promise-based cleanup is correct—unmount(holder)returns a Promise, allowing proper async sequencing: component is unmounted first, then the DOM node is removed.
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (2)
docs/examples/theme.tsx (2)
23-29: 抽离容器样式为常量，结构更清晰将外层容器样式提取成
style常量提升了复用性和可读性，类型上用React.CSSProperties也没问题。可以视情况考虑改名为wrapperStyle或类似更语义化的名字，但不是必须。
76-83: Tag 示例更贴近日常用法，但可以避免空的 onClick为
Tag增加variant="outlined"、color="blue"和userSelect: 'none'能更好展示交互样式，这里设计上 OK。唯一小建议是当前onClick={() => {}}是空实现，如果没有真正交互需求，可以删除onClick，或简单console.log一下点击事件，否则有可能被某些 ESLint 规则视为无意义空函数。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
docs/examples/theme.tsx(4 hunks)src/DotEffect/style.ts(3 hunks)
🔇 Additional comments (7)
src/DotEffect/style.ts (4)
56-60: 代码重构良好！将
sharedConfig提取为公共配置对象是一个很好的 DRY 改进，减少了代码重复，提高了可维护性。
82-82: 确认 zIndex 大幅提升的必要性。
zIndex从999提升到999999是一个较大的变化。这可能是为了确保点击波纹效果能够显示在 Modal、Drawer 等高层级组件之上（它们通常使用 1000+ 的 z-index）。请确认这是为了适配 antd 6 的需要，且不会与其他使用超高 z-index 的组件产生冲突。
Also applies to: 92-92
89-89: 性能优化良好！使用
translate3d代替translate可以触发 GPU 硬件加速，这对于动画效果的流畅度有明显提升。
108-110: 导出方式调整合理。将函数赋值给命名常量后再导出，便于调试时在堆栈跟踪中看到函数名称，同时保持了公共接口不变。
docs/examples/theme.tsx (3)
3-13: 导入version展示 antd 版本信息是合理的用法这里仅用于在示例中展示当前 antd 版本，没有引入额外逻辑复杂度，看起来没问题。
31-36: 将 Demo 显式声明为React.FC有利于类型检查把
Demo声明为React.FC可以让返回 JSX 的意图更明确，也有助于 TS 推断 children 等类型，这里改动是正向的。
52-53:ConfigProvider包裹 + 抽离样式的写法更简洁
ConfigProvider theme={{ token }}配合外层<div style={style}>让 JSX 层级更清晰，也避免在 JSX 中出现大块内联样式，整体结构不错。
Co-authored-by: Amumu <yoyo837@hotmail.com>
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub.
|
Summary by CodeRabbit
发布说明
✏️ Tip: You can customize this high-level summary in your review settings.