-
-
Notifications
You must be signed in to change notification settings - Fork 940
refactor: migrate rc-* to @rc-component/* and classnames to clsx #1448
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
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将项目中大量文件的类名合并工具从 Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25–30 分钟
Poem
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
📜 Recent review detailsConfiguration used: CodeRabbit UI Review profile: CHILL Plan: Pro 📒 Files selected for processing (1)
🧰 Additional context used🧠 Learnings (1)📓 Common learnings⏰ 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)
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 |
|
Waiting |
Summary of ChangesHello @yoyo837, 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 primarily focuses on a significant refactoring effort to modernize the project's dependency management. By migrating from legacy 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
|
|
All alerts resolved. Learn more about Socket for GitHub. This PR previously contained dependency changes with security issues that have been resolved, removed, or ignored. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Code Review
This pull request is a large refactoring effort to migrate rc-* dependencies to @rc-component/* and replace classnames with clsx for bundle size optimization. The changes are extensive and mostly correct. However, I've identified a few issues that need attention. There's a critical inconsistency where the classNames prop was renamed to clsx in type definitions and documentation but not in the component implementations, which will break the API for TypeScript users. Additionally, there's an incorrect type import that will likely cause a build failure. I've also pointed out several instances of redundant clsx usage that could be simplified for better readability and minor performance gains.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 6
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
packages/x/components/actions/ActionsFeedback.tsx (1)
131-139:disliked语义 class 条件疑似写错,导致样式状态不生效这里的条件目前是:
[`${classNames.disliked}`]: classNames.disliked && value === 'like',而对应的样式判断是:
style={{ ...styles.dislike, ...(value === 'dislike' ? styles.disliked : {}) }}可以看出语义上「已点踩」状态应该在
value === 'dislike'时生效;现在写成value === 'like',会导致classNames.disliked永远不会在点踩激活时被应用(如果这是从旧代码沿袭下来的,那是一个沿用的 bug,正好可以趁本次重构一并修掉)。建议改为:
- [`${classNames.disliked}`]: classNames.disliked && value === 'like', + [`${classNames.disliked}`]: classNames.disliked && value === 'dislike',这样与
styles.disliked以及-dislike-active的逻辑就一致了。packages/x/components/bubble/interface.ts (1)
204-228: 严重错误:RoleProps类型中'clsx'应为'classNames'。
BubbleProps接口包含classNames属性,Pick应引用'classNames'而非'clsx'。当前写法会导致 TypeScript 错误,因为BubbleProps中不存在clsx属性。export type RoleProps = Pick< BubbleProps<any>, | 'typing' | 'variant' | 'shape' | 'placement' | 'rootClassName' - | 'clsx' + | 'classNames' | 'className' | 'styles' | 'style'
🧹 Nitpick comments (9)
packages/x/.dumi/theme/builtins/Previewer/CodePreviewer.tsx (1)
292-301: Codesandbox 依赖迁移到 @rc-component/util,建议确保有安全兜底在 codesandbox 的
package.json里显式增加@rc-component/util依赖,方向上和 PR 目标(从 rc-* 迁移到 @rc-component/*)一致。不过这里直接读取pkgDependencyList['@rc-component/util'],如果站点配置缺这个 key,会传入undefined:'@rc-component/util': pkgDependencyList['@rc-component/util'],建议至少确认站点侧已同步配置该依赖;如果希望更健壮,可以考虑加一个版本兜底,例如:
- '@rc-component/util': pkgDependencyList['@rc-component/util'], + '@rc-component/util': pkgDependencyList['@rc-component/util'] ?? 'latest',以避免预览环境在配置缺失时安装失败。
packages/x/components/actions/ActionsFeedback.tsx (1)
110-119: like 图标的 clsx 使用正确,可考虑略微简化写法(可选)当前逻辑在
value === 'like'时同时应用语义类classNames.liked和状态类${feedbackCls}-item-like-active,与上方style中styles.liked的判断保持一致,行为是合理的。如果想让写法更贴近
clsx的常用风格,可以(非必需)改成类似:- className={clsx( - `${feedbackCls}-item`, - `${prefixCls}-item`, - `${feedbackCls}-item-like`, - classNames.like, - { - [`${classNames.liked}`]: classNames.liked && value === 'like', - [`${feedbackCls}-item-like-active`]: value === 'like', - }, - )} + className={clsx( + `${feedbackCls}-item`, + `${prefixCls}-item`, + `${feedbackCls}-item-like`, + classNames.like, + value === 'like' && classNames.liked, + value === 'like' && `${feedbackCls}-item-like-active`, + )}纯属风格优化,可酌情考虑。
packages/x/components/bubble/index.en-US.md (1)
190-190: 文档中 RoleProps 的clsx字段建议补充迁移说明这里将
RoleProps中透出的字段由classNames重命名为clsx,与实现保持一致没有问题。不过这相当于对 BubbleProps 公共 API 的重命名,建议在本节或 changelog 里显式注明「由classNames重命名为clsx」以及是否仍兼容旧字段,方便使用者完成迁移并感知潜在的 breaking。packages/x/.dumi/hooks/useMenu.tsx (1)
5-5: useMenu 中 clsx 迁移保持菜单渲染不变
Link上的className={clsx(className, { [styles.link]: tag })}与原来的条件 class 合并逻辑一致,仅在存在tag时附加布局样式。Tag上的className={clsx(styles.tag)}当前等价于直接传styles.tag,保留 clsx 主要是与全局写法保持一致,可以按现状保留;如果后续没有再追加其他类名,也可以在整理时顺手精简掉。整体来看,该文件的变更是等价迁移。
Also applies to: 64-64, 70-70
packages/x/.dumi/pages/index/components/DesignGuide.tsx (1)
3-3: 类名工具迁移正确。从
classnames迁移到clsx实现正确。Line 227 的
clsx(styles.chain_item_icon)只包含单个参数,可以直接使用styles.chain_item_icon而无需包装:- <div className={clsx(styles.chain_item_icon)}> + <div className={styles.chain_item_icon}>Also applies to: 227-227
packages/x/components/welcome/index.tsx (1)
60-77: useMemo 依赖项可能不完整,classNames / styles 变化时不会重新计算
iconNode/titleNode/extraNode的useMemo目前只依赖icon/title/extra,但内部还闭包了prefixCls、contextConfig.classNames.*、classNames.*、styles.*。如果这些值在运行期发生变化而对应的内容(如icon)不变,节点不会重新计算,类名和样式会“卡住”。可以考虑:
- 要么把这些依赖补齐进依赖数组;
- 要么直接去掉这些
useMemo,让渲染逻辑保持简单。这一点属于行为边缘情况,但现在改 clsx 正好是个顺手收紧依赖的机会。
Also applies to: 79-93, 95-108
packages/x/components/file-card/components/ImageLoading.tsx (1)
3-4: ImageLoading 中使用 clsx 组合类名的方式正确,可考虑是否需要透传 mergeSinkProps
- 外层容器、Skeleton.Node 和内部 Flex 上对
clsx的使用都只是在原有类名基础上做简单拼接/条件追加,行为与之前classnames等价。- 目前
mergeSinkProps只用于决定类名和额外图标/文字,但<Spin>实际上传入的是percent={mergedPercent} {...(spinProps as SpinProps)}。如果你的期望是把size、icon等默认属性也传给 antd 的Spin组件,可以考虑改为使用mergeSinkProps进行展开。如果当前视觉和交互都符合预期,这部分可以保留现状;否则可以顺手调整以避免配置分散。
Also applies to: 26-32
packages/x/.dumi/theme/slots/ContentTabs/index.tsx (1)
2-2: TabsProps 类型从 rc-tabs 迁移到 @rc-component/table 建议再核实一次这里运行时代码仍使用 antd 的
<Tabs>,但类型却改为从@rc-component/table引入TabsProps,包名与类型名(table vs tabs)有些不对称:
- 如果
@rc-component/table确实导出了与 antd Tabs 完全一致的TabsProps,则当前写法没问题;- 否则会引入 TS 类型错误或误导性的类型定义。
建议:要么确认依赖文档确保该类型正确来源,要么考虑直接基于 antd 的 Tabs 组件推断类型(例如通过
Parameters<typeof Tabs>[0]['items']之类方式)以降低对底层 rc/@rc-component 包的耦合。packages/x/components/thought-chain/Node.tsx (1)
2-5: Node 组件中 motion 与 clsx 迁移基本保持原有行为,仅有轻微风格问题CSSMotion 与 pickAttrs 切换到
@rc-component版本后,collapseMotion 的使用方式和展开/折叠逻辑未改变;icon、header、content、footer 等处的className均改为用clsx构造,包含 line 派生类、可折叠状态和 blink 动画类,整体语义与之前的classnames一致,预期不会影响渲染或交互。个别只包含一个常量类名的地方(例如${nodeCls}-box)使用clsx有些多余,但纯属风格问题,不影响运行。如前几个文件所述,也请一并确认import { clsx } from 'clsx';的导入方式与当前依赖版本和打包配置兼容。Also applies to: 56-57, 62-63, 65-68, 75-77, 79-82, 107-108, 112-113, 124-125
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (107)
package.json(2 hunks)packages/x-markdown/package.json(2 hunks)packages/x-markdown/src/XMarkdown/index.tsx(2 hunks)packages/x-markdown/src/plugins/HighlightCode/index.tsx(4 hunks)packages/x-markdown/src/plugins/Mermaid/index.tsx(5 hunks)packages/x-markdown/tests/setup.ts(1 hunks)packages/x-markdown/tests/setupAfterEnv.ts(1 hunks)packages/x-sdk/src/x-chat/index.ts(1 hunks)packages/x-sdk/tests/setup.ts(1 hunks)packages/x-sdk/tests/utils.tsx(1 hunks)packages/x/.dumi/components/SemanticPreview.tsx(4 hunks)packages/x/.dumi/hooks/useMenu.tsx(2 hunks)packages/x/.dumi/hooks/useThemeAnimation.ts(1 hunks)packages/x/.dumi/pages/index/common/Container.tsx(2 hunks)packages/x/.dumi/pages/index/components/DesignGuide.tsx(2 hunks)packages/x/.dumi/pages/index/components/MainBanner.tsx(3 hunks)packages/x/.dumi/pages/index/components/SceneIntroduction/index.tsx(2 hunks)packages/x/.dumi/pages/index/index.tsx(2 hunks)packages/x/.dumi/theme/builtins/IconSearch/CopyableIcon.tsx(2 hunks)packages/x/.dumi/theme/builtins/ImagePreview/index.tsx(3 hunks)packages/x/.dumi/theme/builtins/InstallDependencies/bun.tsx(2 hunks)packages/x/.dumi/theme/builtins/InstallDependencies/index.tsx(1 hunks)packages/x/.dumi/theme/builtins/InstallDependencies/npm.tsx(2 hunks)packages/x/.dumi/theme/builtins/InstallDependencies/pnpm.tsx(2 hunks)packages/x/.dumi/theme/builtins/InstallDependencies/utoo.tsx(2 hunks)packages/x/.dumi/theme/builtins/InstallDependencies/yarn.tsx(2 hunks)packages/x/.dumi/theme/builtins/MarkdownPluginsOverView.tsx(2 hunks)packages/x/.dumi/theme/builtins/Previewer/CodePreviewer.tsx(3 hunks)packages/x/.dumi/theme/builtins/TokenCompare/index.tsx(2 hunks)packages/x/.dumi/theme/builtins/VideoPlayer/index.tsx(2 hunks)packages/x/.dumi/theme/common/Color/ColorPalettes.tsx(2 hunks)packages/x/.dumi/theme/common/PrevAndNext.tsx(3 hunks)packages/x/.dumi/theme/common/styles/Common.tsx(1 hunks)packages/x/.dumi/theme/layouts/DocLayout/index.tsx(2 hunks)packages/x/.dumi/theme/slots/Content/ColumnCard.tsx(4 hunks)packages/x/.dumi/theme/slots/Content/Contributors.tsx(2 hunks)packages/x/.dumi/theme/slots/Content/DocAnchor.tsx(2 hunks)packages/x/.dumi/theme/slots/Content/index.tsx(2 hunks)packages/x/.dumi/theme/slots/ContentTabs/index.tsx(1 hunks)packages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsx(1 hunks)packages/x/.dumi/theme/slots/Header/Actions.tsx(2 hunks)packages/x/.dumi/theme/slots/Header/Logo.tsx(2 hunks)packages/x/.dumi/theme/slots/Header/Navigation.tsx(2 hunks)packages/x/.dumi/theme/slots/Header/SwitchBtn.tsx(2 hunks)packages/x/.dumi/theme/slots/Header/index.tsx(2 hunks)packages/x/.dumi/theme/slots/Sidebar/index.tsx(1 hunks)packages/x/components/_util/hooks/use-collapsible.ts(1 hunks)packages/x/components/_util/hooks/use-shortcut-keys.ts(1 hunks)packages/x/components/_util/motion.ts(1 hunks)packages/x/components/_util/warning.ts(1 hunks)packages/x/components/actions/ActionsAudio.tsx(2 hunks)packages/x/components/actions/ActionsCopy.tsx(2 hunks)packages/x/components/actions/ActionsFeedback.tsx(4 hunks)packages/x/components/actions/ActionsItem.tsx(2 hunks)packages/x/components/actions/ActionsMenu.tsx(2 hunks)packages/x/components/actions/Item.tsx(2 hunks)packages/x/components/actions/context.ts(1 hunks)packages/x/components/actions/index.tsx(4 hunks)packages/x/components/attachments/DropArea.tsx(2 hunks)packages/x/components/attachments/FileList/index.tsx(4 hunks)packages/x/components/attachments/PlaceholderUploader.tsx(2 hunks)packages/x/components/attachments/index.tsx(6 hunks)packages/x/components/bubble/Bubble.tsx(6 hunks)packages/x/components/bubble/BubbleList.tsx(3 hunks)packages/x/components/bubble/Divider.tsx(2 hunks)packages/x/components/bubble/EditableContent.tsx(1 hunks)packages/x/components/bubble/System.tsx(2 hunks)packages/x/components/bubble/TypingContent.tsx(2 hunks)packages/x/components/bubble/hooks/useTyping.ts(1 hunks)packages/x/components/bubble/index.en-US.md(1 hunks)packages/x/components/bubble/index.zh-CN.md(1 hunks)packages/x/components/bubble/interface.ts(2 hunks)packages/x/components/conversations/Creation.tsx(2 hunks)packages/x/components/conversations/GroupTitle.tsx(3 hunks)packages/x/components/conversations/Item.tsx(2 hunks)packages/x/components/conversations/__tests__/index.test.tsx(1 hunks)packages/x/components/conversations/demo/shortcutKeys.tsx(1 hunks)packages/x/components/conversations/hooks/useCreation.tsx(2 hunks)packages/x/components/conversations/index.tsx(5 hunks)packages/x/components/file-card/FileCard.tsx(5 hunks)packages/x/components/file-card/List.tsx(3 hunks)packages/x/components/file-card/components/File.tsx(3 hunks)packages/x/components/file-card/components/ImageLoading.tsx(2 hunks)packages/x/components/prompts/index.tsx(6 hunks)packages/x/components/sender/SenderHeader.tsx(4 hunks)packages/x/components/sender/SenderSwitch.tsx(3 hunks)packages/x/components/sender/SlotTextArea.tsx(3 hunks)packages/x/components/sender/TextArea.tsx(2 hunks)packages/x/components/sender/components/ActionButton.tsx(2 hunks)packages/x/components/sender/components/LoadingButton.tsx(2 hunks)packages/x/components/sender/index.tsx(5 hunks)packages/x/components/sender/useSpeech.ts(1 hunks)packages/x/components/sources/Sources.tsx(6 hunks)packages/x/components/sources/components/CarouselCard.tsx(3 hunks)packages/x/components/suggestion/index.tsx(2 hunks)packages/x/components/suggestion/useActive.ts(1 hunks)packages/x/components/think/Think.tsx(4 hunks)packages/x/components/thought-chain/Item.tsx(4 hunks)packages/x/components/thought-chain/Node.tsx(6 hunks)packages/x/components/thought-chain/Status.tsx(2 hunks)packages/x/components/thought-chain/index.tsx(4 hunks)packages/x/components/welcome/index.tsx(6 hunks)packages/x/docs/playground/ultramodern.tsx(2 hunks)packages/x/package.json(4 hunks)packages/x/scripts/generate-component-changelog.ts(1 hunks)packages/x/tests/__mocks__/@rc-component/virtual-list.ts(1 hunks)packages/x/tests/__mocks__/rc-virtual-list.ts(0 hunks)
⛔ Files not processed due to max files limit (4)
- packages/x/tests/setup.ts
- packages/x/tests/setupAfterEnv.ts
- packages/x/tests/utils.tsx
- packages/x/typings/custom-typings.d.ts
💤 Files with no reviewable changes (1)
- packages/x/tests/mocks/rc-virtual-list.ts
🧰 Additional context used
🧠 Learnings (2)
📚 Learning: 2025-01-27T09:36:11.490Z
Learnt from: YumoImer
Repo: ant-design/x PR: 479
File: components/bubble/demo/debug-list.tsx:39-57
Timestamp: 2025-01-27T09:36:11.490Z
Learning: In the Bubble.List debug demo component, the different typing behavior between pushBubble (sets typing: true) and unshiftBubble (no typing property) operations is intentional to facilitate testing different scenarios.
Applied to files:
packages/x/components/bubble/TypingContent.tsxpackages/x/components/bubble/interface.ts
📚 Learning: 2024-11-23T15:50:20.802Z
Learnt from: YumoImer
Repo: ant-design/x PR: 223
File: package.json:224-224
Timestamp: 2024-11-23T15:50:20.802Z
Learning: `rc-drawer` 依赖在 `.dumi/theme/layouts/SidebarLayout` 文件中被使用,是项目中的必要依赖,今后不应建议移除。
Applied to files:
packages/x/.dumi/theme/builtins/InstallDependencies/index.tsxpackages/x/.dumi/theme/slots/Sidebar/index.tsxpackages/x/.dumi/hooks/useThemeAnimation.tspackages/x/.dumi/theme/layouts/DocLayout/index.tsxpackages/x/.dumi/theme/slots/Header/Navigation.tsxpackages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsxpackages/x/.dumi/theme/slots/Header/index.tsxpackages/x/.dumi/hooks/useMenu.tsxpackages/x/scripts/generate-component-changelog.tspackages/x/.dumi/theme/slots/Content/index.tsxpackages/x/package.jsonpackages/x/.dumi/theme/common/styles/Common.tsx
🧬 Code graph analysis (3)
packages/x/components/actions/context.ts (1)
packages/x/components/actions/interface.ts (1)
ActionsProps(6-65)
packages/x/components/thought-chain/Node.tsx (1)
packages/x/components/thought-chain/interface.ts (1)
ThoughtChainProps(66-114)
packages/x/components/bubble/interface.ts (3)
packages/x/components/index.ts (2)
BubbleItemType(7-7)BubbleProps(7-7)packages/x/components/bubble/index.tsx (2)
BubbleItemType(7-7)BubbleProps(10-10)packages/x/components/bubble/Bubble.tsx (1)
BubbleProps(273-273)
⏰ 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). (2)
- GitHub Check: size
- GitHub Check: WIP
🔇 Additional comments (123)
packages/x-markdown/tests/setup.ts (1)
43-43: 注释更新准确反映依赖迁移。注释已正确更新,从
rc-motion改为@rc-component/motion,与 PR 的依赖迁移目标保持一致。packages/x/.dumi/theme/builtins/InstallDependencies/bun.tsx (2)
2-2: 导入语句正确!从
classnames迁移到clsx的导入语句符合PR重构目标。clsx是一个更轻量级的替代方案,能够有效减少包体积。
24-24: 类名合并迁移正确!
clsx在此场景下的行为与classNames完全一致,能够正确处理两个参数的合并(其中className可能为undefined)。功能保持不变,符合预期。packages/x/.dumi/theme/slots/Header/SwitchBtn.tsx (2)
1-4: 导入迁移到 @rc-component/util 与 clsx 与本次重构目标一致omit 的来源切换到
@rc-component/util/lib/omit,以及改用clsx,都与本次依赖迁移方向统一,当前看不到行为或打包层面的风险;只需确保仓库中@rc-component/util与clsx的版本在各包内保持一致即可。
87-90: span 的 className 组合逻辑保持清晰且不改变行为两处
span都通过value === 1在两组样式间切换,并在每次调用中始终包含labelStyle,仅切换叠加的样式类,阅读性好且应与原有视觉行为一致,无需额外调整。packages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsx (1)
1-1: Import path changed fromrc-util/lib/Dom/dynamicCSSto@rc-component/util/lib/Dom/dynamicCSS.Ensure
removeCSSandupdateCSSmaintain API compatibility with the new package. Verify that the behavior of these functions remains consistent, particularly in how they interact with the DOM manipulation at the call sites (lines 66, 73, 80).packages/x/components/_util/hooks/use-collapsible.ts (1)
1-2: Verify package dependencies and import migration consistencyThe import changes migrate from
rc-motionto@rc-component/motionand fromrc-util/lib/hooks/useMergedStateto@rc-component/util/lib/hooks/useMergedState. Before merging, confirm:
package.jsonincludes@rc-component/motionand@rc-component/utilas dependencies- All other files in the codebase using
rc-motionorrc-utilhave been updated similarly- The new packages provide identical APIs to their predecessors
packages/x/.dumi/theme/builtins/ImagePreview/index.tsx (2)
83-86: LGTM! 迁移到 clsx 的实现正确。
clsx和classNames在这些用例中的 API 完全兼容。字符串参数和条件对象的组合方式正确,功能保持不变。Also applies to: 107-110
1-3: Verify package dependency migration in package.json.The import path migration from
rc-utilto@rc-component/utiland fromclassnamestoclsxaligns with the PR objectives. Before approving, confirm that:
@rc-component/utilandclsxare added to package.json dependenciesrc-utilandclassnamesare removed from package.json dependencies- The import paths for toArray (
@rc-component/util/lib/Children/toArray) and clsx are correctpackages/x/components/_util/motion.ts (1)
1-6: 类型导入迁移看起来正确且无运行时影响这里将
rc-motion的类型导入迁移到@rc-component/motion,并且使用了import type,不会引入额外运行时代码,符合本 PR 的体积优化目标;MotionEvent也从对应的@rc-component/motion/lib/interface获取,和既有用法保持一致。整体改动是纯类型层面的,无行为变化风险。packages/x/components/actions/ActionsAudio.tsx (2)
2-2: LGTM! clsx 导入语句正确从
classnames迁移到clsx的导入语句正确。clsx是classnames的轻量级替代品,符合 PR 减小包体积的目标。
51-54: Unable to complete verification. The filepackages/x/components/actions/ActionsAudio.tsxcould not be located in the repository. Please confirm the file path is correct and ensure the file is committed and discoverable.packages/x/components/suggestion/useActive.ts (1)
1-1: Import migration to@rc-component/utilis compatible.The
useEventhook API is identical in bothrc-utiland@rc-component/util:useEvent<T extends Function>(callback: T) => Treturns a stable callback. This migration aligns with the PR's broader rc-component ecosystem consolidation and introduces no breaking changes.packages/x/components/actions/ActionsCopy.tsx (2)
1-1: 迁移 pickAttrs 到 @rc-component/util 与 PR 目标一致从 rc-util 切到
@rc-component/util/lib/pickAttrs有助于统一依赖、减少重复打包,看起来是无行为差异的替换;请确认相关依赖已在 package.json 中同步升级且构建通过即可。
3-3: 使用 clsx 合并类名的方式正确,行为与原先 classnames 一致
clsx的调用方式与之前的classnames模式相同,copyCls、hashId、cssVarCls、rootClassName、className以及 RTL 条件类都被保留,类名顺序与结构清晰,没有引入行为变化,满足迁移到 clsx 的需求。Also applies to: 62-72
packages/x/.dumi/pages/index/components/SceneIntroduction/index.tsx (1)
231-235: 使用模式正确!
clsx的使用方式与classnames完全一致,条件样式类的逻辑保持不变。假设导入语法正确,此变更可以有效减少包体积。packages/x/components/attachments/FileList/index.tsx (5)
104-106: 使用clsx合并局部 className 语义正确这里将文件/描述的类名合并逻辑替换为
clsx,参数顺序与原实现一致,保留了状态前缀 + 可选外部类名的语义,没有引入行为变化,看起来是安全的迁移。
133-133: 根节点className使用clsx保持原有合并逻辑
clsx(\${prefixCls}-list`, className)` 仍然是「基础前缀类 + 可选自定义类」的模式,迁移不改变行为,没问题。
135-140: 各 slot 的classNames合并顺序合理,保持与上下文配置兼容这里统一用
clsx合并classNames.*与contextClassNames.*,参数顺序保持「组件传入优先,其次是 context」,与原先模式一致,没有明显行为变化,迁移良好。
158-158: 上传按钮className使用clsx合并三方类名实现合理
clsx(classNames.upload, contextClassNames.upload, \${listCls}-upload-btn`)` 同时兼顾组件自定义、上下文配置以及固定 BEM 类名,顺序和语义都合理,迁移没有问题。
4-4: No action required — the import style is correct and supportedThe
clsxpackage explicitly exports both a default export and a named export. The import statementimport { clsx } from 'clsx';is a valid and supported pattern, particularly for TypeScript users. Bothimport clsx from 'clsx'andimport { clsx } from 'clsx'work identically and will not cause runtime errors.Likely an incorrect or invalid review comment.
packages/x/.dumi/theme/builtins/Previewer/CodePreviewer.tsx (3)
6-6: clsx 引入方式符合官方用法,替换 classnames 合理这里改为
import { clsx } from 'clsx';与官方 README 推荐用法之一一致,用于替代原来的 classnames 没有语义差异,体积也更小,方向正确。
163-167: codeBoxClass 使用 clsx 重写后语义与原逻辑保持一致
clsx('code-box', { expand: codeExpand, 'code-box-debug': originDebug, 'code-box-simplify': simplify })等价于原先的 classNames 写法,保持了.code-box基类及按布尔值附加修饰类的行为,没发现逻辑问题。
170-172: highlightClass 的展开样式切换实现简洁清晰
clsx('highlight-wrapper', { 'highlight-wrapper-expand': codeExpand })直接用布尔值控制单一修饰类,逻辑简单明了,和视图展开状态一一对应。packages/x/components/actions/ActionsFeedback.tsx (2)
2-4: pickAttrs 与 clsx 的迁移总体合理,但需要注意依赖版本
pickAttrs从rc-util迁到@rc-component/util/lib/pickAttrs,调用参数保持一致,看起来是等价替换,符合本 PR「统一迁移到 @rc-component/*」的目标。import { clsx } from 'clsx';在clsx >= 1.2.0中是官方支持的 named export alias 导入方式,因此语义正确,但前提是仓库中锁定的clsx版本已升级到该范围。(github.com)建议确认当前依赖中的
clsx版本 ≥ 1.2.0,以避免老版本构建时出现导入错误。
84-95: 使用 clsx 构建根节点 mergedCls 语义正确这里从
classnames切到clsx仅是工具替换,字符串与对象入参的结构保持不变,direction === 'rtl'时仍然只按需附加-rtlclass,行为与原实现基本一致,没有看出功能性差异问题。packages/x/scripts/generate-component-changelog.ts (1)
51-51: LGTM!关键字更新正确对齐包迁移。该更改将 changelog 分类关键字从
'rc-motion'更新为'@rc-component/motion',与 PR 中的包迁移目标一致。这确保了新的 changelog 条目能够正确匹配和分类。为了确保迁移的完整性,建议验证:
- 代码库中是否还有对旧包名
rc-motion的引用- 现有 CHANGELOG 文件中是否有旧包名的条目可能会被遗漏
packages/x/docs/playground/ultramodern.tsx (2)
25-25: 从 classnames 迁移到 clsx 的导入正确导入语句从
classnames正确迁移到clsx。clsx 是一个更轻量的替代方案,有助于减小打包体积。
402-402: clsx 的使用方式正确从
classNames迁移到clsx的使用是正确的。两者的对象语法完全兼容,条件类名的逻辑保持不变。packages/x/.dumi/theme/slots/Content/Contributors.tsx (2)
3-3: classnames 到 clsx 的迁移正确导入语句从
classNames正确迁移到clsx。这符合 PR 的目标,有助于减小打包体积。
50-50: clsx 使用正确
clsx的使用方式与classNames完全兼容。条件类名的对象语法保持不变,功能等效。packages/x/components/bubble/TypingContent.tsx (2)
1-1: classnames 到 clsx 的迁移正确导入语句从
classnames正确迁移到clsx,这有助于减小打包体积。
36-39: clsx 的多条件使用正确
clsx的使用完全兼容原有的classNames对象语法。两个条件类名(${prefixCls}-typing和${prefixCls}-fade-in)的逻辑保持不变,功能等效。packages/x/components/_util/warning.ts (1)
1-1: Warning import migration requires verificationThe migration from
rc-util/lib/warningto@rc-component/util/lib/warningcannot be fully verified without access to the repository. Ensure that:
- The
@rc-component/utilpackage exportsresetWarnedas a named export matching the originalrc-utilAPI- Lines 11 and 19 continue to work correctly with the new import source
- The
rcWarningandrcResetWarnedfunction signatures remain unchangedpackages/x/.dumi/theme/common/styles/Common.tsx (1)
2-2: Verify@rc-component/utilpackage compatibilityThe import path migration from
rc-utilto@rc-component/utilappears sound, withupdateCSSusage unchanged. However, confirmation is needed that:
@rc-component/util/lib/Dom/dynamicCSSexportsupdateCSSwith the same API signature- No other
rc-utilimports remain in the codebase for the dynamicCSS functionality- The
@rc-component/utildependency is properly installed and configuredpackages/x/components/_util/hooks/use-shortcut-keys.ts (1)
1-1: Verify KeyCode import compatibility between @rc-component/util and rc-utilThe import path change from
rc-util/lib/KeyCodeto@rc-component/util/lib/KeyCoderequires verification that:
- The target export path exists and is stable
- The KeyCode API interface remains compatible
- All usages in this file work as expected with the new import
Run the suggested verification scripts against your codebase to confirm there are no remaining old imports and that KeyCode usage patterns function correctly.
packages/x-sdk/src/x-chat/index.ts (1)
1-1: useEvent 导入迁移正确从
rc-util迁移到@rc-component/util的useEvent导入是正确的。两个包都导出相同的useEventAPI(签名:<T extends Function>(callback: T) => T),确保完全兼容性。packages/x/components/conversations/demo/shortcutKeys.tsx (1)
9-9: KeyCode 导入迁移与 PR 目标一致这里只是将
KeyCode的导入从rc-util迁移到@rc-component/util,用法保持不变,快捷键行为理论上应与之前一致。建议在依赖升级后跑一遍相关快捷键交互或测试,确认打包与运行时解析都正常。packages/x/.dumi/theme/slots/Header/Logo.tsx (1)
2-2: Logo 组件切换到 clsx 语义保持一致
className={clsx(styles.logo, (isMobile || isMini) && styles.mobile)}与原先的 classnames 写法等价,移动端与迷你态样式应用逻辑不变,改动符合统一使用 clsx 的方向。Also applies to: 77-77
packages/x/.dumi/theme/builtins/InstallDependencies/utoo.tsx (1)
2-2: UtooIcon 使用 clsx 合并类名是等价迁移
clsx(styles.iconWrap, className)与原来的 classnames 用法语义一致,同时保留透传的外部className,图标渲染行为不会变化。Also applies to: 24-24
packages/x/components/attachments/PlaceholderUploader.tsx (1)
2-2: PlaceholderUploader 类名合并迁移保持原有逻辑
clsx(placeholderCls, { ... }, className)与之前的 classnames 写法一一对应:拖入态与禁用态的修饰类仍按布尔状态切换,外部className继续附加,行为上是无感重构。Also applies to: 68-75
packages/x/.dumi/theme/builtins/InstallDependencies/yarn.tsx (1)
2-2: YarnIcon 使用 clsx 合并类名符合预期
className={clsx(styles.iconWrap, className)}正确保留了固定包裹样式并附加外部传入类名,与此前 classnames 行为一致,图标展示不会受影响。Also applies to: 24-24
packages/x/components/sender/components/ActionButton.tsx (1)
2-2: ActionButton 使用 clsx 组装类名,禁用态逻辑保持不变
className={clsx(prefixCls, className, { [${prefixCls}-disabled]: mergedDisabled })}与之前 classnames 写法等价:基础前缀、外部类名和禁用态修饰类都保留下来,只是替换了工具函数。建议在 Sender 区域把几种 action(send/clear/cancel/speech)都点一圈,确认禁用态样式在新依赖下表现正常。Also applies to: 44-46
packages/x/components/bubble/System.tsx (1)
1-1: 重构正确,依赖迁移合理。从
classnames迁移到clsx是一个很好的优化选择,clsx更轻量且性能更好。此处的用法语义完全一致,类名合并逻辑保持不变。Also applies to: 34-44
packages/x/components/bubble/Divider.tsx (1)
2-2: 类名工具迁移正确。
clsx替换classnames的实现正确,类名合并的输入参数和语义保持一致,不影响功能。Also applies to: 35-45
packages/x/components/bubble/EditableContent.tsx (1)
1-1: 工具函数导入路径更新正确。
useEvent从rc-util迁移到@rc-component/util,使用方式保持不变,重构合理。packages/x/components/bubble/hooks/useTyping.ts (1)
1-1: Hook 导入路径迁移正确。
useLayoutEffect从rc-util迁移到@rc-component/util/es/hooks/useLayoutEffect,Hook 的使用方式完全一致。packages/x/.dumi/theme/builtins/VideoPlayer/index.tsx (1)
3-3: 类名工具迁移实现正确。
clsx替换classnames用于类名合并,实现正确且语义一致。Also applies to: 62-62, 70-70
packages/x/.dumi/theme/builtins/IconSearch/CopyableIcon.tsx (1)
4-4: 类名工具迁移实现正确。
clsx替换classnames,支持多个参数和条件对象的用法完全正确,类名合并逻辑保持不变。Also applies to: 109-109
packages/x-sdk/tests/utils.tsx (1)
1-2: Internal API import path requires verification.The migration from
rc-resize-observerto@rc-component/resize-observerfollows the documented package rename. However, importing internal APIs (_rs) from specific paths (es/utils/observerUtilandlib/utils/observerUtil) is not part of the standard migration guidance and may not be stable across versions.Verify that:
- The
_rsexport exists in both theesandlibvariants of the new package- This internal API is intended for consumption and won't break in future updates
- The test utilities work correctly with the new package by running the test suite
packages/x/.dumi/theme/builtins/TokenCompare/index.tsx (1)
5-5: 迁移到 clsx 的实现正确。从
classNames迁移到clsx的改动是正确的,两者在此使用场景下的 API 完全兼容,不会影响功能。Also applies to: 110-110
packages/x/components/file-card/components/File.tsx (1)
1-1: clsx 迁移实现正确,保持了原有逻辑。文件中所有的
classNames调用已正确替换为clsx,条件类名的拼接逻辑保持不变,组件行为不受影响。Also applies to: 38-41, 56-57, 62-65, 68-70
packages/x/components/actions/ActionsMenu.tsx (1)
3-3: 类名工具库迁移正确。
clsx替换classNames的改动正确,className 的拼接逻辑与原实现保持一致。Also applies to: 53-57, 60-62
packages/x/components/attachments/index.tsx (2)
126-126: clsx 类名拼接实现正确。所有
clsx的使用都正确保留了原有的条件类名逻辑,不会影响组件的样式渲染。Also applies to: 174-181, 191-192, 200-201, 211-220
1-1: 工具库迁移正确。从
rc-util迁移到@rc-component/util的改动符合预期。useEvent和useMergedState这两个 Hook 在@rc-component/util中可正常导出,API 保持兼容。packages/x-sdk/tests/setup.ts (1)
44-44: 注释更新正确。将注释中的包名从
rc-motion更新为@rc-component/motion,与实际的包迁移保持一致。packages/x/components/sources/components/CarouselCard.tsx (1)
3-3: clsx 迁移正确,条件类名逻辑保持不变。所有
clsx的使用都正确实现了条件类名的拼接,特别是按钮禁用状态的样式控制逻辑保持一致。Also applies to: 36-36, 40-42, 52-54
packages/x/.dumi/theme/slots/Content/DocAnchor.tsx (1)
4-4: TOC 调试样式的类名工具迁移正确。
clsx替换classNames实现正确,条件类名toc-debug的应用逻辑保持不变。Also applies to: 90-92
packages/x/.dumi/hooks/useThemeAnimation.ts (1)
1-1: dynamicCSS 工具导入路径更新需要验证。从
rc-util/lib/Dom/dynamicCSS迁移到@rc-component/util/lib/Dom/dynamicCSS的改动需要确认项目中所有相关使用都已完成迁移,且新包提供的 API 与旧包保持一致。建议运行以下检查:
- 确认项目中不存在旧的
rc-utildynamicCSS 导入- 验证
@rc-component/util包中removeCSS和updateCSS函数的 API 签名保持不变packages/x/components/welcome/index.tsx (1)
2-2: clsx 替换整体看起来是等价迁移 ✅这些位置对
clsx的使用方式与之前classnames的参数顺序和含义保持一致,语义和行为都应一致,满足统一依赖、减小包体的目标。建议在本地跑一遍类型检查和构建,确认当前clsx版本支持命名导入用法。Also applies to: 71-72, 87-88, 102-103, 114-126, 147-151
packages/x/.dumi/theme/slots/Sidebar/index.tsx (1)
2-2: MobileMenu 从rc-drawer迁移到@rc-component/drawer看起来合理保持了默认导入和用法不变,只是切换了包名,符合本 PR “rc-* → @rc-component/*” 的目标。请确认:
@rc-component/drawer已作为依赖加入到对应 package.json;- dumi 文档站在移动端下打开侧边栏时行为和样式都正常。
Based on learnings, 之前 rc-drawer 是文档侧边栏布局中的必要依赖,此处迁移到作用等价的新包能继续满足该需求。
Also applies to: 137-143
packages/x/components/actions/ActionsItem.tsx (1)
2-2: ActionsItem 中 pickAttrs / clsx 的迁移是等价的
pickAttrs从@rc-component/util/lib/pickAttrs引入,与之前 rc-util 的子路径形式一致,domProps的生成逻辑未变。mergedCls使用clsx组合各类名和 RTL 条件标记,顺序清晰、语义与原先classnames一致。整体看起来是一次纯粹的依赖迁移,不改变行为。建议本地跑一遍类型检查和单测,确认新包
@rc-component/util和clsx的类型/打包配置一切正常。Also applies to: 4-4, 75-101
packages/x/.dumi/theme/layouts/DocLayout/index.tsx (1)
1-1: DocLayout 使用 clsx 控制rtlclass 的实现正确在
<html>元素上用clsx({ rtl: direction === 'rtl' }),与之前的写法语义一致,只在direction === 'rtl'时输出rtlclass,其它情况为空字符串,对现有样式不应有行为差异。请在文档站切换 RTL / LTR 模式验证一下<html>的 class 是否如预期变化。Also applies to: 93-97
packages/x/.dumi/theme/slots/Content/index.tsx (1)
2-2: Content 里 classNames → clsx 的替换是等价的
<article>的className={clsx(styles.articleWrapper, { rtl: isRTL })}与之前写法等价:始终带上styles.articleWrapper,在 RTL 模式下额外加一个rtl。逻辑简单清晰,符合本 PR 的重构目标。建议在文档页切换方向时检查一下文章区域的布局是否与之前一致。Also applies to: 60-60
packages/x/components/actions/context.ts (1)
4-8: ActionsContext referencesActionsProps['clsx']which may not exist in the ActionsProps interfaceThe context type definition references
ActionsProps['clsx']for theclassNamesfield, but this property may not be defined in ActionsProps. Verify thatclsxis a valid property in ActionsProps; if not, it should referenceActionsProps['classNames']instead:export const ActionsContext = React.createContext<{ prefixCls?: string; styles?: ActionsProps['styles']; - classNames?: ActionsProps['clsx']; + classNames?: ActionsProps['classNames']; }>(null!);packages/x/.dumi/theme/builtins/MarkdownPluginsOverView.tsx (1)
4-4: clsx 替换是等价迁移,但 itemMeta 的 CSS 有一个多余的}
className={clsx(styles.container)}/clsx(styles.item)/clsx(styles.itemMeta)都只是把单个样式类包进 clsx,行为与原先classnames(styles.xxx)完全一致。- 注意到
itemMeta的样式中这一行:itemMeta: css` padding-inline: ${token.padding}px}; `,末尾多了一个
},会让这一条 CSS 声明变成非法值,导致padding-inline不生效。建议改为:
- itemMeta: css` - padding-inline: ${token.padding}px}; - `, + itemMeta: css` + padding-inline: ${token.padding}px; + `,修复后列表项 Meta 的左右内边距会按设计 token 生效。
Also applies to: 14-31, 58-67
packages/x/.dumi/pages/index/components/MainBanner.tsx (1)
3-3: clsx 迁移与原逻辑一致
className={clsx(...)}
- 参数都是样式字符串和布尔短路表达式,clsx 与原先 classnames 行为一致。
direction === 'rtl' && styles.lottie_rtl在 clsx 下同样只在条件为真时追加类名。这块迁移看起来是无副作用的样式级重构。
Also applies to: 263-265, 268-270, 278-279
packages/x/.dumi/theme/slots/Content/ColumnCard.tsx (1)
4-4: 图标类名由 classnames 切换为 clsx 无行为差异
clsx(logo, 'xxx-logo')只是在两个字符串类名间做拼接,等价于之前的classNames用法,不影响样式分支或交互逻辑。整体改动保持行为不变。
Also applies to: 144-145, 178-179, 212-213
packages/x/.dumi/pages/index/common/Container.tsx (1)
2-2: 容器类名合并改用 clsx,语义保持不变
className={clsx(styles.container, props.className)}与原先的 classnames 用法等价,能正确忽略未传入的props.className,不影响现有调用方。Also applies to: 51-52
packages/x/components/suggestion/index.tsx (1)
1-1: Suggestion 组件 util 与类名迁移整体合理
useMergedState/useEvent从@rc-component/util引入,调用方式未变,受控/非受控逻辑、事件包装语义保持一致。rootClassName={clsx(rootClassName, prefixCls, hashId, cssVarCls, { ... })}继续确保:
- 基础前缀类、样式 hash、CSS 变量类都挂在 Cascader 上;
block时追加${prefixCls}-block修饰符。- 外层 wrapper 使用
clsx(prefixCls, contextConfig.className, rootClassName, className, ...)也与之前 classnames 逻辑一致。整体为无行为变化的依赖与样式拼接重构。
Also applies to: 4-4, 93-96, 103-111, 141-145, 159-163, 175-177, 182-190
packages/x/components/sender/TextArea.tsx (1)
1-2: Sender TextArea 的 rc-util 替换与 clsx 使用看起来安全
getComponent使用的getValue(components, ['input'])仅做安全取值,迁移到@rc-component/util/lib/utils/get不改变行为。domProps = pickAttrs(restProps, { attr: true, aria: true, data: true })继续只透传合法 DOM/ARIA/data 属性。className={clsx(\${prefixCls}-input`, classNames.input)}中第二个参数允许为undefined`,clsx 会自动忽略,效果与之前一致。建议本地跑一遍 Sender 场景相关用例,确认新路径与打包配置完全匹配。
Also applies to: 5-5, 10-16, 154-158, 160-163, 172-178
packages/x/tests/__mocks__/@rc-component/virtual-list.ts (1)
1-3: 虚拟列表 mock 对齐 @rc-component 版本通过
export default直接透传@rc-component/virtual-list/lib/mock,可以平滑替换原 rc-virtual-list mock。
建议确认 Jest / 测试运行器对__mocks__/@rc-component/virtual-list的解析路径与之前 rc-virtual-list 配置一致,以免出现未命中 mock 的情况。packages/x/components/sender/SenderSwitch.tsx (1)
1-2: SenderSwitch 状态管理与类名迁移保持原始语义
useMergedState迁移到@rc-component/util后:
- 仍以
defaultValue为初始值、value为受控值;- onChange 回调里通过
onChange?.(key || false)将undefined归一到false,与原逻辑一致。mergedCls = clsx(...)中继续合并:
- 组件前缀类、上下文 classNames、hashId/cssVarCls;
-checked与-rtl修饰符。- Button 的
className={clsx(\${switchCls}-content`, classNames.content)}` 与之前 classnames 等价。整体为依赖与样式层的重构,行为不变。
Also applies to: 4-4, 63-67, 87-95, 98-113, 100-113, 128-132
packages/x/components/attachments/DropArea.tsx (1)
1-1: DropArea 类名改用 clsx,条件类逻辑保持一致
className={clsx(areaCls, className, { [\${areaCls}-on-body`]: container.tagName === 'BODY' })}`:
- 始终包含基础
areaCls;- 透传自定义
className;- 在容器为
<body>时追加修饰类,与原先 classnames 行为相同。整体迁移不会影响拖拽逻辑与显示时机。
Also applies to: 73-80
packages/x/components/bubble/BubbleList.tsx (2)
1-3: LGTM! 依赖迁移正确。导入语句已正确从
classnames和rc-util迁移到clsx和@rc-component/util。使用 ES 模块路径(/es/)有助于树摇优化。
149-156: LGTM!clsx使用正确。所有
classNames调用已正确替换为clsx。clsx与classnames在此类用法中功能等效,且体积更小。Also applies to: 212-214
packages/x/components/bubble/Bubble.tsx (2)
1-2: LGTM! 导入迁移一致。已正确迁移到
@rc-component/util和clsx。
78-93: LGTM! 类名组合已统一迁移。所有
className构造已一致地迁移到clsx,保持了相同的逻辑和条件。Also applies to: 157-168, 182-182, 196-196, 235-238
packages/x/.dumi/components/SemanticPreview.tsx (2)
2-2: LGTM! 导入更新正确。已正确迁移到
@rc-component/util和clsx。Also applies to: 5-5
152-152: LGTM! 类名构造已一致更新。所有
className构造都已正确迁移到clsx。Also applies to: 154-154, 158-158, 182-182, 204-208
packages/x/components/sources/Sources.tsx (2)
2-7: LGTM! 依赖迁移全面且一致。已正确从
rc-motion和rc-util迁移到@rc-component/motion和@rc-component/util,并引入了clsx。
94-106: LGTM! 类名组合更新完整。所有
className构造已一致地迁移到clsx。Also applies to: 161-167, 175-179, 184-193, 198-201
packages/x/components/sender/SlotTextArea.tsx (2)
2-4: LGTM! 导入更新正确。已正确迁移到
@rc-component/util和clsx。
180-183: LGTM!clsx使用正确。类名构造已正确更新为使用
clsx。Also applies to: 626-634
packages/x/components/actions/index.tsx (2)
1-4: LGTM! 完整的依赖迁移。已正确从
rc-motion和rc-util迁移到@rc-component/motion和@rc-component/util,包括CSSMotion、pickAttrs、composeRef等工具函数。
57-69: LGTM! 类名组合已一致迁移。所有
className构造已统一使用clsx。Also applies to: 99-103, 112-116
packages/x-markdown/package.json (2)
57-57: Remove this comment — no concrete compatibility concerns identified.The comment requests generic verification of
clsx@^2.1.1without identifying specific compatibility issues or actual problems.clsx@^2.1.1is a stable, widely-adopted version with no known critical issues. If specific compatibility concerns exist (e.g., with React 19, antd 6.1.0, or particular use cases), they should be explicitly identified in the comment; otherwise, this represents an unnecessary precautionary check.
73-73: Verify antd 6.1.0 fully supports React 19 before merging.antd 6.1.0 targets React 18+ with stated React 19 compatibility intent, but known issues exist: some ecosystem packages have outdated peerDependencies, and runtime problems have been reported with certain dependency combinations (e.g., Next.js 15, ref access changes). End-to-end testing is required, particularly for static APIs (Modal/message) and ref-dependent libraries. If peer-dependency warnings occur during installation, apply overrides or use
--legacy-peer-depsas a temporary workaround.Also applies to: 79-79
packages/x/components/think/Think.tsx (2)
2-6: LGTM!导入迁移正确:
@rc-component/motion、@rc-component/util和clsx的引入符合 PR 目标。clsx的 API 与classnames兼容,迁移是安全的。
92-103: LGTM!
clsx用法正确,支持字符串、对象和数组参数,与之前的classnames行为一致。packages/x/components/prompts/index.tsx (2)
1-4: LGTM!导入迁移正确。
CSSMotion和composeRef从@rc-component/*导入,clsx替换classnames,符合 PR 目标。
156-175: LGTM!
clsx用于mergedCls和mergedListCls的构建方式与原classnames一致,迁移正确。packages/x/components/file-card/FileCard.tsx (2)
14-17: LGTM!
pickAttrs从@rc-component/util导入,clsx替换classnames,迁移正确。
202-213: LGTM!
mergedCls的构建逻辑与原实现一致,clsx正确处理条件类名。packages/x/components/file-card/List.tsx (2)
2-4: LGTM!
CSSMotionList从@rc-component/motion导入,clsx替换classnames,迁移正确。
63-69: LGTM!
mergedCls构建逻辑正确,多个条件类名的处理方式与原classnames一致。packages/x/components/sender/useSpeech.ts (1)
1-1: useSpeech 中迁移 useEvent/useMergedState 到 @rc-component/util 看起来是等价替换命名和调用方式保持不变,理论上无行为差异;建议确认当前项目中 @rc-component/util 的对应实现与原 rc-util 钩子在受控 value/onChange 语义上完全一致。
packages/x-markdown/src/XMarkdown/index.tsx (1)
1-1: XMarkdown 使用 clsx 合并类名的写法与原 classnames 等价导入改为
{ clsx },mergedCls仍按相同顺序合并prefixCls、固定类和外部rootClassName/className,生成的类名集合不会变化,可读性也保持良好。Also applies to: 30-30
packages/x/components/conversations/__tests__/index.test.tsx (1)
1-1: 测试用例中的 KeyCode 来源迁移到 @rc-component/util/lib/KeyCode仅调整了导入路径,
KeyCode.ONE、KeyCode.K等常量名保持不变;请确认新包中的实际数值映射与原 rc-util 完全一致,以避免快捷键相关断言(尤其是重复快捷键告警用例)出现偏差。packages/x/.dumi/pages/index/index.tsx (1)
2-2: 首页多个 section 的 className 已改用 clsx 组合
clsx(styles.section, styles.container/framework)的用法与原先的 classnames 等价,所有参与合并的样式变量和顺序未变,视觉结构应保持一致;同时也与仓库其余 clsx 用法保持统一。Also applies to: 45-45, 50-50, 58-58
packages/x/.dumi/theme/slots/Header/Navigation.tsx (1)
2-2: HeaderNavigation 导航容器 className 迁移到 clsx,条件逻辑保持不变
clsx中对styles.nav、mobile/pc、mini、RTL 以及外部className的组合顺序和条件与原实现一致,预期不会影响布局或主题切换行为。Also applies to: 179-185
packages/x/components/thought-chain/Item.tsx (1)
1-2: ThoughtChain Item 迁移到 clsx 及 @rc-component/util/pickAttrs 整体合理
pickAttrs仅更换了来源路径,调用参数保持不变(attr/aria/data),DOM 透传行为应与原实现一致。- 若干处
className改用clsx合并:根节点、content、title、description 均保留了原有基础类与条件类(variant、点击态、错误态、RTL、blink 等),渲染出来的类名集合与之前一致。整体看是无行为差异的依赖替换,便于在项目内统一到 @rc-component/util 与 clsx。
Also applies to: 129-143, 156-158, 164-165, 173-173
packages/x/components/sender/components/LoadingButton.tsx (1)
2-2: LoadingButton 使用 clsx 合并类名,行为与原实现一致
className={clsx(className, \${prefixCls}-loading-button`)}仍会保留外部传入的className`,并附加内部约定类名,顺序与原 classnames 用法一致,不影响样式覆盖关系。Also applies to: 18-18
packages/x/components/thought-chain/Status.tsx (1)
7-7: LGTM! clsx 迁移正确。类名组合逻辑正确,对象语法的条件类名使用得当。
Also applies to: 82-84
packages/x/.dumi/theme/common/Color/ColorPalettes.tsx (1)
1-1: LGTM! clsx 替换正确。条件类名逻辑保持不变,深色模式的类名处理正确。
Also applies to: 84-84
packages/x/.dumi/theme/builtins/InstallDependencies/pnpm.tsx (1)
2-2: LGTM! 简单的类名合并迁移正确。Also applies to: 24-24
packages/x/components/conversations/Item.tsx (2)
6-6: LGTM! clsx 迁移正确。条件类名的逻辑正确,包括 active 和 disabled 状态的处理。
Also applies to: 46-51
2-2: Verify @rc-component/util pickAttrs API compatibility.Based on documentation,
pickAttrsis exported from bothrc-utiland@rc-component/utilwith the identical signature:pickAttrs(props: Object): Object. Both packages support the import path@rc-component/util/lib/pickAttrs, indicating the migration maintains API compatibility. However, local codebase verification (usage patterns, test coverage) could not be completed due to repository access limitations.packages/x/components/conversations/hooks/useCreation.tsx (1)
2-2: LGTM! CreationLabel 组件的 clsx 迁移正确。所有类名组合逻辑正确:
- 条件类名用于快捷键显示状态(15 行)
- 静态类名用于快捷键容器和单个按键(18、20 行)
Also applies to: 15-15, 18-20
packages/x/.dumi/theme/builtins/InstallDependencies/npm.tsx (1)
2-2: LGTM! 简单的类名合并迁移正确。Also applies to: 24-24
packages/x-markdown/src/plugins/Mermaid/index.tsx (1)
9-9: Unable to verify clsx migration claims without repository access.The review comment approves the clsx migration in the Mermaid component and claims correct updates across multiple line ranges (62-73, 257-257, 277-282, 292-292). However, I cannot access the repository to validate these assertions or run the suggested verification scripts to check test coverage and rendering behavior.
packages/x/.dumi/theme/slots/Header/index.tsx (1)
4-4: Migration from classnames to clsx approved, but specific implementation verification required.The classnames-to-clsx migration is generally sound as clsx is a compatible, higher-performance alternative with compatible API. However, verification of the specific implementation at lines 4, 152, 160-167 could not be completed due to repository access limitations. Ensure all classnames usages across these lines were consistently updated and that any component tests pass with the new library.
packages/x/.dumi/theme/slots/Header/Actions.tsx (1)
4-4: LGTM!迁移正确从
classnames到clsx的迁移正确,保持了相同的条件类名逻辑。Also applies to: 155-160
packages/x-markdown/src/plugins/HighlightCode/index.tsx (1)
4-4: LGTM!类名组合迁移正确所有
classNames到clsx的替换都保持了相同的参数和逻辑。Also applies to: 41-52, 62-77, 93-94
packages/x/components/conversations/Creation.tsx (1)
1-1: LGTM!迁移符合预期
clsx替换正确,类名组合逻辑保持不变。Also applies to: 51-53
packages/x/.dumi/theme/common/PrevAndNext.tsx (1)
4-4: LGTM!类名工具迁移正确
clsx替换正确应用于前后导航元素。Also applies to: 148-148, 157-157
packages/x/components/conversations/GroupTitle.tsx (1)
2-3: LGTM!双重迁移执行正确正确迁移了:
rc-motion→@rc-component/motionclassnames→clsx所有导入和使用都已更新,保持了原有功能。
Also applies to: 5-5, 47-49, 52-52, 55-58, 66-66
packages/x/components/actions/Item.tsx (1)
2-2: LGTM!迁移正确
clsx替换保持了条件类名逻辑不变。Also applies to: 31-33
packages/x/components/thought-chain/index.tsx (1)
1-2: LGTM!工具库迁移完整正确迁移了:
rc-util→@rc-component/util(pickAttrs 导入)classnames→clsx(所有类名组合)所有更新保持了原有的功能和逻辑。
Also applies to: 54-68, 109-113, 127-127
packages/x/components/sender/SenderHeader.tsx (1)
2-4: SenderHeader 中 rc-motion 与 classnames 迁移整体合理,但请确认 clsx 导入方式从
rc-motion切到@rc-component/motion,以及从classnames切到clsx后,动画的 enter/leave 配置和 header/content 的类名组合逻辑都保持原语义,RTL 分支也保留,看起来不会引入行为变化。唯一需要确认的是:目前使用import { clsx } from 'clsx';,而社区示例通常是默认导入写法;请确认[email protected]的导出形式、类型定义以及项目的模块解析配置都支持这种命名导入方式,避免构建期类型或运行时问题。Also applies to: 82-84, 97-98, 120-121
packages/x/components/conversations/index.tsx (1)
1-2: Conversations 组件的 useMergedState / pickAttrs / clsx 迁移保持语义不变,但需确认 clsx 导入activeKey 相关状态改用
@rc-component/util的useMergedState,签名和之前 rc-util 版兼容;pickAttrs依旧只下发 attr/aria/data 属性。根节点、Item、Creation、分组标题和子列表的className组合改用clsx后,类名拼接顺序和 RTL 条件类都与原来的classnames版本一致,预期不会改变渲染结果。建议和其他文件一起确认import { clsx } from 'clsx';这种命名导入是否被当前[email protected]及构建配置正确支持,以避免类型或运行时问题。Also applies to: 4-4, 172-184, 239-243, 279-280, 303-307
packages/x/components/sender/index.tsx (1)
1-2: Sender 组件中 useMergedState / pickAttrs 与 clsx 迁移看起来安全,但请检查 clsx 的导入方式
useMergedState从@rc-component/util引入后,innerValue的受控/非受控逻辑与之前保持一致;pickAttrs继续只透传 attr/aria/data 属性到根节点。根容器、content、prefix、actions 列表和 footer 的className均改为用clsx合并,包含 RTL/disabled 以及contextConfig.classNames、classNames等信息,语义与旧版classnames对齐。建议确认import { clsx } from 'clsx';能被当前[email protected]与项目的打包/类型配置正确识别,否则可以考虑改回默认导入形式以降低风险。Also applies to: 4-4, 121-134, 327-338, 355-356, 364-368
packages/x/package.json (1)
87-89: 依赖从 rc- / classnames 迁移到 @rc-component 与 clsx 的配置整体合理,但需在 CI 中重点验收*在 dependencies 中新增
@rc-component/motion、@rc-component/util和clsx,以及在 devDependencies 中引入@rc-component/drawer、@rc-component/resize-observer、@rc-component/table、@rc-component/virtual-list,与代码里看到的 rc-* → @rc-component/* 与 classnames → clsx 迁移方向一致;同时将 antd 升级到^6.1.0并同步更新 peerDependencies 里的 antd 版本也符合预期。建议在 CI/本地重点确认两点:1)运行时代码中已不存在对旧 rc-* 包的引用;2)antd@^6.1.0与react@>=18(尤其是当前使用的 19 版本)以及这些 @rc-component 包组合在构建和测试阶段都能正常工作。Based on learnings, 之前确认 drawer 在.dumi/theme中是必需依赖,这次迁移到@rc-component/drawer后也请确认相关 import 已同步更新,避免文档站点在构建时缺少依赖。Also applies to: 105-111, 153-153, 244-244
00e74c4 to
a851956
Compare
a851956 to
70fef95
Compare
|
🙏 我正准备做这个 👍 |
a7ce1fa to
87e0707
Compare
Bundle ReportChanges will increase total bundle size by 237.28kB (7.59%) ⬆️
Affected Assets, Files, and Routes:view changes for bundle: antdx-array-pushAssets Changed:
view changes for bundle: x-markdown-array-pushAssets Changed:
|
|
奇怪,咋es模块会报错 |
ae4f847 to
5d0ec9f
Compare
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #1448 +/- ##
=======================================
Coverage 94.69% 94.69%
=======================================
Files 137 137
Lines 3960 3960
Branches 1110 1130 +20
=======================================
Hits 3750 3750
Misses 207 207
Partials 3 3 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
@kimteayon 好了 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
packages/x/components/_util/hooks/use-shortcut-keys.ts (1)
224-227: 严重:useEffect 清理函数中的事件监听器移除错误导致内存泄漏。第 226 行在清理函数中错误地使用了
addEventListener而不是removeEventListener,这会导致每次组件重新渲染时都添加新的keyup监听器而不是移除它,造成内存泄漏。应用此 diff 修复内存泄漏:
return () => { document.removeEventListener('keydown', onKeydown); - document.addEventListener('keyup', onKeyup); + document.removeEventListener('keyup', onKeyup); };注意:这是代码中的预存问题,不是本次 PR 引入的,但需要尽快修复以避免性能问题。
packages/x/components/actions/ActionsFeedback.tsx (1)
132-140:classNames.disliked的条件写成了value === 'like',应为dislike当前逻辑:
{ [`${classNames.disliked}`]: classNames.disliked && value === 'like', [`${feedbackCls}-item-dislike-active`]: value === 'dislike', }
*-dislike-active在value === 'dislike'时生效是正确的;- 但
classNames.disliked却在value === 'like'时才会附加,这与语义明显不符,会导致「自定义已点踩样式」永远无法在点踩态生效,反而在点赞态被错误附加(如果两者都配置,还会引发样式冲突)。建议改为在点踩态时才附加
classNames.disliked:- { - [`${classNames.disliked}`]: classNames.disliked && value === 'like', - [`${feedbackCls}-item-dislike-active`]: value === 'dislike', - }, + { + [`${classNames.disliked}`]: classNames.disliked && value === FEEDBACK_VALUE.dislike, + [`${feedbackCls}-item-dislike-active`]: value === FEEDBACK_VALUE.dislike, + },这样既修复逻辑错误,也顺便统一使用
FEEDBACK_VALUE.dislike,避免魔法字符串。
♻️ Duplicate comments (2)
packages/x/.dumi/pages/index/components/DesignGuide.tsx (1)
227-227: 单个类名无需使用clsx包装。当只有单个类名时,可以直接使用以提高可读性。
应用以下 diff 来简化代码:
- <div className={clsx(styles.chain_item_icon)}> + <div className={styles.chain_item_icon}>packages/x-markdown/tests/setupAfterEnv.ts (1)
3-11:spyElementPrototypes从@rc-component/util引用风险较大,建议改为本地实现这里把原来的
rc-util/lib/test/domHook迁移成:import { spyElementPrototypes } from '@rc-component/util/lib/test/domHook';有几点风险:
@rc-component/util的exports未必暴露lib/test/domHook这个子路径,即使打包里有文件,也可能在 Node/Jest 下直接import失败(和你在 PR 里提到的SyntaxError: Unexpected token 'export'很像)。- 就算能解析,测试环境目前大概率仍按 CJS 处理,若这个文件是 ESM(包含
export语法),同样会在运行时抛Unexpected token 'export'。- 这个文件里对
spyElementPrototypes的唯一用法只是给HTMLElement打一个scrollTo: jest.fn()的 mock,用这么深的内部工具并不划算,而且把测试耦合到包内部实现细节,将来包内部结构再变一次还会再炸。考虑到上面这些,建议在这个文件里直接去掉
spyElementPrototypes依赖,改成简单的本地 mock,会更稳也更利于未来升级。例如:-import { spyElementPrototypes } from '@rc-component/util/lib/test/domHook'; ... -// Mock `scrollTo` since jsdom do not support it -spyElementPrototypes(HTMLElement, { - scrollTo: jest.fn(), -}); +// Mock `scrollTo` since jsdom do not support it +if (typeof HTMLElement !== 'undefined') { + // jsdom 环境下原型上通常不存在 scrollTo,这里直接打一个可配置的 stub + Object.defineProperty(HTMLElement.prototype, 'scrollTo', { + configurable: true, + writable: true, + value: jest.fn(), + }); +}这样可以完全绕开
@rc-component/util的 test 工具子路径,也有望直接解决当前的 ES module 报错问题,同时不影响现有测试语义。
🧹 Nitpick comments (3)
packages/x/components/actions/ActionsFeedback.tsx (2)
2-4:@rc-component/util与clsx引入方式合理,但注意构建配置与依赖版本
pickAttrs从@rc-component/util/lib/pickAttrs以默认导入方式使用,接口与旧的rc-util/lib/pickAttrs一致,迁移方向正确。clsx支持import { clsx } from 'clsx'的命名导入方式,现在的写法是推荐方式之一,替换掉classnames没问题。建议额外确认两点:
- 构建/SSR 环境(特别是 Next.js 等)是否已经把
@rc-component家族包加入transpilePackages或等效配置,否则仍可能在某些环境下遇到SyntaxError: Unexpected token 'export'之类的 ESM 报错。- 项目依赖里已显式添加
@rc-component/util和clsx,并确保clsx版本 ≥ 1.2 以支持命名导出写法。(Based on learnings,此处按要求使用中文回复。)
111-120: 点赞项的clsx拼接正确,可选的小优化
classNames.like始终附加,classNames.liked仅在value === 'like'且传入了该字段时才生效,对应「已点赞」语义,逻辑是正确的。feedbackCls下的*-like-active也只在value === 'like'时附加,行为与之前保持一致。可选的小重构(非必须):
- 将这里的字符串字面量
'like'统一替换为FEEDBACK_VALUE.like,可以减少魔法字符串,未来重命名时更安全,例如:- style={{ ...styles.like, ...(value === 'like' ? styles.liked : {}) }} + style={{ ...styles.like, ...(value === FEEDBACK_VALUE.like ? styles.liked : {}) }} @@ - [`${classNames.liked}`]: classNames.liked && value === 'like', - [`${feedbackCls}-item-like-active`]: value === 'like', + [`${classNames.liked}`]: classNames.liked && value === FEEDBACK_VALUE.like, + [`${feedbackCls}-item-like-active`]: value === FEEDBACK_VALUE.like,packages/x/components/file-card/List.tsx (1)
2-5: List 组件对 motion 与 clsx 的迁移整体正确,可考虑微调用法这里把
CSSMotionList切到@rc-component/motion,并用 clsx 统一替换了原来的 classnames,包含:
- 根节点
mergedCls组合了compCls、rootClassName、classNameRoot、hashId、RTL 标记等,逻辑与之前一致;- content 容器和每个 item 的类名依然按 overflow / ping / size / motionCls 条件拼接;
- FileCard 的
className={clsx(item.className, classNameCard)}也继续支持列表级和 item 级样式叠加。功能上看是 1:1 迁移,没有引入新的行为差异。唯一可以考虑的小优化是:外层
<div className={clsx(mergedCls)}>这里可以直接写成className={mergedCls},避免一次多余调用,但完全是可选的微调,不影响当前合入。Also applies to: 63-73, 125-133, 149-150, 157-158
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (105)
-
package.json(1 hunks) -
packages/x-markdown/.jest.js(1 hunks) -
packages/x-markdown/package.json(1 hunks) -
packages/x-markdown/src/XMarkdown/index.tsx(2 hunks) -
packages/x-markdown/tests/setup.ts(1 hunks) -
packages/x-markdown/tests/setupAfterEnv.ts(1 hunks) -
packages/x-sdk/.jest.js(1 hunks) -
packages/x-sdk/package.json(1 hunks) -
packages/x-sdk/src/x-chat/index.ts(1 hunks) -
packages/x-sdk/tests/setup.ts(1 hunks) -
packages/x-sdk/tests/utils.tsx(1 hunks) -
packages/x/.dumi/components/SemanticPreview.tsx(4 hunks) -
packages/x/.dumi/hooks/useMenu.tsx(2 hunks) -
packages/x/.dumi/hooks/useThemeAnimation.ts(1 hunks) -
packages/x/.dumi/pages/index/common/Container.tsx(2 hunks) -
packages/x/.dumi/pages/index/components/DesignGuide.tsx(2 hunks) -
packages/x/.dumi/pages/index/components/MainBanner.tsx(3 hunks) -
packages/x/.dumi/pages/index/components/SceneIntroduction/index.tsx(2 hunks) -
packages/x/.dumi/pages/index/index.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/IconSearch/CopyableIcon.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/ImagePreview/index.tsx(3 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/bun.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/index.tsx(1 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/npm.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/pnpm.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/utoo.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/yarn.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/MarkdownPluginsOverView.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/Previewer/CodePreviewer.tsx(3 hunks) -
packages/x/.dumi/theme/builtins/TokenCompare/index.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/VideoPlayer/index.tsx(2 hunks) -
packages/x/.dumi/theme/common/Color/ColorPalettes.tsx(2 hunks) -
packages/x/.dumi/theme/common/PrevAndNext.tsx(3 hunks) -
packages/x/.dumi/theme/common/styles/Common.tsx(1 hunks) -
packages/x/.dumi/theme/layouts/DocLayout/index.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Content/ColumnCard.tsx(4 hunks) -
packages/x/.dumi/theme/slots/Content/Contributors.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Content/DocAnchor.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Content/index.tsx(2 hunks) -
packages/x/.dumi/theme/slots/ContentTabs/index.tsx(1 hunks) -
packages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsx(1 hunks) -
packages/x/.dumi/theme/slots/Header/Actions.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Header/Logo.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Header/Navigation.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Header/SwitchBtn.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Header/index.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Sidebar/index.tsx(1 hunks) -
packages/x/.jest.js(1 hunks) -
packages/x/components/_util/hooks/use-collapsible.ts(1 hunks) -
packages/x/components/_util/hooks/use-shortcut-keys.ts(1 hunks) -
packages/x/components/_util/motion.ts(1 hunks) -
packages/x/components/_util/warning.ts(1 hunks) -
packages/x/components/actions/ActionsAudio.tsx(2 hunks) -
packages/x/components/actions/ActionsCopy.tsx(2 hunks) -
packages/x/components/actions/ActionsFeedback.tsx(4 hunks) -
packages/x/components/actions/ActionsItem.tsx(2 hunks) -
packages/x/components/actions/ActionsMenu.tsx(2 hunks) -
packages/x/components/actions/Item.tsx(2 hunks) -
packages/x/components/actions/index.tsx(4 hunks) -
packages/x/components/attachments/DropArea.tsx(2 hunks) -
packages/x/components/attachments/FileList/index.tsx(4 hunks) -
packages/x/components/attachments/PlaceholderUploader.tsx(2 hunks) -
packages/x/components/attachments/index.tsx(6 hunks) -
packages/x/components/bubble/Bubble.tsx(6 hunks) -
packages/x/components/bubble/BubbleList.tsx(3 hunks) -
packages/x/components/bubble/Divider.tsx(2 hunks) -
packages/x/components/bubble/EditableContent.tsx(1 hunks) -
packages/x/components/bubble/System.tsx(2 hunks) -
packages/x/components/bubble/TypingContent.tsx(2 hunks) -
packages/x/components/bubble/hooks/useTyping.ts(1 hunks) -
packages/x/components/code-highlighter/CodeHighlighter.tsx(4 hunks) -
packages/x/components/conversations/Creation.tsx(2 hunks) -
packages/x/components/conversations/GroupTitle.tsx(3 hunks) -
packages/x/components/conversations/Item.tsx(2 hunks) -
packages/x/components/conversations/__tests__/index.test.tsx(1 hunks) -
packages/x/components/conversations/demo/shortcutKeys.tsx(1 hunks) -
packages/x/components/conversations/hooks/useCreation.tsx(2 hunks) -
packages/x/components/conversations/index.tsx(5 hunks) -
packages/x/components/file-card/FileCard.tsx(5 hunks) -
packages/x/components/file-card/List.tsx(4 hunks) -
packages/x/components/file-card/components/File.tsx(3 hunks) -
packages/x/components/file-card/components/ImageLoading.tsx(3 hunks) -
packages/x/components/mermaid/Mermaid.tsx(5 hunks) -
packages/x/components/prompts/index.tsx(6 hunks) -
packages/x/components/sender/SenderHeader.tsx(4 hunks) -
packages/x/components/sender/SenderSwitch.tsx(3 hunks) -
packages/x/components/sender/SlotTextArea.tsx(5 hunks) -
packages/x/components/sender/TextArea.tsx(2 hunks) -
packages/x/components/sender/__tests__/use-speech.test.tsx(1 hunks) -
packages/x/components/sender/components/ActionButton.tsx(2 hunks) -
packages/x/components/sender/components/LoadingButton.tsx(2 hunks) -
packages/x/components/sender/components/Skill.tsx(2 hunks) -
packages/x/components/sender/hooks/use-speech.ts(1 hunks) -
packages/x/components/sender/index.tsx(5 hunks) -
packages/x/components/sources/Sources.tsx(6 hunks) -
packages/x/components/sources/components/CarouselCard.tsx(3 hunks) -
packages/x/components/suggestion/index.tsx(3 hunks) -
packages/x/components/suggestion/useActive.ts(1 hunks) -
packages/x/components/think/Think.tsx(4 hunks) -
packages/x/components/thought-chain/Item.tsx(4 hunks) -
packages/x/components/thought-chain/Node.tsx(5 hunks) -
packages/x/components/thought-chain/Status.tsx(2 hunks) -
packages/x/components/thought-chain/index.tsx(4 hunks) -
packages/x/components/welcome/index.tsx(6 hunks) -
packages/x/docs/playground/ultramodern.tsx(2 hunks)
✅ Files skipped from review due to trivial changes (1)
- packages/x/components/sender/hooks/use-speech.ts
🚧 Files skipped from review as they are similar to previous changes (62)
- packages/x/components/actions/ActionsAudio.tsx
- packages/x/components/conversations/demo/shortcutKeys.tsx
- packages/x/.dumi/theme/builtins/VideoPlayer/index.tsx
- packages/x/.dumi/theme/slots/Header/Actions.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/npm.tsx
- packages/x/components/sender/components/LoadingButton.tsx
- packages/x/components/bubble/TypingContent.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/utoo.tsx
- packages/x/components/file-card/FileCard.tsx
- packages/x/components/sources/components/CarouselCard.tsx
- packages/x/components/conversations/Creation.tsx
- packages/x/components/prompts/index.tsx
- packages/x/components/think/Think.tsx
- packages/x/components/actions/index.tsx
- packages/x/.dumi/pages/index/index.tsx
- packages/x/components/suggestion/useActive.ts
- packages/x/components/actions/ActionsItem.tsx
- packages/x/.dumi/theme/slots/Content/index.tsx
- packages/x/components/sender/components/ActionButton.tsx
- packages/x/components/_util/motion.ts
- packages/x/.dumi/theme/layouts/DocLayout/index.tsx
- packages/x-markdown/tests/setup.ts
- packages/x/.dumi/theme/builtins/InstallDependencies/pnpm.tsx
- packages/x/.dumi/theme/slots/Content/DocAnchor.tsx
- packages/x/.dumi/theme/slots/Header/index.tsx
- packages/x/components/attachments/index.tsx
- packages/x/components/conversations/tests/index.test.tsx
- packages/x/.dumi/theme/slots/Header/Logo.tsx
- packages/x/components/actions/ActionsCopy.tsx
- packages/x-sdk/tests/setup.ts
- packages/x/components/thought-chain/index.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/yarn.tsx
- packages/x/.dumi/components/SemanticPreview.tsx
- packages/x/.dumi/theme/common/PrevAndNext.tsx
- packages/x/components/thought-chain/Node.tsx
- package.json
- packages/x/components/attachments/PlaceholderUploader.tsx
- packages/x/components/welcome/index.tsx
- packages/x/.dumi/theme/slots/ContentTabs/index.tsx
- packages/x/components/_util/warning.ts
- packages/x/components/file-card/components/File.tsx
- packages/x/.dumi/theme/common/Color/ColorPalettes.tsx
- packages/x/components/conversations/hooks/useCreation.tsx
- packages/x/docs/playground/ultramodern.tsx
- packages/x/.dumi/theme/slots/Sidebar/index.tsx
- packages/x/components/bubble/EditableContent.tsx
- packages/x/.dumi/hooks/useMenu.tsx
- packages/x/components/sender/SenderSwitch.tsx
- packages/x/components/bubble/Bubble.tsx
- packages/x/.dumi/theme/builtins/Previewer/CodePreviewer.tsx
- packages/x/.dumi/theme/slots/Header/Navigation.tsx
- packages/x/components/thought-chain/Status.tsx
- packages/x-markdown/src/XMarkdown/index.tsx
- packages/x/components/attachments/FileList/index.tsx
- packages/x/components/conversations/GroupTitle.tsx
- packages/x/.dumi/theme/slots/Header/SwitchBtn.tsx
- packages/x/components/bubble/BubbleList.tsx
- packages/x/components/actions/Item.tsx
- packages/x/components/sender/TextArea.tsx
- packages/x/components/bubble/hooks/useTyping.ts
- packages/x/components/sender/index.tsx
- packages/x/.dumi/theme/builtins/IconSearch/CopyableIcon.tsx
🧰 Additional context used
🧠 Learnings (2)
📓 Common learnings
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时,需要用中文回复中文评论。该项目的文档支持中英双语。
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时,需要用中文回复中文评论。该项目的文档支持中英双语。
Learnt from: YumoImer
Repo: ant-design/x PR: 223
File: package.json:224-224
Timestamp: 2024-11-23T15:50:20.802Z
Learning: `rc-drawer` 依赖在 `.dumi/theme/layouts/SidebarLayout` 文件中被使用,是项目中的必要依赖,今后不应建议移除。
📚 Learning: 2024-11-23T15:50:20.802Z
Learnt from: YumoImer
Repo: ant-design/x PR: 223
File: package.json:224-224
Timestamp: 2024-11-23T15:50:20.802Z
Learning: `rc-drawer` 依赖在 `.dumi/theme/layouts/SidebarLayout` 文件中被使用,是项目中的必要依赖,今后不应建议移除。
Applied to files:
packages/x/.dumi/theme/builtins/InstallDependencies/index.tsxpackages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsxpackages/x/.dumi/hooks/useThemeAnimation.tspackages/x/.dumi/theme/common/styles/Common.tsx
🧬 Code graph analysis (2)
packages/x/.dumi/pages/index/components/MainBanner.tsx (1)
packages/x/.dumi/theme/utils.ts (1)
getLocalizedPathname(123-151)
packages/x/components/thought-chain/Item.tsx (1)
packages/x/components/style/motion/blink.ts (1)
blink(4-25)
⏰ 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). (1)
- GitHub Check: WIP
🔇 Additional comments (61)
packages/x/.dumi/pages/index/components/DesignGuide.tsx (1)
3-3: LGTM!导入语句正确。从
classnames迁移到clsx的导入语句正确,符合 PR 的优化目标。packages/x/.dumi/theme/slots/Content/Contributors.tsx (2)
3-3: 导入语句正确从
classnames迁移到clsx的导入语句正确,clsx包支持命名导出。
50-50:clsx使用方式需验证代码从
classNames迁移到clsx,条件类名对象语法{ [className]: condition }的兼容性需确认。若遇到 ES 模块相关错误,请检查项目的 TypeScript 和构建配置是否正确处理了clsx的模块导出。packages/x/components/sender/__tests__/use-speech.test.tsx (1)
5-12: 迁移正确,需验证实现文件同步更新mock 声明从
rc-util迁移到@rc-component/util符合 PR 目标,mock 实现逻辑保持一致。请确认
use-speech.tsx实现文件也已同步迁移到@rc-component/util,以及新包的模块格式与 Jest 配置兼容。packages/x-sdk/tests/utils.tsx (1)
1-2: Verify internal API availability and ES module error relationThese imports rely on internal APIs (the
_rsexport name indicates this is a private/internal interface). Using internal APIs across package migrations is risky because internal APIs can change without notice.Please verify:
- Confirm that
@rc-component/resize-observerexports_rsfrom bothes/utils/observerUtilandlib/utils/observerUtil- Confirm the function signature and behavior match the previous package
- Clarify if the ES module error mentioned in PR comments (
SyntaxError: Unexpected token 'export') is related to this import, and if so, whether the new package structure supports these import pathsConsider checking if there's a public API alternative to
_rsin the new package instead of relying on internal utilities.packages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsx (1)
1-1: 将 dynamicCSS 导入迁移到 @rc-component/util 与 PR 目标一致这一行仅替换了包名,
removeCSS/updateCSS的用法和调用位置保持不变,从语义上是无损迁移,符合统一收敛到@rc-component/util的目标。建议在本地跑一遍文档站构建与 SSR/测试(如果有),确认新的@rc-component/util/lib/Dom/dynamicCSS入口在所有打包环境下都能正常解析,避免此前评论里提到的 ES 模块Unexpected token 'export'报错再次出现。(根据历史 learnings,本次评审按中文回复。)
packages/x/.dumi/theme/common/styles/Common.tsx (1)
2-2:updateCSS路径更新保持行为不变这里同步改为从
@rc-component/util/lib/Dom/dynamicCSS引入updateCSS,与本 PR 其他文件的迁移方式保持一致,useInsertionEffect中的调用签名未变,运行时行为应与之前一致。合并前建议在文档站构建(含 SSR 或测试环境,如适用)中确认该入口在浏览器与 Node 侧都能正常加载,以规避 ES 模块export解析相关的问题。packages/x/components/_util/hooks/use-collapsible.ts (1)
1-2: 导入迁移符合 PR 目标,但需验证依赖和兼容性。这两行将
rc-motion和rc-util迁移到@rc-component/motion和@rc-component/util是正确的重构方向,符合 PR 的包体积优化目标。不过,鉴于 PR 评论中提到的 ES 模块错误("奇怪,咋es模块会报错
SyntaxError: Unexpected token 'export'"),建议验证以下几点:
- 确认
package.json中已正确添加新依赖包及其版本- 确认新旧包之间的 API 完全兼容(
CSSMotionProps类型定义和useMergedState函数签名)- 排查 ES 模块语法错误的根本原因(可能与包导出配置或构建配置有关)
packages/x/components/sender/components/Skill.tsx (2)
3-3: LGTM!从 classnames 迁移到 clsx 的改动正确。导入语法和使用方式都符合 clsx 的 API 规范,逻辑保持一致:始终应用基础类名,条件性地应用禁用状态类名。
Also applies to: 50-52
3-3: 验证 classnames 到 clsx 的迁移完整性和 ES 模块错误。根据 PR 评论中提到的 ES 模块语法错误,需要确认:
clsx依赖是否已正确添加到package.jsonclassnames依赖是否已完全移除- 整个代码库中的
classnames导入是否已全部迁移到clsx- 构建配置是否正确处理
clsx的 ES 模块格式建议检查是否存在遗漏的
classnames导入,并确保依赖配置和构建工具链已适当更新以支持clsx。packages/x/components/bubble/System.tsx (1)
1-1: clsx 导入与使用方式正确,迁移后行为在本组件内等价这里从
classnames迁移为clsx,并仅用于拼接一组可能为string | undefined的 className(hashId / cssVarCls / cls / prefixCls / contextConfig.className / classNames.root / className / rootClassName),在这种用法下clsx(...)与原来的classnames(...)行为一致,不会改变最终生成的 class 字符串。
import { clsx } from 'clsx';也是官方支持的写法(自 clsx ≥ 1.2.0 起提供与默认导出等价的 named export),只需确保仓库中依赖版本满足该前提即可。(github.com)建议本地确认当前
package.json中的clsx版本 ≥ 1.2.0;如后续升级到更高大版本,也请顺带跑一遍相关用例,确保SystemBubble渲染的 className 未发生意外变化。(基于 learnings,按约定使用中文回复。)Also applies to: 34-44
packages/x/components/sender/SlotTextArea.tsx (4)
147-159: LGTM!
clsx处理多个字符串参数的方式与classnames完全一致,这些简单的类名拼接用法迁移正确。
232-235: LGTM!条件类名的对象语法在
clsx中与classnames行为一致。
904-912: LGTM!混合使用字符串和条件对象的模式迁移正确,
clsx完全支持此 API。
2-4: Import changes are syntactically correct.The named export
import { clsx } from 'clsx'is valid—clsx supports both default and named exports in all versions (ESM and CJS). The@rc-component/util/lib/pickAttrspath follows the expected migration pattern.The ES module error (
SyntaxError: Unexpected token 'export') mentioned in PR comments is not caused by theclsximport syntax. If the error persists, investigate build/bundler configuration or other imports in the codebase.packages/x-sdk/.jest.js (1)
2-2: 配置更新与其他包保持一致。添加
@rc-component到编译模块列表的改动与 packages/x/.jest.js 保持一致,确保测试环境正确处理新的依赖包。packages/x-markdown/.jest.js (1)
2-2: 配置更新与其他包保持一致。添加
@rc-component到编译模块列表的改动与其他包的 Jest 配置保持一致,确保整个项目的测试环境统一处理 @rc-component 依赖。packages/x/.jest.js (1)
2-2: 配置更新正确,建议验证模块转换。添加
@rc-component到编译模块列表与 PR 的迁移目标一致。此配置确保新的 @rc-component 包在测试期间被正确转换。根据 PR 评论中提到的 ES 模块错误("奇怪,咋es模块会报错
SyntaxError: Unexpected token 'export'"),建议验证 transformIgnorePatterns 正则表达式是否正确处理作用域包(scoped packages)的路径结构。packages/x/.dumi/hooks/useThemeAnimation.ts (1)
1-1: Verify import migration to @rc-component/utilThe import path migration from
rc-utilto@rc-component/util/lib/Dom/dynamicCSScannot be fully verified at this time. Manual verification needed to confirm:
@rc-component/utilis listed as a dependency inpackage.json- The path
@rc-component/util/lib/Dom/dynamicCSSexists and exportsremoveCSSandupdateCSS- No other incomplete migrations from
rc-utilremain in this file or related filesOnce confirmed, this change appears logically sound given the function signatures and usage remain unchanged.
packages/x/components/_util/hooks/use-shortcut-keys.ts (1)
1-1: 验证新包 KeyCode 导出与旧包 API 的完全兼容性。导入路径从
rc-util/lib/KeyCode迁移到@rc-component/util/lib/KeyCode符合重构目标。请确保:
- 新包导出的
KeyCode对象包含本文件使用的所有属性(如KeyCode.ONE)和支持Object.entries()迭代- 确认 package.json 中
@rc-component/util的版本支持此 API- 搜索整个代码库,确保所有
rc-util/lib/KeyCode导入已完成迁移,避免混用两个包此外,建议联系 PR 作者了解提到的 ES 模块语法错误的具体上下文,确认是否与此导入路径相关。
packages/x/.dumi/theme/builtins/TokenCompare/index.tsx (2)
110-110: Unable to complete verification. The original review comment discusses a classNames to clsx refactor and raises valid concerns about ES module compatibility that require investigation, but these concerns were not conclusively resolved in the original comment. Manual verification by accessing the actual codebase is needed to confirm: (1) that clsx is properly declared as a dependency, (2) the module format of clsx in the project's build environment, and (3) whether the ES module syntax error is related to this change or an existing issue.
5-5: Import syntax for clsx migration is correct.Migrating from classnames to clsx is a sound optimization choice—clsx is significantly smaller (~239 B gzipped vs ~400–700 B for classnames) and offers better runtime performance while maintaining equivalent API compatibility. The named import syntax is correct.
However, verification of the following is needed:
- Confirm clsx is present in package.json dependencies
- Verify line 110 usage has been updated from
classNames()toclsx()- Ensure no remaining classnames imports exist in the codebase
packages/x/components/suggestion/index.tsx (3)
3-4: clsx 与 @rc-component/util 的引入方式看起来正确这里把
classnames/rc-util迁移为clsx和@rc-component/util,useEvent/useMergedState的签名和用法保持不变,看起来是一次机械替换,没有丢参数或逻辑。建议跑一下相关用例或 Storybook 场景,顺带确认之前提到的 ESMUnexpected token 'export'问题在当前依赖组合下已不存在。
174-184: CascaderrootClassName使用 clsx 聚合类名逻辑保持一致这里用
clsx聚合rootClassName、className、classNames.root、prefixCls、hashId、cssVarCls,以及基于block的修饰类,参数顺序与预期一致,没有明显的行为改变风险。这块我这边看是安全的迁移。
201-209: 内部 content 容器的 className 迁移到 clsx 无语义变化内部
<div>的className也改为通过clsx组合,仍然包含prefixCls、rootClassName、contextConfig.classNames.content、classNames.content、"${prefixCls}-content"、hashId和cssVarCls,没有丢失任何原有类名,属于等价替换。这一段改动看起来没有问题。packages/x/.dumi/theme/builtins/InstallDependencies/index.tsx (1)
2-2: 当前代码的 Tab 类型导入是正确的导入
Tab类型来自@rc-component/tabs/lib/interface是正确的做法。antd 的Tabs组件内部基于@rc-component/tabs构建,因此使用该库的Tab类型来定义items数组完全兼容。之前关于错误导入@rc-component/table的问题已得到解决。packages/x/components/sources/Sources.tsx (3)
94-106: clsx 迁移看起来正确
clsx的使用方式与classnames完全兼容,支持字符串、对象和数组参数。这里的迁移保持了相同的逻辑和行为,同时减小了包体积。
161-198: 其余 clsx 用法一致且正确Lines 161、175、184 和 198 处的
clsx用法都符合预期,与原classnames的行为一致。
2-7: @rc-component/ 包的 ESM/CJS 兼容性需要验证*搜索结果显示
@rc-component/motion可能存在 ESM/CJS 互操作性问题:该包可能仅暴露 ESM 构建,CommonJS 命名导出支持受限。行 2-3 的导入方式import { CSSMotionProps, CSSMotion }的可行性取决于项目构建配置和包的exports字段。建议验证:
@rc-component/motion和@rc-component/util的版本及其package.json中的exports字段- 项目
tsconfig.json的moduleResolution和module配置是否支持这些包的导出结构- PR 评论中的 ES 模块错误是否由这些导入引起,或是其他依赖问题
clsx 迁移可行性:搜索确认 clsx 是 classnames 的兼容替代品,但需要检查文件中 clsx 的具体使用模式,特别是是否存在深层嵌套数组的情况(classnames 会完全展平,clsx 行为可能不同)。
packages/x/components/sender/SenderHeader.tsx (2)
82-84: LGTM!clsx 迁移实现正确三处
clsx的使用都正确地替换了classNames:
- 第 82-84 行:正确处理了多个类名和条件 RTL 类
- 第 97 行和第 120 行:正确组合语义化类名
clsx的 API 与classNames完全兼容,且体积更小,符合 PR 的 bundle size 优化目标。Also applies to: 97-97, 120-120
2-4: 验证 @rc-component/motion 与 rc-motion 的兼容性迁移引入了正确的包变更,但需要确保版本一致性:根据官方文档,
@rc-component/motion与rc-motion在 API 上兼容(均导出 CSSMotion、CSSMotionList),但跨版本间可能存在破坏性变更。请检查package.json中两个包的主版本号是否匹配。至于 PR 评论中提到的 ES 模块语法错误,需要在完整的 PR 上下文中验证该错误是否与这些包的导入相关或已被解决。
packages/x/components/attachments/DropArea.tsx (1)
1-1:classnames→clsx迁移在本组件中语义等价,导入方式已验证
- 第 1 行的
import { clsx } from 'clsx';是有效的命名导出方式。clsx v2.1.1(当前最新版本)自 v1.2.0 起官方支持此导出形式,无需依赖esModuleInterop,与社区主流写法保持一致。- 第 77–79 行将
classnames(areaCls, className, {...})替换为clsx(areaCls, className, {...}),两个库在处理字符串参数和条件对象时的逻辑完全相同,因此不会改变生成的 className,也不会影响-on-body这类状态样式的挂载。整体来看,从导入方式到运行时行为,这个迁移都是安全且规范的。
Also applies to: 77-79
packages/x/components/actions/ActionsFeedback.tsx (1)
84-96: 根节点mergedCls使用clsx后语义与原先保持一致这里将原来的
classnames(...)换成clsx(...),参数顺序与内容(prefixCls、feedbackCls、hashId、cssVarCls、rootClassName、classNames.root、${prefixCls}-list、className以及 RTL 条件类)都保持不变,最终生成的类名集合与之前等价,可安全迁移。packages/x/components/code-highlighter/CodeHighlighter.tsx (4)
1-1: clsx 导入方式请确认是否与全仓统一这里使用的是
import { clsx } from 'clsx';,而社区里也有大量使用默认导入的写法(import clsx from 'clsx';)。请确认:
- 当前
clsx版本和类型定义是否显式导出了命名导出clsx;- 本仓库其他文件对
clsx的导入方式是否保持一致。如若类型检查或打包有问题,可以统一改为默认导入写法以避免兼容性隐患。
42-53: 根容器类名从 classnames 迁移到 clsx 实现等价
mergedCls使用 clsx 合并前缀、上下文 className、自身 className 以及 RTL 状态,语义与原先 classnames 版本一致,看起来没有行为变化风险。
69-73: Header 与 HeaderTitle 的 clsx 替换保持原有拼接逻辑Header 和 HeaderTitle 的
className都用 clsx 合并固定前缀和来自 contextConfig / props 的扩展类名,实现与原先 classnames 相同,层级和优先级也清晰,无额外逻辑问题。Also applies to: 77-81
104-104: 代码容器 className 的 clsx 迁移无行为差异
className={clsx(\${prefixCls}-code`, contextConfig.classNames?.code, classNames.code)}` 与旧的 classnames 用法等价,继续支持可选上下文类名和自定义类名覆盖,没发现额外问题。packages/x/.dumi/theme/builtins/ImagePreview/index.tsx (3)
83-86:previewClassName的 clsx 重写与原逻辑等价这里用
clsx(rootClassName, 'clearfix', 'preview-image-boxes', { ... })替代原先的 classnames 拼接方式,条件类:
preview-image-boxes-compare依赖comparablepreview-image-boxes-with-carousel依赖hasCarousel结构与语义都未改变,输出类名集合与旧实现等价,风险很低。
107-110:imageWrapperClassName条件类逻辑保持不变
clsx(imgWrapperCls, { good: coverMeta.isGood, bad: coverMeta.isBad })与原先基于 classnames 的实现完全对齐:
- 根据图片元信息打上
good/bad状态类,- 对于既是 good 又是 bad 的情况,会同时带两个类,与之前行为一致。
这部分实现简洁清晰,无需额外调整。
1-4:clsx的导入与用法方式正确
import { clsx } from 'clsx'和传入字符串及条件对象的使用方式都是官方支持的标准用法。clsx 会自动过滤 falsey 值并展平对象,使得{ foo: true, bar: false }→"foo"的逻辑正确。建议在整体 PR 级别确认以下变更:
package.json/pnpm-lock.yaml中rc-util是否已替换为@rc-component/utilclassnames是否已移除,clsx是否已正确添加为新依赖- 避免重复依赖或缺少依赖的情况
packages/x/.dumi/pages/index/components/SceneIntroduction/index.tsx (2)
231-235: 迁移正确,API使用兼容。
clsx的使用方式与classnames完全兼容,条件表达式的写法正确。这里的迁移不会影响功能,同时能够减小bundle体积。
3-3: clsx named import syntax is correct; verify build configuration if ES module errors occur.The import
import { clsx } from 'clsx'is valid—clsx has supported the named export since v1.2.0. However, if the PR encounters "SyntaxError: Unexpected token 'export'" errors, this is typically a module format mismatch in your build or test configuration, not a clsx-specific issue. Ensure your tsconfig, Jest, or bundler is configured to handle both ESM and CommonJS correctly.packages/x/.dumi/theme/builtins/InstallDependencies/bun.tsx (1)
2-2: [rewritten comment]
[classification tag]packages/x/components/conversations/Item.tsx (1)
2-2: ConversationsItem 中 pickAttrs / clsx 迁移整体语义保持不变
pickAttrs从 rc-util 迁移到@rc-component/util/lib/pickAttrs,调用方式与过滤配置(aria/data/attr)保持一致,DOM 属性透传行为应与之前相同。mergedCls改用clsx以字符串 + 对象形式组合类名,布尔条件控制 active/disabled 状态,与原本 classnames 写法等价,现有样式逻辑不会改变。建议在 Story 或 demo 里简单确认一次以下场景的最终
className:
- 普通项 / active 项 / disabled 项;
- 带外部
className和prefixCls的组合情况。Also applies to: 6-6, 46-51
packages/x/components/conversations/index.tsx (2)
1-2: 状态合并与根节点类名构建的依赖迁移看起来正确
useMergedState/pickAttrs从 rc-util 迁移到@rc-component/util的对应路径后,调用签名和用法保持不变:defaultActiveKey作为默认值、activeKey作为受控值、onChange回调仍在内部统一触发,行为应与之前一致。domProps = pickAttrs(restProps, { attr: true, aria: true, data: true })与旧实现一致,避免把无关 props 透传到<ul>上,语义正确。- 根节点
mergedCls使用clsx叠加prefixCls、上下文配置 className/classNames.root、外部className/rootClassName以及hashId/cssVarCls,再按方向条件加-rtl,叠加顺序合理、不会覆盖掉用户自定义类名。考虑到本 PR 里曾提到 ESM 报错 “Unexpected token 'export'”,建议在构建/测试配置里确认:
@rc-component/*与antd是否在需要时被编译/转译(比如 Next.js 的transpilePackages、jest/vitest 的transformIgnorePatterns等),避免因为升级 util 源头引入新的转译缺失问题。Also applies to: 4-4, 129-134, 146-156, 172-184
239-243: item / creation / group / list 上使用 clsx 合并类名的写法与原逻辑等价
ConversationsItem的className={clsx(classNames.item, contextConfig.classNames.item, baseConversationInfo.className)}:仍然是“全局配置 → 实例级配置 → 单项自定义 className”的叠加顺序,不会改变现有覆盖关系。Creation/GroupTitle的className={clsx(contextConfig.classNames.xxx, classNames.xxx)}让外部传入的classNames在语义上继续叠加在上下文配置之上,保持组件配置/场景覆盖能力。- 分组列表
className={clsx(\${prefixCls}-list`, { `${prefixCls}-group-collapsible-list`: groupInfo.collapsible })}` 也只是把 “允许折叠” 转成一个附加类,布尔对象写法与原先 classnames 完全兼容。这些改动不会改变现有渲染结果,更多是依赖收敛和体积优化层面的重构,建议在分组开启/关闭、可折叠/不可折叠几种场景下跑一下现有用例或 Story,确认 className 仍符合预期。
Also applies to: 279-283, 303-307
packages/x-markdown/package.json (1)
51-57: 依赖从classnames迁移到clsx看起来一致且必要本包 Markdown 组件在 PR 中已经改用
clsx合并 className,这里直接新增clsx运行时依赖是合理且与代码使用保持一致,没有额外行为变化需要担心。packages/x-sdk/src/x-chat/index.ts (1)
1-1:useEvent迁移到@rc-component/util保持了原有语义这里只是调整了
useEvent的来源,调用方式与依赖关系在文件内部保持不变,onRequest的行为应与原先rc-util版本一致。packages/x/components/bubble/Divider.tsx (1)
2-2:DividerBubble使用clsx合并类名实现等价
rootMergedCls由多段样式来源(hashId/cssVarCls、前缀类名、contextConfig/classNames/rootClassName 等)用clsx串起来,参数顺序合理,语义与原先classnames写法一致,不会影响渲染结果。Also applies to: 35-45
packages/x/.dumi/pages/index/common/Container.tsx (1)
2-2: 容器组件切换到clsx后行为保持不变
className={clsx(styles.container, props.className)}能正常处理props.className为undefined的情况,与原先classnames的行为等价,对外部使用Container的方式没有变化。Also applies to: 51-51
packages/x/components/mermaid/Mermaid.tsx (1)
3-3: Mermaid 组件改用clsx合并类名,覆盖面与条件逻辑正确
mergedCls中同时合并了前缀、上下文 className、语义化classNames.root、hashId/cssVarCls 以及 RTL 条件类,clsx对对象形式条件类支持良好,逻辑清晰。- header、graph、code 三处
className也都按之前结构迁移到clsx,包括renderType === RenderType.Code时隐藏 graph 的条件类名,行为与旧实现一致。Also applies to: 79-90, 272-277, 299-305, 314-318
packages/x/.dumi/pages/index/components/MainBanner.tsx (1)
3-3: 主站 Banner 使用clsx合并按钮和 Lottie 类名实现合理
- Start 按钮和 Design 按钮通过
clsx(styles.btn, styles.xxx)组合基类与变体类,便于后续扩展更多修饰 class。- Lottie 组件包装处
clsx(styles.lottie, direction === 'rtl' && styles.lottie_rtl)的条件类处理 RTL 场景,语义清晰,与原先classnames写法等价。Also applies to: 263-264, 268-269, 278-279
packages/x/components/actions/ActionsMenu.tsx (1)
3-3: ActionsMenu 使用clsx合并下拉菜单类名正确且易扩展
- Dropdown 的
className={clsx(\${prefixCls}-dropdown`, classNames.itemDropdown, dropdownProps?.className)}` 既保留了内部前缀,也兼容外部透传样式和语义化覆盖,顺序合理。- 内部 item 使用
clsx(\${prefixCls}-item`, `${prefixCls}-sub-item`, classNames?.item)` 也保持了原有结构,仅替换工具函数,无行为变化。Also applies to: 53-54, 60-61
packages/x/.dumi/theme/builtins/MarkdownPluginsOverView.tsx (1)
4-4: Fix CSS syntax error initemMetastyle and reviewclsxusage consistencyThe style at line 30 has an extra closing brace:
padding-inline: ${token.padding}px};should bepadding-inline: ${token.padding}px;. This invalid CSS prevents the property from being parsed correctly.The three instances of
className={clsx(styles.xxx)}are functionally correct and maintain consistency with the unifiedclsxapproach. While these could be simplified toclassName={styles.xxx}, keeping theclsxwrapper is acceptable for consistency.Apply the fix to the
itemMetastyle definition as shown in the diff. Verify whether similar CSS syntax errors with extra}exist elsewhere in the codebase (e.g., searching forpx};patterns).packages/x-sdk/package.json (1)
46-48: 将 @rc-component/util 放到 dependencies 里是合理的x-sdk 在运行时会直接使用 util,放在
dependencies而不是devDependencies符合预期,也和本次 rc-* → @rc-component/* 的重构目标一致。建议在这个包下单独跑一遍compile/test,确认新的 @rc-component/util 在打包和测试环境(father、jest、tsx 等)下都能正常解析模块格式(尤其是 ESM/CJS 差异)。Based on learnings, 使用中文进行代码评审。packages/x/.dumi/theme/slots/Content/ColumnCard.tsx (1)
4-4: ColumnCard 中从 classnames 迁移到 clsx 行为等价这里的改动只是在
ZhihuOutlined、YuqueOutlined、JuejinLogo三处把classNames(logo, 'xxx-logo')换成了clsx(logo, 'xxx-logo'),配合createStyles里&.xxx-logo的写法,最终生成的类名组合和原来一致,不会影响图标配色、布局或链接行为,属于安全的实现细节替换。Also applies to: 144-145, 178-179, 212-213
packages/x/components/file-card/components/ImageLoading.tsx (1)
2-2: ImageLoading 中 clsx 替换是 1:1,无行为变化外层容器、Skeleton.Node 的
rootClassName以及内部 Flex 的className都只是从 classnames 换成了 clsx,传入仍是原来的字符串与对象组合,生成的类名集合不变,percent文案和图标渲染逻辑也未改,整体属于安全迁移。如果后续再整理的话,可以考虑把mergeSinkProps之类的命名调整为更贴近含义(例如mergedSpinProps),纯属可选的小清理。Also applies to: 28-29, 40-41, 44-46
packages/x/components/thought-chain/Item.tsx (4)
129-143: 根容器 className 组合用 clsx 替换 classnames 合理这里把根节点的
className从原来的 classnames 切换到clsx,依次组合了prefixCls、hashId、className、cssVarCls、rootClassName、classNames?.root以及itemCls,并根据variant / onClick / status / direction条件附加修饰类,结构与原实现一致,没有丢失任何旧的 class,行为应保持不变。
156-159: 内容容器的 blink 动画 class 逻辑清晰且无行为变化
className={clsx(\${itemCls}-content`, { [`${prefixCls}-motion-blink`]: blink })}保留了原本的内容容器基础类,并在blink为 true 时附加`${prefixCls}-motion-blink``。这与 blink 动画样式的命名约定吻合,且不会影响未开启 blink 时的渲染。
160-177: 标题与描述节点的 clsx 迁移保持既有样式扩展点
- 标题节点:
className={clsx(\${itemCls}-title`, classNames?.title, { [`${itemCls}-title-with-description`]: description })},在保留基础类的前提下继续支持外部通过classNames?.title覆盖,并在存在description` 时附加修饰类,逻辑与原实现对齐。- 描述节点:
className={clsx(\${itemCls}-description`, classNames?.description)}同样保留了基础类和classNames?.description` 扩展点。整体看,这里从 classnames 迁移到 clsx 没有改变条件判断和可定制性,可以直接接受。
1-2: No change needed to the clsx importThe current named import
import { clsx } from 'clsx'is valid and supported. The clsx package exports both a default export and a named export aliasclsx, making both import styles functionally equivalent:
import clsx from 'clsx'(default import)import { clsx } from 'clsx'(named import)The named export was intentionally added to support TypeScript users who prefer to avoid the
esModuleInteropcompiler option. Either style will work correctly without runtime errors.Likely an incorrect or invalid review comment.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (3)
packages/x/components/_util/hooks/use-shortcut-keys.ts (1)
219-228: 清理函数中存在严重 bug:第 226 行应使用 removeEventListener。清理函数中的第 226 行错误地使用了
addEventListener而不是removeEventListener,这会导致每次组件重新渲染时都会累积keyup事件监听器,造成内存泄漏。虽然此问题与当前 PR 的迁移工作无关,但属于严重的运行时问题,建议立即修复。
应用以下 diff 修复此 bug:
useEffect(() => { if (flattenShortcutKeys.length === 0) return; document.addEventListener('keydown', onKeydown); document.addEventListener('keyup', onKeyup); return () => { document.removeEventListener('keydown', onKeydown); - document.addEventListener('keyup', onKeyup); + document.removeEventListener('keyup', onKeyup); }; }, [flattenShortcutKeys.length, observer]);packages/x/components/thought-chain/index.tsx (1)
54-68: 检测到重复的 className 属性在
mergedCls的clsx()调用中,className出现了两次(第 55 行和第 62 行)。这会导致相同的类名被添加两次,虽然最终渲染结果不会有问题(重复的类名会被浏览器忽略),但这是冗余的。建议应用以下修改移除重复项:
const mergedCls = clsx( - className, prefixCls, contextConfig.className, contextConfig.classNames.root, rootClassName, hashId, cssVarCls, className, classNames.root, `${prefixCls}-box`, { [`${prefixCls}-rtl`]: direction === 'rtl', }, );packages/x/.dumi/theme/builtins/MarkdownPluginsOverView.tsx (1)
29-31: itemMeta 样式中多余的}可能导致 CSS 属性失效
itemMeta的样式里:padding-inline: ${token.padding}px};末尾多了一个},生成后的 CSS 会类似padding-inline: 16px};,这是无效值,浏览器会忽略该属性。建议修正为:- itemMeta: css` - padding-inline: ${token.padding}px}; - `, + itemMeta: css` + padding-inline: ${token.padding}px; + `,以确保 padding 正常生效。
♻️ Duplicate comments (1)
packages/x/.dumi/components/SemanticPreview.tsx (1)
152-158: 单个类名无需使用clsx包裹当只有一个类名时,直接使用即可,无需
clsx函数调用。此问题已在之前的审查中指出。- <div className={clsx(styles.container)} ref={containerRef}> + <div className={styles.container} ref={containerRef}> <Row style={{ minHeight: height }}> - <Col span={16} className={clsx(styles.colWrap)}> + <Col span={16} className={styles.colWrap}> <XProvider theme={{ token: { motion: false } }}>{cloneNode}</XProvider> </Col> <Col span={8}> - <ul className={clsx(styles.listWrap)}> + <ul className={styles.listWrap}>以及第 182 行:
- className={clsx(styles.listItem)} + className={styles.listItem}Also applies to: 182-182
🧹 Nitpick comments (2)
packages/x/components/mermaid/Mermaid.tsx (1)
3-3: Consider aligning clsx import style with package conventions (stylistic, not critical)The current import
import { clsx } from 'clsx';is valid and supported. However, clsx examples typically show the default import pattern:import clsx from 'clsx';. For consistency with common usage patterns and the package's primary export, consider adopting the default import style.-import { clsx } from 'clsx'; +import clsx from 'clsx';Note: Both styles are equivalent; this is a stylistic preference rather than a functional issue.
packages/x/components/conversations/index.tsx (1)
1-2: Conversations 中 rc-util → @rc-component/util 与 clsx 迁移整体合理
useMergedState与pickAttrs改为从@rc-component/util引入后,调用参数仍为{ value, onChange }和{ attr: true, aria: true, data: true },mergedActiveKey的受控/非受控逻辑与 DOM 属性过滤行为都保持一致。- 根
mergedCls、每个ConversationsItem、Creation、分组GroupTitle以及内部列表类名统一改用clsx合并,保留了prefixCls、contextConfig.classNames.*、外部classNames.*、rootClassName和 RTL 标记,类名顺序也基本与之前一致,样式语义不会改变。- 如果后续
useXComponentConfig('conversations')允许缺省classNames,可以考虑将若干访问改为可选链(例如contextConfig.classNames?.root),做一点防御式处理,但这属于小优化,不影响当前实现。Also applies to: 4-4, 172-184, 239-243, 279-283, 303-307
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (105)
-
package.json(1 hunks) -
packages/x-markdown/.jest.js(1 hunks) -
packages/x-markdown/package.json(1 hunks) -
packages/x-markdown/src/XMarkdown/index.tsx(2 hunks) -
packages/x-markdown/tests/setup.ts(1 hunks) -
packages/x-markdown/tests/setupAfterEnv.ts(1 hunks) -
packages/x-sdk/.jest.js(1 hunks) -
packages/x-sdk/package.json(1 hunks) -
packages/x-sdk/src/x-chat/index.ts(1 hunks) -
packages/x-sdk/tests/setup.ts(1 hunks) -
packages/x-sdk/tests/utils.tsx(1 hunks) -
packages/x/.dumi/components/SemanticPreview.tsx(4 hunks) -
packages/x/.dumi/hooks/useMenu.tsx(2 hunks) -
packages/x/.dumi/hooks/useThemeAnimation.ts(1 hunks) -
packages/x/.dumi/pages/index/common/Container.tsx(2 hunks) -
packages/x/.dumi/pages/index/components/DesignGuide.tsx(2 hunks) -
packages/x/.dumi/pages/index/components/MainBanner.tsx(3 hunks) -
packages/x/.dumi/pages/index/components/SceneIntroduction/index.tsx(2 hunks) -
packages/x/.dumi/pages/index/index.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/IconSearch/CopyableIcon.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/ImagePreview/index.tsx(3 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/bun.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/index.tsx(1 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/npm.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/pnpm.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/utoo.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/yarn.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/MarkdownPluginsOverView.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/Previewer/CodePreviewer.tsx(3 hunks) -
packages/x/.dumi/theme/builtins/TokenCompare/index.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/VideoPlayer/index.tsx(2 hunks) -
packages/x/.dumi/theme/common/Color/ColorPalettes.tsx(2 hunks) -
packages/x/.dumi/theme/common/PrevAndNext.tsx(3 hunks) -
packages/x/.dumi/theme/common/styles/Common.tsx(1 hunks) -
packages/x/.dumi/theme/layouts/DocLayout/index.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Content/ColumnCard.tsx(4 hunks) -
packages/x/.dumi/theme/slots/Content/Contributors.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Content/DocAnchor.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Content/index.tsx(2 hunks) -
packages/x/.dumi/theme/slots/ContentTabs/index.tsx(1 hunks) -
packages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsx(1 hunks) -
packages/x/.dumi/theme/slots/Header/Actions.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Header/Logo.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Header/Navigation.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Header/SwitchBtn.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Header/index.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Sidebar/index.tsx(1 hunks) -
packages/x/.jest.js(1 hunks) -
packages/x/components/_util/hooks/use-collapsible.ts(1 hunks) -
packages/x/components/_util/hooks/use-shortcut-keys.ts(1 hunks) -
packages/x/components/_util/motion.ts(1 hunks) -
packages/x/components/_util/warning.ts(1 hunks) -
packages/x/components/actions/ActionsAudio.tsx(2 hunks) -
packages/x/components/actions/ActionsCopy.tsx(2 hunks) -
packages/x/components/actions/ActionsFeedback.tsx(4 hunks) -
packages/x/components/actions/ActionsItem.tsx(2 hunks) -
packages/x/components/actions/ActionsMenu.tsx(2 hunks) -
packages/x/components/actions/Item.tsx(2 hunks) -
packages/x/components/actions/index.tsx(4 hunks) -
packages/x/components/attachments/DropArea.tsx(2 hunks) -
packages/x/components/attachments/FileList/index.tsx(4 hunks) -
packages/x/components/attachments/PlaceholderUploader.tsx(2 hunks) -
packages/x/components/attachments/index.tsx(6 hunks) -
packages/x/components/bubble/Bubble.tsx(6 hunks) -
packages/x/components/bubble/BubbleList.tsx(3 hunks) -
packages/x/components/bubble/Divider.tsx(2 hunks) -
packages/x/components/bubble/EditableContent.tsx(1 hunks) -
packages/x/components/bubble/System.tsx(2 hunks) -
packages/x/components/bubble/TypingContent.tsx(2 hunks) -
packages/x/components/bubble/hooks/useTyping.ts(1 hunks) -
packages/x/components/code-highlighter/CodeHighlighter.tsx(4 hunks) -
packages/x/components/conversations/Creation.tsx(2 hunks) -
packages/x/components/conversations/GroupTitle.tsx(3 hunks) -
packages/x/components/conversations/Item.tsx(2 hunks) -
packages/x/components/conversations/__tests__/index.test.tsx(1 hunks) -
packages/x/components/conversations/demo/shortcutKeys.tsx(1 hunks) -
packages/x/components/conversations/hooks/useCreation.tsx(2 hunks) -
packages/x/components/conversations/index.tsx(5 hunks) -
packages/x/components/file-card/FileCard.tsx(5 hunks) -
packages/x/components/file-card/List.tsx(4 hunks) -
packages/x/components/file-card/components/File.tsx(3 hunks) -
packages/x/components/file-card/components/ImageLoading.tsx(3 hunks) -
packages/x/components/mermaid/Mermaid.tsx(5 hunks) -
packages/x/components/prompts/index.tsx(6 hunks) -
packages/x/components/sender/SenderHeader.tsx(4 hunks) -
packages/x/components/sender/SenderSwitch.tsx(3 hunks) -
packages/x/components/sender/SlotTextArea.tsx(5 hunks) -
packages/x/components/sender/TextArea.tsx(2 hunks) -
packages/x/components/sender/__tests__/use-speech.test.tsx(1 hunks) -
packages/x/components/sender/components/ActionButton.tsx(2 hunks) -
packages/x/components/sender/components/LoadingButton.tsx(2 hunks) -
packages/x/components/sender/components/Skill.tsx(2 hunks) -
packages/x/components/sender/hooks/use-speech.ts(1 hunks) -
packages/x/components/sender/index.tsx(5 hunks) -
packages/x/components/sources/Sources.tsx(6 hunks) -
packages/x/components/sources/components/CarouselCard.tsx(3 hunks) -
packages/x/components/suggestion/index.tsx(3 hunks) -
packages/x/components/suggestion/useActive.ts(1 hunks) -
packages/x/components/think/Think.tsx(4 hunks) -
packages/x/components/thought-chain/Item.tsx(4 hunks) -
packages/x/components/thought-chain/Node.tsx(5 hunks) -
packages/x/components/thought-chain/Status.tsx(2 hunks) -
packages/x/components/thought-chain/index.tsx(4 hunks) -
packages/x/components/welcome/index.tsx(6 hunks) -
packages/x/docs/playground/ultramodern.tsx(2 hunks)
🚧 Files skipped from review as they are similar to previous changes (67)
- packages/x/components/conversations/tests/index.test.tsx
- packages/x/components/conversations/hooks/useCreation.tsx
- packages/x/components/bubble/System.tsx
- packages/x/.dumi/theme/slots/Header/Navigation.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/bun.tsx
- packages/x/components/bubble/Divider.tsx
- packages/x-markdown/tests/setupAfterEnv.ts
- packages/x/components/actions/Item.tsx
- packages/x/components/sender/SenderHeader.tsx
- packages/x/.dumi/theme/slots/Content/Contributors.tsx
- packages/x/.dumi/pages/index/components/SceneIntroduction/index.tsx
- packages/x/docs/playground/ultramodern.tsx
- packages/x/components/attachments/DropArea.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/yarn.tsx
- packages/x/components/welcome/index.tsx
- packages/x/components/sender/SenderSwitch.tsx
- packages/x/components/sources/components/CarouselCard.tsx
- packages/x/.dumi/theme/layouts/DocLayout/index.tsx
- packages/x/components/attachments/FileList/index.tsx
- packages/x/.dumi/theme/common/PrevAndNext.tsx
- packages/x/components/bubble/hooks/useTyping.ts
- packages/x/.dumi/theme/builtins/ImagePreview/index.tsx
- packages/x/components/conversations/GroupTitle.tsx
- packages/x/.dumi/theme/slots/Content/ColumnCard.tsx
- packages/x/.dumi/theme/slots/ContentTabs/index.tsx
- packages/x/components/actions/ActionsFeedback.tsx
- packages/x/components/_util/warning.ts
- packages/x/components/sender/components/LoadingButton.tsx
- packages/x/.dumi/theme/builtins/TokenCompare/index.tsx
- packages/x/components/sources/Sources.tsx
- packages/x-markdown/package.json
- packages/x/.dumi/theme/slots/Header/index.tsx
- packages/x/components/prompts/index.tsx
- packages/x/components/conversations/Item.tsx
- packages/x-sdk/src/x-chat/index.ts
- packages/x/.dumi/hooks/useThemeAnimation.ts
- packages/x/components/file-card/components/ImageLoading.tsx
- packages/x/components/sender/TextArea.tsx
- packages/x/components/sender/index.tsx
- packages/x/components/thought-chain/Node.tsx
- packages/x/components/attachments/index.tsx
- packages/x/.dumi/pages/index/common/Container.tsx
- packages/x/components/conversations/demo/shortcutKeys.tsx
- packages/x/components/suggestion/useActive.ts
- packages/x/components/actions/ActionsAudio.tsx
- packages/x/components/actions/ActionsItem.tsx
- packages/x/components/file-card/List.tsx
- packages/x/.dumi/theme/slots/Header/Logo.tsx
- packages/x/components/thought-chain/Status.tsx
- packages/x/.dumi/pages/index/components/DesignGuide.tsx
- packages/x/.dumi/hooks/useMenu.tsx
- packages/x/.dumi/theme/builtins/VideoPlayer/index.tsx
- packages/x/components/bubble/EditableContent.tsx
- packages/x/components/file-card/FileCard.tsx
- packages/x/.dumi/theme/slots/Content/index.tsx
- packages/x/.dumi/pages/index/index.tsx
- packages/x/components/_util/hooks/use-collapsible.ts
- packages/x/components/bubble/TypingContent.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/npm.tsx
- packages/x/.dumi/theme/slots/Content/DocAnchor.tsx
- packages/x/components/attachments/PlaceholderUploader.tsx
- packages/x/components/actions/ActionsCopy.tsx
- packages/x-markdown/src/XMarkdown/index.tsx
- packages/x-markdown/tests/setup.ts
- packages/x/.dumi/theme/builtins/InstallDependencies/index.tsx
- packages/x/components/actions/ActionsMenu.tsx
- packages/x/.dumi/theme/builtins/IconSearch/CopyableIcon.tsx
🧰 Additional context used
🧠 Learnings (2)
📓 Common learnings
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时,需要用中文回复中文评论。该项目的文档支持中英双语。
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时,需要用中文回复中文评论。该项目的文档支持中英双语。
📚 Learning: 2024-11-23T15:50:20.802Z
Learnt from: YumoImer
Repo: ant-design/x PR: 223
File: package.json:224-224
Timestamp: 2024-11-23T15:50:20.802Z
Learning: `rc-drawer` 依赖在 `.dumi/theme/layouts/SidebarLayout` 文件中被使用,是项目中的必要依赖,今后不应建议移除。
Applied to files:
packages/x/.dumi/theme/common/styles/Common.tsxpackages/x/.dumi/theme/slots/Sidebar/index.tsxpackages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsx
🧬 Code graph analysis (2)
packages/x/components/thought-chain/Item.tsx (1)
packages/x/components/style/motion/blink.ts (1)
blink(4-25)
packages/x/.dumi/pages/index/components/MainBanner.tsx (1)
packages/x/.dumi/theme/utils.ts (1)
getLocalizedPathname(123-151)
⏰ 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). (2)
- GitHub Check: build preview
- GitHub Check: size
🔇 Additional comments (45)
packages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsx (1)
1-1: 将rc-util动态样式工具迁移到@rc-component/util看起来合理这一行从
rc-util/lib/Dom/dynamicCSS切到@rc-component/util/lib/Dom/dynamicCSS,调用方式与参数签名保持不变,对InfoNewVersion的运行时行为应无影响,符合本 PR 的依赖迁移目标。建议在本地确认以下两点:
@rc-component/util中的removeCSS/updateCSS是否与旧实现保持同名同路径导出(尤其是lib/Dom/dynamicCSS的相对路径)。- 构建后的 ESM/CJS 产物不会再出现你之前提到的
SyntaxError: Unexpected token 'export'之类问题(跑一遍 dumi 文档站或打包即可确认)。如果这两个点都没问题,这个变更就可以放心合入。
packages/x/components/sender/__tests__/use-speech.test.tsx (1)
5-12: jest.mock 路径更新与依赖迁移目标一致将 mock 源从
'rc-util'改为'@rc-component/util'与本 PR 的依赖迁移保持一致,mock 结构也仍然提供useEvent与useMergedState,对现有用例行为没有功能性影响,看起来是安全的依赖重定向。
Based on learnings.packages/x/.dumi/theme/common/styles/Common.tsx (1)
2-13: 导入路径迁移到 @rc-component/util 看起来正确
updateCSS从rc-util/lib/Dom/dynamicCSS迁到@rc-component/util/lib/Dom/dynamicCSS,调用方式保持不变,符合本 PR 统一迁移 rc-* 到 @rc-component/* 的目标,整体行为应保持一致,没有看到额外风险。
Based on learnings, 使用中文回复。packages/x/.dumi/theme/slots/Sidebar/index.tsx (1)
2-2: 引入 @rc-component/drawer 的方式看起来正确本文件只是把
MobileMenu的来源从rc-drawer切到@rc-component/drawer,组件用法保持不变,这里逻辑没有问题,也符合本 PR 的依赖迁移目标。建议顺带确认两点:
package.json中已正确新增@rc-component/drawer依赖并移除旧的rc-drawer(或按项目规划保留)。- 文档站 / dumi 构建以及可能的 SSR 环境对
@rc-component/drawer的 ESM/CJS 解析没有问题,之前提到的SyntaxError: Unexpected token 'export'现在应已通过 CI 和本地构建验证。(基于 learnings,这里只检查从
rc-drawer到@rc-component/drawer的迁移正确性,不建议移除该类依赖本身。)packages/x/.dumi/theme/common/Color/ColorPalettes.tsx (1)
1-1: No changes required. Theimport { clsx } from 'clsx'syntax is valid and officially supported.Since clsx v1.2.0, the package exports both a default export and a named export alias. Both import styles are functionally equivalent and documented:
import clsx from 'clsx';import { clsx } from 'clsx';The named import will work correctly at runtime, and the usage on line 84 is valid.
Likely an incorrect or invalid review comment.
packages/x/components/_util/hooks/use-shortcut-keys.ts (1)
1-1: 验证 @rc-component/util 包的 KeyCode 导出兼容性。该导入路径迁移与 PR 目标一致(rc-util → @rc-component/util)。由于 PR 评论中提到过 ES 模块相关的问题,建议确保新包的
KeyCode导出与原包 API 完全兼容,特别是第 40 行的KeyCode.ONE和第 55 行的Object.entries(KeyCode)用法。packages/x/components/thought-chain/Item.tsx (2)
129-143: clsx 迁移正确无误所有
clsx()的使用都正确地替换了原来的classnames(),包括:
- 对象语法用于条件类名(如
{ [className]: condition })- 多参数传递
- 字符串和对象的混合使用
这些用法在
clsx中都得到完全支持,不会引入任何功能变化。Also applies to: 156-158, 163-165, 173-173
1-2: 验证新包版本兼容性和安全性从
rc-util迁移到@rc-component/util以及用clsx替代classnames的变更符合 PR 目标。导入语句正确指向新包。建议在合并前确认:
@rc-component/util和clsx包在项目依赖中正确声明- 新包版本与项目其他依赖兼容
- npm 安装成功且无版本冲突
packages/x/components/thought-chain/index.tsx (2)
1-2: 导入迁移正确与
Item.tsx中的变更一致,从rc-util迁移到@rc-component/util,并引入clsx替代classnames。
109-112: clsx 使用正确在 Context Provider 的
classNames对象和ThoughtChainNode组件的className属性中正确使用了clsx()进行类名合并。迁移符合预期。Also applies to: 127-127
packages/x/components/file-card/components/File.tsx (2)
38-41: classnames → clsx 的调用迁移是等价的,逻辑保持不变
mergedCls以及 icon/name/description 处的clsx调用方式与原先classnames(...)的模式一致:字符串 + 可选字符串 + 条件对象,classNames.*可能为undefined的情况也会被clsx自动忽略,不会引入多余空格或错误类名。整体看这里纯属工具替换,没有行为变化,组件的交互和样式控制逻辑保持不变。Also applies to: 56-69
1-1: Clsx import approach is sound; verify dependency migration completenessThe change to
import { clsx } from 'clsx';aligns with the usage patterns below and poses no semantic issues. From this file's perspective, the migration is safe. However, confirm two key points:
package.jsonincludes the newclsxdependency and has removedclassnames(or confirmed it's no longer referenced in production code).- No orphaned
classnamesimports remain elsewhere in the repository to avoid bundle bloat from dual libraries.Before merging, verify:
- All
classnamesimports have been replaced or removed across the codebasepackage.jsoncorrectly declaresclsxand no longer listsclassnamesas a dependency- No production code still references the old library
packages/x/components/mermaid/Mermaid.tsx (1)
79-90: clsx 合并类名逻辑与原 classnames 保持一致,语义清晰
mergedCls、header / graph / code 几处className={clsx(...)}
- 都只传入字符串、可选字符串与布尔条件对象;
- 继续包含
prefixCls、语义 classNames(root/header/graph/code)、hashId、cssVarCls和 RTL 修饰类;- 不引入额外条件或顺序变化。
整体看起来只是从
classnames平移到clsx,不会改变渲染结果,改动是安全的。👍Also applies to: 272-276, 299-304, 314-318
packages/x-sdk/tests/setup.ts (1)
44-48: 注释更新与依赖迁移一致,行为保持不变这里仅把说明从 rc-motion 更新为
@rc-component/motion,下方 AnimationEvent / TransitionEvent 的 polyfill 实现未改,仍可兼容 css-animation 与 motion 依赖,没问题。(根据长期学习记录,本次评审统一使用中文回复。)建议在 CI 或本地跑一遍 x-sdk 相关动画用例,顺带确认迁移到
@rc-component/motion后没有额外 warning。packages/x/components/_util/motion.ts (1)
1-6: motion 类型导入迁移到 @rc-component/motion,逻辑不变
CSSMotionProps、MotionEventHandler、MotionEndEventHandler以及MotionEvent改为从@rc-component/motion及其lib/interface导入,与本 PR 其它 @rc-component 迁移保持一致,只影响类型检查,不变更运行时逻辑。请在本地跑一遍 TypeScript 构建或相关单测(例如
tsc -b/ motion 相关测试),确认@rc-component/motion/lib/interface路径在当前版本下可正常解析。packages/x/components/sender/hooks/use-speech.ts (1)
1-1: use-speech Hook 引用迁移到 @rc-component/util,行为保持
useEvent和useMergedState的来源替换为@rc-component/util,Hook 内部逻辑未改,预期行为应与之前一致。请确认
packages/x/package.json中已移除rc-util并添加了匹配版本的@rc-component/util,并跑一遍 sender 相关用例,确保语音控制逻辑(受控/非受控、权限监听)正常。package.json (1)
18-18: prepare 脚本改为直接运行 husky,符合新版本用法在已升级到
husky@^9.1.6的前提下,把"prepare"从husky install改为husky是符合官方推荐的配置方式,简化了初始化流程,没问题。建议在全新 clone 的环境执行一次
npm install/pnpm install,确认 Git hooks 会按预期自动生成并生效。packages/x/.dumi/theme/builtins/InstallDependencies/utoo.tsx (1)
2-2: UtooIcon 使用 clsx 组装 className,等价替换将
classNames(styles.iconWrap, className)替换为clsx(styles.iconWrap, className),参数列表保持不变,对于字符串和可选外部className的组合,clsx 与原 classnames 行为一致。(github.com)请确认根包和
packages/x中已统一引入clsx依赖,并确保 dumi 主题构建及文档站点在此改动后可以正常编译、渲染。Also applies to: 24-24
packages/x/components/conversations/Creation.tsx (1)
1-1: Creation 组件切换到 clsx 组装 className,逻辑保持一致
className由clsx(prefixCls, className, \${prefixCls}-${mergeAlign}`, { `${prefixCls}-disabled`: disabled })` 构造,参数结构与原先 classnames 版本一致,按钮禁用态的样式开关逻辑不变。(github.com)只要外部始终传入有效的
prefixCls,生成的各类${prefixCls}-*class 都会符合预期;建议在常见 align 组合(start/center/end)和 disabled 状态下简单回归一下 UI。Also applies to: 51-53
packages/x-sdk/tests/utils.tsx (1)
1-2: 测试工具改用 @rc-component/resize-observer,逻辑不变但依赖内部导出
onEsResize/onLibResize的来源仅从rc-resize-observer切换到@rc-component/resize-observer,triggerResize仍通过_rs触发观察回调,测试语义保持不变。@rc-component/resize-observer本身就是 rc-resize-observer 的 scoped 版本,API 结构基本延续。(npmjs.com)这里依赖了
utils/observerUtil的内部_rs导出,如果后续库内部结构有调整,问题会优先在测试里暴露;建议在依赖升级时关注一下该文件是否还能正常通过编译与测试。packages/x/.dumi/pages/index/components/MainBanner.tsx (1)
3-3: MainBanner 使用 clsx 统一处理 className,行为与原先一致
MainBanner中按钮与 Lottie 的className构造都由 classnames 换成了clsx:按钮使用clsx(styles.btn, styles.startBtn/designBtn),动画使用clsx(styles.lottie, direction === 'rtl' && styles.lottie_rtl),这些都是 clsx 官方推荐的典型用法,生成结果与旧实现等价。(github.com)建议在文档站切换中/英文及 RTL 场景下简单手测 Banner:确认按钮样式和 RTL 布局下的 Lottie 位置与预期一致即可。
Also applies to: 263-279
packages/x/components/suggestion/index.tsx (1)
3-4: Suggestion 中 clsx 与 @rc-component/util 迁移语义保持一致
useMergedState/useEvent改为从@rc-component/util引入后,用法与原先 rc-util 版本一致;rootClassName和内容容器的类名合并改用clsx,顺序与之前保持一致,RTL 与 block 等状态类名逻辑不变,看起来不会影响行为或样式。前提是依赖中使用的 clsx 版本支持命名导出({ clsx })。Also applies to: 93-100, 107-116, 174-184, 201-209
packages/x/components/sender/components/ActionButton.tsx (1)
2-2: ActionButton 使用 clsx 组合类名方式正确
className={clsx(prefixCls, className, { [${prefixCls}-disabled]: mergedDisabled })}与之前的 classnames 调用语义一致,仍然只在禁用时追加-disabled类,行为与视觉都应保持不变。Also applies to: 52-54
packages/x/components/sender/components/Skill.tsx (1)
3-3: Skill 关闭按钮迁移到 clsx 后行为保持一致关闭按钮的类名从 classnames 切换到
clsx,依旧只在config.disabled为 true 时附加-close-disabled类名,点击禁用时提前 return 的逻辑未改动,整体语义一致。Also applies to: 50-52
packages/x/.dumi/theme/builtins/MarkdownPluginsOverView.tsx (1)
4-4: MarkdownPluginsOverView 中 clsx 替换保持原有样式语义
styles.container、styles.item、styles.itemMeta现在通过clsx传入,当前都是单一类名,和直接传字符串等价,也方便后续需要时按条件合并更多类名,对现有布局不会有影响。Also applies to: 58-58, 63-67
packages/x/.dumi/theme/builtins/InstallDependencies/pnpm.tsx (1)
2-2: PnpmIcon 中 clsx 替换行为正确
<span className={clsx(styles.iconWrap, className)} />与原来的 classnames 用法等价,既保证了基础样式iconWrap,也能安全地附加外部传入的className,不会改变现有渲染效果。Also applies to: 24-24
packages/x/components/code-highlighter/CodeHighlighter.tsx (1)
1-1: CodeHighlighter 中类名合并迁移到 clsx 无语义变化根节点的
mergedCls以及 header、header title 和 code 容器的类名现在都通过clsx合并,依旧包含prefixCls、contextConfig.classNames.*、外部classNames.*与hashId/cssVarCls,RTL 时才追加-rtl,整体逻辑与原来的 classnames 版本一致。Also applies to: 42-53, 69-73, 77-81, 104-105
packages/x/.dumi/theme/builtins/Previewer/CodePreviewer.tsx (1)
6-6: CodePreviewer 中 clsx 及 @rc-component/util 依赖迁移看起来正确
codeBoxClass和highlightClass现在通过clsx合并,基类(code-box/highlight-wrapper)加上若干布尔状态类(如expand、highlight-wrapper-expand)的逻辑与原来的 classnames 版本一致,不会影响展开/收起行为。- codesandbox 生成的
package.json里新增了'@rc-component/util': pkgDependencyList['@rc-component/util'],与主包使用的新依赖保持一致,有利于在线示例在 CodeSandbox 上正常运行。建议确认pkgDependencyList中已包含该键,否则可能会生成没有版本号的依赖项。Also applies to: 163-167, 170-172, 295-301
packages/x/components/sender/SlotTextArea.tsx (4)
2-4: 导入迁移正确从
rc-util迁移到@rc-component/util,从classnames迁移到clsx的改动符合 PR 目标。
147-156: clsx 使用合理这两处
clsx调用都用于组合多个类名,使用方式正确。
232-235: 条件类名组合正确使用
clsx处理带条件的类名组合,逻辑清晰。
904-912: 主容器类名组合正确使用
clsx组合多个类名并处理 RTL 方向条件,实现合理。packages/x/components/think/Think.tsx (2)
2-6: 依赖迁移完整正确迁移了所有依赖:
rc-motion→@rc-component/motionrc-util→@rc-component/utilclassnames→clsx
92-103: clsx 类名组合实现正确所有
clsx调用都用于组合多个类名或处理条件类名,符合最佳实践。Also applies to: 132-142, 148-158
packages/x/.dumi/components/SemanticPreview.tsx (1)
204-208: 多条件类名组合使用正确此处
clsx用于组合多个类名并处理条件逻辑,使用恰当。packages/x/components/actions/index.tsx (2)
1-4: 依赖迁移正确正确迁移了
CSSMotion、pickAttrs、composeRef到@rc-component包,并引入clsx替代classnames。
57-69: clsx 用法正确所有
clsx调用都用于组合多个类名,包括:
- 根容器的多类名组合与 RTL 条件
- Context 中的类名合并
- 列表容器的 variant 和 motion 类名组合
Also applies to: 99-103, 112-116
packages/x-markdown/.jest.js (1)
1-14: Jest 配置更新正确添加
@rc-component到compileModules数组是必要的,确保 Jest 能正确转换@rc-component/*包的 ESM 模块。packages/x-sdk/package.json (1)
46-48: 依赖从 rc-util 迁移到 @rc-component/util 看起来合理这里直接用
@rc-component/util作为 runtime 依赖,和本仓库其它包的迁移方向一致,没有额外风险点可见。建议同时确认 lockfile 与实际源码中的 import(如@rc-component/util/lib/*/es/*)已经全部对齐,避免构建时出现版本或路径不一致的问题。packages/x/.jest.js (1)
1-35: 在 Jest 中编译 @rc-component 模块的设置是必要且正确的把
'@rc-component'加入compileModules,可以让@rc-component/*相关依赖不被transformIgnorePatterns排除,从而通过codePreprocessor正确转译,解决 ES Module 下export报错的问题,同时与 SDK 等其它配置保持一致,整体配置是合理的。建议本次改动完成后在
packages/x下跑一遍 Jest,以确认所有@rc-component/*相关测试都能正常通过(尤其是之前报过Unexpected token 'export'的用例)。packages/x/.dumi/theme/slots/Header/Actions.tsx (1)
4-5: HeaderActions 从 classnames 迁移到 clsx 实现正常
className合并仅使用字符串和简单的布尔条件(如props.isMini && styles.mini),在 clsx 下语义与原先 classnames 保持一致,整体渲染行为不会变化,改动符合本 PR 的重构目标。Also applies to: 153-160
packages/x-sdk/.jest.js (1)
1-26: 在 x-sdk 的 Jest 配置中加入 @rc-component 也是必要的这里与
packages/x/.jest.js保持了同样的compileModules策略,使得 SDK 中使用的@rc-component/*依赖同样会被 Jest 转译,避免 ESM 语法在测试中出错,改动方向正确。建议在
packages/x-sdk下单独执行一次 Jest,确认 SDK 相关用例在新的 @rc-component 依赖下也能全部通过。packages/x/.dumi/theme/slots/Header/SwitchBtn.tsx (1)
1-5: LangBtn 中 omit 与 clsx 的迁移保持了原有行为
omit(rest, ['className'])仍然只剔除className,不会影响其它透传到 Button 的属性。- 两个
<span>的className只组合labelStyle与根据value选择的样式,在 clsx 下与原先 classnames 的条件合并行为一致,不会改变渲染结果。整体来看,这是一次纯粹的依赖与工具函数替换,逻辑保持不变。
Also applies to: 75-96
packages/x/components/bubble/BubbleList.tsx (1)
1-3: BubbleList 里对 @rc-component/util 与 clsx 的迁移是等价替换
pickAttrs(restProps, { attr: true, aria: true })的用法不变,只是从@rc-component/util/es引入,符合整仓库的迁移方向。mergedClassNames及滚动容器的className只组合字符串和基于autoScroll的布尔条件,使用 clsx 能一一对应原先 classnames 的行为,不会引入样式缺失或多余的 class。整体改动属于无行为差异的重构,逻辑上是安全的。
Also applies to: 131-135, 150-160, 214-221
packages/x/components/bubble/Bubble.tsx (1)
1-3: Bubble 组件中 pickAttrs 与多个 className 迁移到 clsx 的实现是等价的
- 根节点
rootMergedCls、内容区、各个 slot(header/footer/avatar/extra/body)的类名现在统一通过 clsx 组合,仅使用字符串和布尔条件,对应到 clsx 是完全支持的常规模式,不会改变原有 class 输出。getSlotClassName抽象继续保留,只是内部改为 clsx,更便于后续维护。pickAttrs(restProps, { attr: true, aria: true, data: true })的使用方式与之前一致,只是依赖源迁移到了@rc-component/util。整体来看,这些改动是 API 等价、行为不变的重构,符合本 PR 目标。
Also applies to: 72-93, 150-169, 195-201, 233-243
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (1)
packages/x/components/bubble/hooks/useCompatibleScroll.ts (1)
55-62: 清理逻辑使用可选链是安全的,但可以顺手收紧一下实现这块改成可选链后语义与原来基本一致,没有功能性问题。不过既然已经在动这段代码,可以考虑顺便把引用的清理做得更彻底一些:即使
parentNode已被外部移除,也把sentinelRef.current置为null,避免遗留一个失效的 DOM 引用,同时减少重复访问sentinelRef.current,例如:- if (sentinelRef.current?.parentNode) { - sentinelRef.current.parentNode.removeChild(sentinelRef.current); - sentinelRef.current = null; - } + const sentinel = sentinelRef.current; + if (sentinel?.parentNode) { + sentinel.parentNode.removeChild(sentinel); + } + sentinelRef.current = null;纯属可选的小优化,不影响现有行为。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
packages/x-sdk/src/x-chat/store.ts(2 hunks)packages/x/components/bubble/hooks/useCompatibleScroll.ts(1 hunks)
✅ Files skipped from review due to trivial changes (1)
- packages/x-sdk/src/x-chat/store.ts
🧰 Additional context used
🧠 Learnings (1)
📓 Common learnings
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时,需要用中文回复中文评论。该项目的文档支持中英双语。
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时,需要用中文回复中文评论。该项目的文档支持中英双语。
⏰ 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). (4)
- GitHub Check: Socket Security: Pull Request Alerts
- GitHub Check: build preview
- GitHub Check: size
- GitHub Check: test
1106f1a to
ba868d8
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
packages/x/components/thought-chain/index.tsx (1)
54-68: 修复重复的 className 参数在
clsx调用中,className参数在第 55 行和第 62 行出现了两次,这是冗余的。应用此 diff 移除重复项:
const mergedCls = clsx( className, prefixCls, contextConfig.className, contextConfig.classNames.root, rootClassName, hashId, cssVarCls, - className, classNames.root, `${prefixCls}-box`, { [`${prefixCls}-rtl`]: direction === 'rtl', }, );
♻️ Duplicate comments (4)
packages/x/.dumi/theme/builtins/VideoPlayer/index.tsx (1)
70-70: 单个类名无需使用 clsx 包装当只有一个固定的类名时,可以直接使用而无需
clsx包装,这样可读性更好。建议应用以下修改:
- <div className={clsx(styles.holder)}> + <div className={styles.holder}>packages/x-markdown/tests/setupAfterEnv.ts (1)
3-3: 此导入路径无效 —@rc-component/util中不存在spyElementPrototypes根据之前的详细调研和多次 Web 搜索验证,
spyElementPrototypes函数仅存在于rc-util包中,并未迁移到@rc-component/util。此导入将在测试运行时导致错误。建议的解决方案:
- 将此导入恢复为
rc-util/lib/test/domHook并保留rc-util作为 devDependency- 使用 Jest/jsdom 内置的 mock 机制替代
- 在测试文件中实现一个本地的
spyElementPrototypes辅助函数需要立即修复此问题以确保测试套件能够正常运行。
请运行以下脚本验证
@rc-component/util包中是否包含此函数:#!/bin/bash # 验证 @rc-component/util 包中是否存在 spyElementPrototypes # 检查 node_modules 中的实际导出 if [ -d "node_modules/@rc-component/util" ]; then echo "=== Checking @rc-component/util exports ===" fd -t f "domHook" node_modules/@rc-component/util --exec cat {} \; echo "" echo "=== Searching for spyElementPrototypes in @rc-component/util ===" rg -n "spyElementPrototypes" node_modules/@rc-component/util || echo "Not found in @rc-component/util" fi # 对比检查 rc-util if [ -d "node_modules/rc-util" ]; then echo "" echo "=== Searching for spyElementPrototypes in rc-util ===" rg -n "spyElementPrototypes" node_modules/rc-util/lib/test/ || echo "Not found in rc-util" fi # 检查 package.json 依赖声明 echo "" echo "=== Checking dependencies in packages/x-markdown/package.json ===" cat packages/x-markdown/package.json | jq '{dependencies, devDependencies}'packages/x/.dumi/hooks/useMenu.tsx (1)
70-70: 可以简化单个类名的写法。当只有单个类名时,可以直接使用而无需包裹在
clsx中,这样可读性更好。应用此 diff 来简化代码:
- <Tag variant="filled" className={clsx(styles.tag)} color={getTagColor(tag)}> + <Tag variant="filled" className={styles.tag} color={getTagColor(tag)}>packages/x/.dumi/pages/index/components/DesignGuide.tsx (1)
227-227: 迁移正确,可考虑进一步简化。从 classnames 到 clsx 的迁移在功能上是正确的。不过如之前的评审评论所指出,当只有单个类名时,可以直接使用
className={styles.chain_item_icon}而无需 clsx 包装,这样代码更简洁。
🧹 Nitpick comments (2)
packages/x/components/bubble/Bubble.tsx (1)
1-2: 建议统一使用/es/路径以保持一致性。此文件使用
@rc-component/util/lib/pickAttrs,而BubbleList.tsx使用@rc-component/util/es/pickAttrs。建议统一使用/es/路径,以便更好地支持 tree-shaking 和保持代码库一致性。-import pickAttrs from '@rc-component/util/lib/pickAttrs'; +import pickAttrs from '@rc-component/util/es/pickAttrs';packages/x/components/file-card/List.tsx (1)
125-125: 可以移除冗余的 clsx 调用。
mergedCls已经是clsx()的计算结果(第 63 行),无需再次用clsx()包裹。虽然不会造成错误,但这是不必要的函数调用。应用此差异来简化代码:
- <div className={clsx(mergedCls)}> + <div className={mergedCls}>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (107)
package.json(1 hunks)packages/x-markdown/.jest.js(1 hunks)packages/x-markdown/package.json(1 hunks)packages/x-markdown/src/XMarkdown/index.tsx(2 hunks)packages/x-markdown/tests/setup.ts(1 hunks)packages/x-markdown/tests/setupAfterEnv.ts(1 hunks)packages/x-sdk/.jest.js(1 hunks)packages/x-sdk/package.json(1 hunks)packages/x-sdk/src/x-chat/index.ts(1 hunks)packages/x-sdk/tests/setup.ts(1 hunks)packages/x-sdk/tests/utils.tsx(1 hunks)packages/x/.dumi/components/SemanticPreview.tsx(4 hunks)packages/x/.dumi/hooks/useMenu.tsx(2 hunks)packages/x/.dumi/hooks/useThemeAnimation.ts(1 hunks)packages/x/.dumi/pages/index/common/Container.tsx(2 hunks)packages/x/.dumi/pages/index/components/DesignGuide.tsx(2 hunks)packages/x/.dumi/pages/index/components/MainBanner.tsx(3 hunks)packages/x/.dumi/pages/index/components/SceneIntroduction/index.tsx(2 hunks)packages/x/.dumi/pages/index/index.tsx(2 hunks)packages/x/.dumi/theme/builtins/IconSearch/CopyableIcon.tsx(2 hunks)packages/x/.dumi/theme/builtins/ImagePreview/index.tsx(3 hunks)packages/x/.dumi/theme/builtins/InstallDependencies/bun.tsx(2 hunks)packages/x/.dumi/theme/builtins/InstallDependencies/index.tsx(1 hunks)packages/x/.dumi/theme/builtins/InstallDependencies/npm.tsx(2 hunks)packages/x/.dumi/theme/builtins/InstallDependencies/pnpm.tsx(2 hunks)packages/x/.dumi/theme/builtins/InstallDependencies/utoo.tsx(2 hunks)packages/x/.dumi/theme/builtins/InstallDependencies/yarn.tsx(2 hunks)packages/x/.dumi/theme/builtins/MarkdownPluginsOverView.tsx(2 hunks)packages/x/.dumi/theme/builtins/Previewer/CodePreviewer.tsx(3 hunks)packages/x/.dumi/theme/builtins/TokenCompare/index.tsx(2 hunks)packages/x/.dumi/theme/builtins/VideoPlayer/index.tsx(2 hunks)packages/x/.dumi/theme/common/Color/ColorPalettes.tsx(2 hunks)packages/x/.dumi/theme/common/PrevAndNext.tsx(3 hunks)packages/x/.dumi/theme/common/styles/Common.tsx(1 hunks)packages/x/.dumi/theme/layouts/DocLayout/index.tsx(2 hunks)packages/x/.dumi/theme/slots/Content/ColumnCard.tsx(4 hunks)packages/x/.dumi/theme/slots/Content/Contributors.tsx(2 hunks)packages/x/.dumi/theme/slots/Content/DocAnchor.tsx(2 hunks)packages/x/.dumi/theme/slots/Content/index.tsx(2 hunks)packages/x/.dumi/theme/slots/ContentTabs/index.tsx(1 hunks)packages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsx(1 hunks)packages/x/.dumi/theme/slots/Header/Actions.tsx(2 hunks)packages/x/.dumi/theme/slots/Header/Logo.tsx(2 hunks)packages/x/.dumi/theme/slots/Header/Navigation.tsx(2 hunks)packages/x/.dumi/theme/slots/Header/SwitchBtn.tsx(2 hunks)packages/x/.dumi/theme/slots/Header/index.tsx(2 hunks)packages/x/.dumi/theme/slots/Sidebar/index.tsx(1 hunks)packages/x/.jest.js(1 hunks)packages/x/components/_util/hooks/use-collapsible.ts(1 hunks)packages/x/components/_util/hooks/use-shortcut-keys.ts(1 hunks)packages/x/components/_util/motion.ts(1 hunks)packages/x/components/_util/warning.ts(1 hunks)packages/x/components/actions/ActionsAudio.tsx(2 hunks)packages/x/components/actions/ActionsCopy.tsx(2 hunks)packages/x/components/actions/ActionsFeedback.tsx(4 hunks)packages/x/components/actions/ActionsItem.tsx(2 hunks)packages/x/components/actions/ActionsMenu.tsx(2 hunks)packages/x/components/actions/Item.tsx(2 hunks)packages/x/components/actions/index.tsx(4 hunks)packages/x/components/attachments/DropArea.tsx(2 hunks)packages/x/components/attachments/FileList/index.tsx(4 hunks)packages/x/components/attachments/PlaceholderUploader.tsx(2 hunks)packages/x/components/attachments/index.tsx(6 hunks)packages/x/components/bubble/Bubble.tsx(6 hunks)packages/x/components/bubble/BubbleList.tsx(3 hunks)packages/x/components/bubble/Divider.tsx(2 hunks)packages/x/components/bubble/EditableContent.tsx(1 hunks)packages/x/components/bubble/System.tsx(2 hunks)packages/x/components/bubble/TypingContent.tsx(2 hunks)packages/x/components/bubble/hooks/useCompatibleScroll.ts(1 hunks)packages/x/components/bubble/hooks/useTyping.ts(1 hunks)packages/x/components/code-highlighter/CodeHighlighter.tsx(4 hunks)packages/x/components/conversations/Creation.tsx(2 hunks)packages/x/components/conversations/GroupTitle.tsx(3 hunks)packages/x/components/conversations/Item.tsx(2 hunks)packages/x/components/conversations/__tests__/index.test.tsx(1 hunks)packages/x/components/conversations/demo/shortcutKeys.tsx(1 hunks)packages/x/components/conversations/hooks/useCreation.tsx(2 hunks)packages/x/components/conversations/index.tsx(5 hunks)packages/x/components/file-card/FileCard.tsx(5 hunks)packages/x/components/file-card/List.tsx(4 hunks)packages/x/components/file-card/components/File.tsx(3 hunks)packages/x/components/file-card/components/ImageLoading.tsx(3 hunks)packages/x/components/mermaid/Mermaid.tsx(5 hunks)packages/x/components/prompts/index.tsx(6 hunks)packages/x/components/sender/SenderHeader.tsx(4 hunks)packages/x/components/sender/SenderSwitch.tsx(3 hunks)packages/x/components/sender/SlotTextArea.tsx(5 hunks)packages/x/components/sender/TextArea.tsx(2 hunks)packages/x/components/sender/__tests__/use-speech.test.tsx(1 hunks)packages/x/components/sender/components/ActionButton.tsx(2 hunks)packages/x/components/sender/components/LoadingButton.tsx(2 hunks)packages/x/components/sender/components/Skill.tsx(2 hunks)packages/x/components/sender/hooks/use-speech.ts(1 hunks)packages/x/components/sender/index.tsx(5 hunks)packages/x/components/sources/Sources.tsx(6 hunks)packages/x/components/sources/components/CarouselCard.tsx(3 hunks)packages/x/components/suggestion/index.tsx(3 hunks)packages/x/components/suggestion/useActive.ts(1 hunks)packages/x/components/think/Think.tsx(4 hunks)packages/x/components/thought-chain/Item.tsx(4 hunks)packages/x/components/thought-chain/Node.tsx(5 hunks)packages/x/components/thought-chain/Status.tsx(2 hunks)packages/x/components/thought-chain/index.tsx(4 hunks)packages/x/components/welcome/index.tsx(6 hunks)packages/x/docs/playground/ultramodern.tsx(2 hunks)packages/x/package.json(2 hunks)
⛔ Files not processed due to max files limit (7)
- packages/x/scripts/generate-component-changelog.ts
- packages/x/tests/mocks/@rc-component/virtual-list.ts
- packages/x/tests/mocks/rc-virtual-list.ts
- packages/x/tests/setup.ts
- packages/x/tests/setupAfterEnv.ts
- packages/x/tests/utils.tsx
- packages/x/typings/custom-typings.d.ts
✅ Files skipped from review due to trivial changes (3)
- packages/x-markdown/tests/setup.ts
- packages/x/components/bubble/EditableContent.tsx
- packages/x/.dumi/theme/slots/Content/ColumnCard.tsx
🚧 Files skipped from review as they are similar to previous changes (58)
- packages/x-sdk/.jest.js
- packages/x/components/conversations/Item.tsx
- packages/x/.dumi/pages/index/components/SceneIntroduction/index.tsx
- packages/x/.dumi/hooks/useThemeAnimation.ts
- packages/x/components/file-card/components/File.tsx
- packages/x-markdown/.jest.js
- packages/x-sdk/src/x-chat/index.ts
- packages/x/.dumi/theme/slots/Header/index.tsx
- packages/x/components/file-card/components/ImageLoading.tsx
- packages/x/.dumi/theme/builtins/MarkdownPluginsOverView.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/bun.tsx
- packages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsx
- packages/x/components/bubble/System.tsx
- packages/x/components/suggestion/useActive.ts
- packages/x/.dumi/theme/slots/ContentTabs/index.tsx
- packages/x/components/conversations/index.tsx
- packages/x/components/mermaid/Mermaid.tsx
- package.json
- packages/x/components/attachments/PlaceholderUploader.tsx
- packages/x/components/_util/hooks/use-shortcut-keys.ts
- packages/x-sdk/tests/setup.ts
- packages/x/.dumi/theme/common/styles/Common.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/yarn.tsx
- packages/x/components/actions/ActionsFeedback.tsx
- packages/x/components/thought-chain/Node.tsx
- packages/x/.dumi/theme/slots/Sidebar/index.tsx
- packages/x/.dumi/theme/slots/Header/Logo.tsx
- packages/x/.dumi/pages/index/components/MainBanner.tsx
- packages/x/components/suggestion/index.tsx
- packages/x/components/sender/tests/use-speech.test.tsx
- packages/x/components/thought-chain/Status.tsx
- packages/x/components/bubble/hooks/useCompatibleScroll.ts
- packages/x/components/sender/SenderSwitch.tsx
- packages/x/.dumi/components/SemanticPreview.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/index.tsx
- packages/x/components/conversations/hooks/useCreation.tsx
- packages/x/components/conversations/tests/index.test.tsx
- packages/x/components/sender/SlotTextArea.tsx
- packages/x/.jest.js
- packages/x/.dumi/theme/slots/Content/DocAnchor.tsx
- packages/x/components/sources/components/CarouselCard.tsx
- packages/x/.dumi/theme/slots/Content/Contributors.tsx
- packages/x/components/sender/components/ActionButton.tsx
- packages/x/.dumi/theme/common/PrevAndNext.tsx
- packages/x/package.json
- packages/x-sdk/package.json
- packages/x/.dumi/theme/builtins/TokenCompare/index.tsx
- packages/x/.dumi/theme/slots/Header/SwitchBtn.tsx
- packages/x/docs/playground/ultramodern.tsx
- packages/x/components/actions/Item.tsx
- packages/x/.dumi/theme/slots/Content/index.tsx
- packages/x/components/file-card/FileCard.tsx
- packages/x/components/sender/TextArea.tsx
- packages/x/.dumi/theme/slots/Header/Actions.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/pnpm.tsx
- packages/x/components/sender/index.tsx
- packages/x/components/bubble/TypingContent.tsx
- packages/x/.dumi/pages/index/common/Container.tsx
🧰 Additional context used
🧠 Learnings (2)
📓 Common learnings
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时,需要用中文回复中文评论。该项目的文档支持中英双语。
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时,需要用中文回复中文评论。该项目的文档支持中英双语。
📚 Learning: 2024-11-23T15:50:20.802Z
Learnt from: YumoImer
Repo: ant-design/x PR: 223
File: package.json:224-224
Timestamp: 2024-11-23T15:50:20.802Z
Learning: `rc-drawer` 依赖在 `.dumi/theme/layouts/SidebarLayout` 文件中被使用,是项目中的必要依赖,今后不应建议移除。
Applied to files:
packages/x/.dumi/theme/layouts/DocLayout/index.tsxpackages/x/.dumi/hooks/useMenu.tsxpackages/x/.dumi/theme/slots/Header/Navigation.tsx
🧬 Code graph analysis (1)
packages/x-markdown/src/XMarkdown/index.tsx (1)
packages/x/docs/x-markdown/demo/codeDemo/open-links-in-new-tab.tsx (1)
className(26-38)
⏰ 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: Socket Security: Pull Request Alerts
- GitHub Check: test
- GitHub Check: build preview
🔇 Additional comments (69)
packages/x/components/conversations/demo/shortcutKeys.tsx (1)
9-9: KeyCode 依赖迁移看起来合理,请确认版本与打包入口从
rc-util/lib/KeyCode迁移到@rc-component/util/lib/KeyCode在用法上保持不变(依然是KeyCode.K),这段改动本身没问题。不过因为这里是 demo,且仓库里之前反馈过 ESModule 入口的Unexpected token 'export'报错,建议在本分支下实际跑一下 dev/build,确认:
@rc-component/util的版本已经升级到支持该路径;- bundler 对这个路径解析到正确的 ESM/CJS 入口,不再出现语法错误。
整体 LGTM,主要是让你在集成环境里再验证一下构建结果。
packages/x/components/bubble/Divider.tsx (2)
2-2: 导入迁移正确!从
classnames迁移到clsx的导入语法正确,使用了正确的命名导入方式。
35-45: 类名合并函数迁移正确!将
classnames替换为clsx的用法正确,传入的参数保持不变。两个库在这种基础用法下完全兼容,能够正确处理字符串、undefined 等类型的类名合并。此变更符合 PR 优化包体积的目标。packages/x/.dumi/theme/layouts/DocLayout/index.tsx (2)
1-1: LGTM!导入语法正确。从
classnames迁移到clsx的导入语法正确,clsx使用命名导出。这一变更符合 PR 目标,有助于减小打包体积。
96-96: LGTM!函数调用迁移正确。
clsx与classnames的对象语法完全兼容,该处使用方式正确,行为保持不变。迁移安全且符合预期。packages/x/components/sender/components/LoadingButton.tsx (1)
2-2: LGTM!迁移正确从
classnames迁移到clsx的改动正确:
- 导入语句使用了正确的命名导入语法
- 使用方式保持一致,功能不受影响
- 符合 PR 的包体积优化目标
Also applies to: 18-18
packages/x/.dumi/theme/builtins/VideoPlayer/index.tsx (2)
3-3: LGTM! 导入语句迁移正确从
classnames迁移到clsx的导入语句符合 PR 目标,语法正确。
62-62: LGTM! 正确处理多个类名参数使用
clsx(styles.container, className)能够正确处理className可能为 undefined 的情况,迁移准确。packages/x/components/_util/warning.ts (1)
1-1: 依赖路径迁移看起来正确,但请确认与依赖版本一致这一行从
rc-util/lib/warning迁移到@rc-component/util/lib/warning后,rcWarning与resetWarned的使用方式在本文件中保持不变,类型与调用点都无需调整,这里改动本身是安全的、符合本 PR 的整体迁移方向。建议再本地额外确认两点:
@rc-component/util版本已经在package.json/ lockfile 中正确更新,并与其它@rc-component/*版本保持一致;- ESM/CJS 打包结果正常(尤其是之前 PR 描述里提到的
Unexpected token 'export'问题,在当前依赖版本下已不再出现)。整体上这行改动我这边是认可的。
Based on learnings, ...
packages/x/.dumi/hooks/useMenu.tsx (2)
5-5: 导入语句迁移正确。从
classnames迁移到clsx的导入语句符合 PR 目标,语法正确。
64-64: LGTM!
clsx的使用正确,条件样式和多参数合并处理得当。packages/x/.dumi/pages/index/components/DesignGuide.tsx (1)
3-3: 导入更改正确。从 classnames 迁移到 clsx 的导入语法正确,符合 PR 的包体积优化目标。
packages/x/components/sender/hooks/use-speech.ts (1)
1-1:@rc-component/util导入迁移看起来合理,但请确认依赖与构建配置这一行从
rc-util迁移到@rc-component/util在本文件语义上是等价的,useEvent/useMergedState的用法也保持不变,没有看到逻辑层面的风险。建议额外检查两点,避免后续构建或体积问题:
packages/x以及上层 workspace 的package.json中是否已经添加(或提升)对@rc-component/util的正式依赖,并移除不再使用的rc-util,避免双份打包。- 其它文件是否已经统一迁移到
@rc-component/util,防止因为 CJS/ESM 入口混用再次出现Unexpected token 'export'这类问题。整体来说,这里的改动可以接受,重点是确认依赖和打包配置在整个仓库范围内是一致的。
packages/x/components/sender/components/Skill.tsx (1)
3-3: LGTM!迁移正确从
classnames到clsx的迁移实现正确,两者 API 完全兼容。这个改动符合 PR 的目标,有助于减小 bundle 体积(clsx 约 228 字节 vs classnames 约 700 字节)。Also applies to: 50-52
packages/x/.dumi/theme/builtins/InstallDependencies/utoo.tsx (1)
2-2: clsx 替换用法正确,行为与原先等价
import { clsx } from 'clsx';搭配clsx(styles.iconWrap, className)的用法与原先classnames(styles.iconWrap, className)行为等价,能够正确处理className可选/为空的情况,也符合本 PR 统一迁移到 clsx 的目标,这里可以保持现状。建议和同目录下其他 InstallDependencies 相关组件一起跑一遍文档站构建/预览,确认最终生成的 className 与预期一致。
Also applies to: 24-24
packages/x/components/_util/motion.ts (1)
1-6: 验证 @rc-component/motion 的类型导出和版本兼容性导入路径已从
rc-motion迁移至@rc-component/motion,与 PR 目标一致。但以下事项需要通过代码审查或文档确认:
@rc-component/motion是否导出了所有所需的类型(CSSMotionProps、MotionEndEventHandler、MotionEventHandler)- 内部路径
/lib/interface在新包中是否保持稳定- 新包版本是否与项目依赖([email protected])兼容
建议在合并前确认上述类型导出和版本兼容性。
packages/x/components/bubble/hooks/useTyping.ts (1)
1-1: LGTM!导入路径从
rc-util迁移到@rc-component/util符合 PR 目标,功能保持不变。packages/x/components/bubble/BubbleList.tsx (3)
1-3: LGTM!导入路径迁移正确:
omit和pickAttrs从rc-util迁移到@rc-component/utilclassnames替换为clsx
clsx的 API 与classnames兼容,支持相同的调用模式。
152-159: LGTM!
clsx用法正确,与原classnames行为一致。
216-218: LGTM!条件类名的对象语法在
clsx中与classnames完全兼容。packages/x/components/bubble/Bubble.tsx (2)
78-93: LGTM!
clsx正确处理了多个字符串和条件对象的组合,与原classnames行为一致。
157-168: LGTM!所有
clsx用法正确,包括:
- 内容区域的条件类名(Lines 157-168)
- 简单字符串类名(Line 182)
getSlotClassName辅助函数(Line 196)- footer 的条件类名(Lines 235-238)
Also applies to: 182-182, 196-196, 235-238
packages/x/.dumi/theme/builtins/IconSearch/CopyableIcon.tsx (1)
4-4: clsx 迁移用法正确,注意依赖版本即可
classnames->clsx的迁移在这里是等价的:clsx(theme, styles.iconItem, { copied: justCopied === name })完全符合 clsx 的 API,逻辑与原先保持一致,且对象形式条件类名写法也更清晰。唯一需要确认的一点是:当前
clsx版本应 ≥ 1.2.0,以保证命名导入import { clsx } from 'clsx';在运行时有对应导出(1.2.0 起官方提供该别名)。如果 package.json 中锁定了较老版本,建议同步升级。整体来说,这里的修改可以直接合入。
Also applies to: 109-109
packages/x/.dumi/pages/index/index.tsx (1)
2-2: > Likely an incorrect or invalid review comment.packages/x-sdk/tests/utils.tsx (1)
1-2: 验证新包中内部 API 的可用性导入路径从
rc-resize-observer迁移到@rc-component/resize-observer符合 PR 目标。但需要注意:
- 代码依赖内部导出
_rs(下划线前缀通常表示私有 API)- 直接访问包的内部路径(
/es/utils/observerUtil和/lib/utils/observerUtil)请验证
@rc-component/resize-observer是否:
- 仍然导出
_rs符号- 保持相同的内部目录结构
- 提供了更稳定的公共 API 替代方案
packages/x/.dumi/theme/builtins/ImagePreview/index.tsx (3)
1-3: 依赖迁移到 @rc-component/util 与 clsx 的正确性
- 将
toArray从rc-util迁到@rc-component/util符合本 PR 目标,调用方式不变,看起来兼容性良好。clsx一般既支持默认导出,也在较新版本中提供命名导出clsx;如果当前 lockfile 中使用的是较旧版本,可能需要改成import clsx from 'clsx';以避免构建或类型错误。建议你确认:
- 根
package.json已添加@rc-component/util依赖并锁定到与 antd/x 其他包一致的版本;- 当前
clsx版本是否支持import { clsx } from 'clsx';这一写法,或根据实际版本调整为默认导入。Based on learnings, ...
83-86: 使用 clsx 构建 preview 容器 className 的写法合理这里用
clsx(rootClassName, 'clearfix', 'preview-image-boxes', {...})替代原先的classNames,字符串与条件类名的组合逻辑保持不变,可读性也更好,没有发现逻辑行为差异问题。
107-110: good/bad 标记的条件类名迁移无行为变化
imageWrapperClassName = clsx(imgWrapperCls, { good: coverMeta.isGood, bad: coverMeta.isBad })与原先classNames的用法等价,只在isGood/isBad为真时添加对应类名,迁移干净且不会影响渲染结果。packages/x/components/sender/SenderHeader.tsx (2)
82-120: clsx 替换正确,实现保持一致。所有三处
clsx的使用都正确地替换了原来的classNames调用:
- 第 82 行:正确处理了多个类名和条件对象(RTL 方向支持)
- 第 97 行:正确合并了基础类名和语义化类名
- 第 120 行:正确合并了内容区域的类名
clsx 的 API 与 classNames 完全兼容,这些更改不会影响运行时行为,同时有助于减小打包体积。
2-4: This review requires manual verification of the dependency migration. Please confirm:
- The imports at lines 2-4 correctly reference @rc-component/motion and clsx
- Package.json contains updated versions of @rc-component/motion and clsx (v2.x)
- All three usage patterns at lines 82, 97, 120 are compatible with clsx API
- No remaining imports from rc-motion or classNames exist in the codebase
packages/x/components/_util/hooks/use-collapsible.ts (2)
3-110: LGTM!函数逻辑、类型定义和实现均未改变,代码正确使用了迁移后的导入项(
CSSMotionProps和useMergedState)。实现保持完整性和类型安全。
1-2: Review comment contains unresolved verification requests and cannot be confirmed without access to the actual codebase state, package.json dependencies, and @rc-component package exports. The comment should be updated with either: (1) confirmed verification results showing the packages export the required APIs and are version-compatible, or (2) removal of verification requests if changes are already validated through other means. Additionally, the comment mixing Chinese and English with unapplied shell scripts should be cleaned up for clarity.packages/x/components/thought-chain/Item.tsx (3)
129-143: clsx 迁移实现正确className 的组合逻辑正确迁移到
clsx,保持了原有的条件类名逻辑。注意到新增了cssVarCls参数,这与样式系统的改进相符。
156-173: 子元素 className 迁移正确内容区域、标题和描述部分的
clsx使用正确,条件类名逻辑保持一致。
1-2: 依赖迁移需要验证实际导入源和兼容性从
rc-util迁移到@rc-component/util以及引入clsx替代classnames的改动需要确认:
- pickAttrs 实际导入源是否正确(@rc-component/util 或 rc-util)
- clsx 与 classnames 的 API 兼容性
- 项目中其他文件的相关导入是否也进行了一致的迁移
packages/x/components/thought-chain/index.tsx (3)
1-2: 依赖迁移正确与 Item.tsx 中的改动一致,正确迁移到了新的依赖包。
109-112: Context classNames 合并正确使用
clsx合并 context 和 props 中的 classNames,即使某些值为 undefined 也能正确处理。
127-127: item className 合并正确正确使用
clsx合并 item 的 className。packages/x/.dumi/theme/builtins/Previewer/CodePreviewer.tsx (4)
6-6: 导入变更正确从
classnames迁移到clsx的导入语法正确,clsx是一个更轻量的替代方案,有助于减小包体积。
163-167: clsx 使用正确类名组合逻辑正确,
clsx完全支持这种字符串与条件对象混合的用法。
170-172: clsx 使用正确高亮容器的类名组合实现正确。
297-297: 验证 '@rc-component/util' 依赖配置依赖名称已从 'rc-util' 更新为 '@rc-component/util',需要确认
pkgDependencyList中包含该新包名及正确的版本号,否则 CodeSandbox 演示可能无法正常工作。运行以下脚本验证依赖配置:
#!/bin/bash # 描述:验证 pkgDependencyList 是否包含 @rc-component/util # 查找 pkgDependencyList 的定义位置 echo "=== 查找 pkgDependencyList 定义 ===" rg -n --type ts --type tsx --type js --type jsx -C 3 'pkgDependencyList\s*[:=]' # 查找 package.json 中的 @rc-component/util 依赖 echo -e "\n=== 检查 package.json 中的 @rc-component/util ===" fd -e json package.json --exec jq -r 'select(.dependencies["@rc-component/util"] or .devDependencies["@rc-component/util"] or .peerDependencies["@rc-component/util"]) | {name: .name, "@rc-component/util": (.dependencies["@rc-component/util"] // .devDependencies["@rc-component/util"] // .peerDependencies["@rc-component/util"])}' # 检查是否还有遗留的 rc-util 引用 echo -e "\n=== 检查是否有遗留的 rc-util 引用 ===" rg -n --type json '"rc-util"' -g 'package.json'packages/x/components/think/Think.tsx (3)
92-103: 类名合并逻辑正确!使用
clsx替换classnames来合并类名的逻辑完全正确,参数传递方式保持一致,包括对象形式的条件类名处理也是兼容的。
132-132: 所有 clsx 调用都已正确迁移!状态包装器、状态文本和内容区域的类名合并都已正确使用
clsx替换,语法和逻辑保持一致。这些改动有助于减少包体积,符合 PR 的优化目标。Also applies to: 140-142, 151-151
2-6: Import migration to @rc-component packages is correct.The migration from
rc-motion/rc-utilto@rc-component/motion/@rc-component/utilaligns with the PR goals. Theclsxnamed export import{ clsx }has been supported since clsx v1.2.0, not just v2+.Verify that the project's clsx dependency version supports the named export format, and confirm there are no remaining old
rc-motionorrc-utilimports elsewhere in the codebase that need updating.packages/x/.dumi/theme/common/Color/ColorPalettes.tsx (1)
1-1: No issue with the clsx import syntax.Both
import clsx from 'clsx'(default export) andimport { clsx } from 'clsx'(named alias) are valid. The named export alias has been officially supported since clsx v1.2.0, so the import style used here is correct and requires no changes.Likely an incorrect or invalid review comment.
packages/x/components/file-card/List.tsx (2)
127-132: 其他 clsx 用法正确!这些
clsx调用正确地合并了类名,包括条件类名(第 127 行)和多个类名源(第 149、157 行)。迁移实现准确。Also applies to: 149-149, 157-157
2-4: Verify API compatibility for dependency migrations.The imports show a migration from
rc-motionto@rc-component/motionand fromclassnamestoclsx. Whileclsxis a direct replacement forclassnames, ensure thatCSSMotionListfrom@rc-component/motionmaintains API compatibility with the previous version, particularly the props interface and behavior expectations in this component.packages/x/components/attachments/FileList/index.tsx (1)
4-4: clsx 迁移实现正确!所有
clsx的使用都正确地合并了多个类名源,包括:
- 状态类名与组件 classNames(第 104-105 行)
- 根类名与 className 属性(第 133 行)
- 语义化类名与上下文类名的合并(第 135-140 行)
- 上传按钮的多源类名合并(第 157 行)
迁移准确且一致。
Also applies to: 104-105, 133-140, 157-161
packages/x/components/conversations/Creation.tsx (1)
1-1: clsx 导入和迁移正确,建议确认 package.json 中的版本支持
- 行 1 的
import { clsx } from 'clsx';在 clsx ≥ 1.2.0 时完全兼容,named export 与 default export 等价。- 行 51-53 的迁移保留了所有原始参数和条件类逻辑(包括
prefixCls-disabled),运行时行为一致。建议检查:
- 确认 clsx 版本:package.json 中 clsx 是否满足 ≥ 1.2.0(以支持 named export)。
- 统一导入风格:项目内其他文件的 clsx 导入是否采用同一风格(
import clsxvsimport { clsx }),确保一致性。packages/x/components/actions/ActionsAudio.tsx (2)
65-77: 合并类名的整体结构与原实现一致,语义清晰这里用
mergedCls聚合了prefixCls、audioCls、hashId、cssVarCls、rootClassName、className以及classNames.root,并通过对象形式追加 RTL 与status修饰类,模式与原先基于类名工具(classnames→clsx)的写法等价,逻辑上没有问题。迁移到
clsx后,请在实际运行环境下确认一遍该组件在 LTR/RTL 和不同status场景下渲染出的 class 是否与预期一致(尤其是快照测试或视觉回归)。
2-2: > Likely an incorrect or invalid review comment.packages/x-markdown/package.json (1)
52-52: 依赖迁移正确从
classnames迁移到clsx ^2.1.1的更改符合 PR 目标,用于减少包体积。packages/x/components/actions/ActionsMenu.tsx (1)
3-3: 迁移实现正确
clsx的导入和使用都正确,所有类名组合逻辑保持不变。Also applies to: 53-53, 60-60
packages/x/.dumi/theme/slots/Header/Navigation.tsx (1)
2-2: 类名组合逻辑迁移正确
clsx的使用正确处理了多个参数、条件样式和动态类名的组合。Also applies to: 179-186
packages/x/components/welcome/index.tsx (1)
2-2: 所有类名组合已正确迁移组件中的所有
clsx使用都正确替换了原有的classnames调用,保持了相同的类名组合逻辑。Also applies to: 71-71, 87-87, 102-102, 114-126, 147-151
packages/x-markdown/src/XMarkdown/index.tsx (1)
1-1: XMarkdown 组件迁移正确
clsx的导入和使用符合迁移模式,类名组合逻辑保持一致。Also applies to: 24-24
packages/x/.dumi/theme/builtins/InstallDependencies/npm.tsx (1)
2-2: 图标组件迁移正确
clsx的使用正确,类名组合逻辑未改变。Also applies to: 24-24
packages/x/components/attachments/DropArea.tsx (1)
1-1: 条件类名逻辑迁移正确
clsx正确处理了条件类名的对象语法,逻辑保持一致。Also applies to: 77-79
packages/x/components/attachments/index.tsx (1)
1-1: 验证@rc-component/util的 API 兼容性依赖迁移实现正确,
classnames→clsx和rc-util→@rc-component/util的迁移符合预期。需要确保
@rc-component/util中useEvent和useMergedState的 API 签名与原rc-util完全兼容,特别是在以下文件位置验证使用情况:行 1, 3, 126, 174, 191, 200, 211-220。packages/x/components/code-highlighter/CodeHighlighter.tsx (1)
1-1: 代码迁移正确!从
classnames到clsx的迁移实施得当,所有相关的 className 构建都已正确更新。这种迁移有助于减小打包体积。Also applies to: 42-53, 69-73, 77-82, 104-105
packages/x/components/conversations/GroupTitle.tsx (1)
2-5: 依赖迁移实施正确!从
rc-motion到@rc-component/motion以及从classnames到clsx的迁移都已正确完成。CSSMotion组件及其类型定义的导入路径准确无误。Also applies to: 47-49, 52-52, 55-59, 66-66
packages/x/components/sources/Sources.tsx (1)
2-7: 多依赖迁移执行良好!已成功完成以下迁移:
rc-motion→@rc-component/motionrc-util→@rc-component/util(包括useMergedState和pickAttrs)classnames→clsx所有导入路径和工具函数的使用都符合新包的 API 规范。
Also applies to: 94-106, 161-167, 175-179, 184-191, 198-201
packages/x/components/actions/ActionsItem.tsx (1)
2-4: 工具函数迁移正确!
pickAttrs从@rc-component/util正确导入,clsx替换classnames的实现准确。className 合并逻辑保持一致。Also applies to: 104-117
packages/x/components/actions/ActionsCopy.tsx (1)
1-3: 迁移模式一致!与其他 Actions 相关组件保持相同的迁移模式,
pickAttrs和clsx的导入及使用都正确无误。Also applies to: 75-86
packages/x/components/actions/index.tsx (1)
1-4: 综合性迁移完成得很好!此文件包含了最全面的依赖迁移:
CSSMotion从@rc-component/motionpickAttrs和composeRef从@rc-component/utilclassnames→clsx所有导入路径正确,在多个位置(包括
ActionsContext内部)的clsx使用都保持一致。鉴于 PR 评论中提到之前出现过 ES 模块语法错误(现已修复),建议在合并前验证所有新依赖在构建和运行时环境中都能正常工作。
Also applies to: 57-69, 99-103, 112-116
packages/x/components/prompts/index.tsx (3)
156-175: 根容器和列表类名合并逻辑用 clsx 重写后语义保持一致
mergedCls合并了prefixCls、上下文和外部传入的className/rootClassName,同时保留了 RTL 标记,迁移到clsx后行为与原先classnames对于这些简单用法是一致的。mergedListCls对wrap、vertical使用布尔对象形式控制修饰类名,也与原实现对等,可读性良好。这块改动可以直接合入。
199-248: 渲染阶段统一使用 clsx 组合类名看起来正确且一致
- 顶层
div使用clsx(mergedCls, motionClassName)将动画类和基础类名合并,motionClassName为空时会被安全忽略,符合预期。- 标题
Typography.Title、每个 item 容器以及${prefixCls}-content都统一用clsx合并语义类名与contextConfig.classNames.*、classNames.*,并未改变禁用态、嵌套态等逻辑,仅是实现方式替换。- 结合上面的
styles/classNames默认值(解构时赋空对象),这里不会因为未提供配置而访问到undefined.property。整体上这一段迁移实现干净、行为保持不变,可以接受。
1-4: 依赖迁移基本正确,但请确认 clsx 版本和打包配置
CSSMotion从rc-motion迁移到@rc-component/motion,composeRef迁移到@rc-component/util/lib/ref,在本文件用法上是无缝替换,看起来没有行为变化。import { clsx } from 'clsx';这类命名导入需要 clsx ≥ 1.2.0 才支持命名导出别名,否则在某些构建环境下可能拿不到函数值。
建议确认本仓库依赖的 clsx 版本已满足要求。@rc-component/*包是 ESM,为避免再次出现SyntaxError: Unexpected token 'export'一类问题,请确认构建配置(如 Next.js 的transpilePackages或 Babel 配置)已经统一覆盖@rc-component相关包。
ba868d8 to
b11b1eb
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
packages/x/components/suggestion/useActive.ts (1)
34-45: 空列表场景下offsetRow可能抛异常,建议增加防御判断当前实现里,如果在
open为true时items为空数组(例如「无匹配项」但浮层仍然开启),offsetRow里:
getItems可能返回[];itemCount为0时,(currentRowIndex + offset + itemCount) % itemCount会变成对 0 取模,结果为NaN;- 进而
nextItem为undefined,访问nextItem.value会直接抛TypeError。这是一个潜在运行时错误(虽然是既有问题,与本次依赖迁移无关),建议顺手加一层保护逻辑。例如:
- const offsetRow = (offset: number) => { - const currentColIndex = activePaths.length || 1; - - const currentItems = getItems(currentColIndex); - const currentRowIndex = currentItems.findIndex( - (item) => item.value === activePaths[currentColIndex - 1], - ); - const itemCount = currentItems.length; - - const nextItem = currentItems[(currentRowIndex + offset + itemCount) % itemCount]; - setActivePaths([...activePaths.slice(0, currentColIndex - 1), nextItem.value]); - }; + const offsetRow = (offset: number) => { + const currentColIndex = activePaths.length || 1; + const currentItems = getItems(currentColIndex); + const itemCount = currentItems.length; + + // items 为空时不做任何处理,避免运行时异常 + if (!itemCount) { + return; + } + + const currentRowIndex = currentItems.findIndex( + (item) => item.value === activePaths[currentColIndex - 1], + ); + + const nextItem = currentItems[(currentRowIndex + offset + itemCount) % itemCount]; + setActivePaths([...activePaths.slice(0, currentColIndex - 1), nextItem.value]); + };这样可以在不改变正常交互逻辑的前提下,避免边界场景下组件崩溃。
Also applies to: 105-109
packages/x/components/actions/ActionsFeedback.tsx (1)
132-141: 修复第 138 行的逻辑错误。
clsx的迁移是正确的。但是,在审查代码时发现第 138 行存在一个预存的逻辑错误(非本 PR 引入):[`${classNames.disliked}`]: classNames.disliked && value === 'like', // ❌ 错误这是 dislike 按钮的 className 逻辑,条件应该检查
value === 'dislike'而不是value === 'like'。当前逻辑会导致disliked类名在错误的状态下应用。应用以下 diff 修复逻辑错误:
{ - [`${classNames.disliked}`]: classNames.disliked && value === 'like', + [`${classNames.disliked}`]: classNames.disliked && value === 'dislike', [`${feedbackCls}-item-dislike-active`]: value === 'dislike', },
♻️ Duplicate comments (3)
packages/x/.dumi/theme/slots/ContentTabs/index.tsx (1)
2-2: 类型导入路径错误
TabsProps类型从@rc-component/table导入是错误的,这是表格组件的包,而不是标签页组件。由于第3行使用的是antd的Tabs组件,类型应该从antd导入以保持一致性。应用此修复:
-import type { TabsProps } from '@rc-component/table'; +import type { TabsProps } from 'antd';packages/x/.dumi/theme/builtins/MarkdownPluginsOverView.tsx (1)
58-58: 可以省略单个静态类名的clsx()包装。当只有单个静态类名时,可以直接使用而无需
clsx()包装,这样可读性更好。clsx主要用于处理条件类名或合并多个类名的场景。应用以下改动简化代码:
- className={clsx(styles.container)} + className={styles.container}- <List.Item className={clsx(styles.item)}> + <List.Item className={styles.item}>- className={clsx(styles.itemMeta)} + className={styles.itemMeta}Also applies to: 63-63, 66-66
packages/x-markdown/tests/setupAfterEnv.ts (1)
3-11:⚠️ spyElementPrototypes从@rc-component/util/lib/test/domHook引入很可能不存在,会导致测试直接报错根据目前公开的
@rc-component/utilAPI 与上一轮检查,这个包并未对外暴露lib/test/domHook下的spyElementPrototypes,直接这样导入很可能在setupAfterEnv加载阶段就抛错,导致整包测试无法运行。(npmjs.com)建议二选一处理:
回退到原来的 rc-util 路径
- 改回:
import { spyElementPrototypes } from 'rc-util/lib/test/domHook';- 并确保
rc-util仍然作为(至少)devDependency 存在。去掉这个依赖,改用本地 helper / Jest+jsdom mock
- 例如在本文件里实现一个简单的 helper,只 mock 掉需要的原型方法:
const origScrollTo = HTMLElement.prototype.scrollTo; beforeAll(() => { // @ts-ignore HTMLElement.prototype.scrollTo = jest.fn(); }); afterAll(() => { // @ts-ignore HTMLElement.prototype.scrollTo = origScrollTo; });
- 如果只用到了
scrollTo,这种直接覆盖原型的方式会更透明,也避免依赖内部 test util。无论选哪种方式,都建议在本地跑一次
pnpm test --filter x-markdown(或对应测试脚本),确保不会在导入阶段抛Cannot find module '@rc-component/util/lib/test/domHook'或类似错误。#!/bin/bash # 在仓库根目录下检查 node_modules 中是否真的存在 domHook & spyElementPrototypes # 查找 domHook 文件(如果依赖已安装) fd domHook node_modules/@rc-component/util -a 2>/dev/null || echo "domHook not found under @rc-component/util" # 粗略搜一下 spyElementPrototypes 标识 rg -n "spyElementPrototypes" node_modules/@rc-component/util 2>/dev/null || echo "spyElementPrototypes not exported from @rc-component/util?"
🧹 Nitpick comments (3)
packages/x/.dumi/pages/index/components/DesignGuide.tsx (1)
3-3: clsx 迁移用法正确,这里是否需要保留调用可以视团队风格决定
import { clsx } from 'clsx';搭配className={clsx(styles.chain_item_icon)}在语义和运行时上都是正确的,满足本 PR 从classnames迁移到clsx的目标。- 由于这里只是单一静态类名,如果不考虑未来再拼接动态 class,可以直接写成
className={styles.chain_item_icon},可读性会略好一点;不过这属于代码风格层面的微调,可以按项目里对统一使用clsx的偏好来决定是否修改。(如果项目中使用的
clsx版本低于当前推荐版本,请确认import { clsx } from 'clsx'的导入方式在你们的实际构建环境中工作正常。根据历史 learnings,本评审按约定使用中文回复。)Also applies to: 227-227
packages/x/components/prompts/index.tsx (1)
156-175: 使用 clsx 合并根节点和列表类名实现合理
mergedCls将prefixCls、上下文配置、外部className、rootClassName、自定义classNames.root、hashId、cssVarCls以及 RTL 状态集中在一个 clsx 调用里,逻辑清晰且与原先 classnames 语义等价。mergedListCls同样用 clsx 组合基础类、上下文classNames.list、自定义classNames.list以及wrap/vertical状态,条件类名表达也正确。如果希望微调,可将多个布尔对象合并为一个对象,略减创建对象次数,但收益很小,可以按当前写法保留:
const mergedListCls = clsx( `${prefixCls}-list`, contextConfig.classNames.list, classNames.list, { [`${prefixCls}-list-wrap`]: wrap, [`${prefixCls}-list-vertical`]: vertical, }, );packages/x/.dumi/theme/builtins/Previewer/CodePreviewer.tsx (1)
292-301: CodeSandbox 依赖里新增@rc-component/util建议增加版本兜底这里通过
pkgDependencyList['@rc-component/util']注入版本号是合理的,但如果站点构建数据中暂时没有该 key,会导致生成的package.json内出现@rc-component/util: undefined:- '@rc-component/util': pkgDependencyList['@rc-component/util'], + '@rc-component/util': pkgDependencyList['@rc-component/util'] ?? 'latest',这样即便站点数据未及时更新,也能保证 CodeSandbox demo 可安装依赖。
建议本地在文档站点中点一次 “CodeSandbox” 按钮,确认新生成的 package.json 中
@rc-component/util版本字段是有效字符串而非undefined。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (107)
-
package.json(1 hunks) -
packages/x-markdown/.jest.js(1 hunks) -
packages/x-markdown/package.json(1 hunks) -
packages/x-markdown/src/XMarkdown/index.tsx(2 hunks) -
packages/x-markdown/tests/setup.ts(1 hunks) -
packages/x-markdown/tests/setupAfterEnv.ts(1 hunks) -
packages/x-sdk/.jest.js(1 hunks) -
packages/x-sdk/package.json(1 hunks) -
packages/x-sdk/src/x-chat/index.ts(1 hunks) -
packages/x-sdk/tests/setup.ts(1 hunks) -
packages/x-sdk/tests/utils.tsx(1 hunks) -
packages/x/.dumi/components/SemanticPreview.tsx(4 hunks) -
packages/x/.dumi/hooks/useMenu.tsx(2 hunks) -
packages/x/.dumi/hooks/useThemeAnimation.ts(1 hunks) -
packages/x/.dumi/pages/index/common/Container.tsx(2 hunks) -
packages/x/.dumi/pages/index/components/DesignGuide.tsx(2 hunks) -
packages/x/.dumi/pages/index/components/MainBanner.tsx(3 hunks) -
packages/x/.dumi/pages/index/components/SceneIntroduction/index.tsx(2 hunks) -
packages/x/.dumi/pages/index/index.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/IconSearch/CopyableIcon.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/ImagePreview/index.tsx(3 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/bun.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/index.tsx(1 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/npm.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/pnpm.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/utoo.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/InstallDependencies/yarn.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/MarkdownPluginsOverView.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/Previewer/CodePreviewer.tsx(3 hunks) -
packages/x/.dumi/theme/builtins/TokenCompare/index.tsx(2 hunks) -
packages/x/.dumi/theme/builtins/VideoPlayer/index.tsx(2 hunks) -
packages/x/.dumi/theme/common/Color/ColorPalettes.tsx(2 hunks) -
packages/x/.dumi/theme/common/PrevAndNext.tsx(3 hunks) -
packages/x/.dumi/theme/common/styles/Common.tsx(1 hunks) -
packages/x/.dumi/theme/layouts/DocLayout/index.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Content/ColumnCard.tsx(4 hunks) -
packages/x/.dumi/theme/slots/Content/Contributors.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Content/DocAnchor.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Content/index.tsx(2 hunks) -
packages/x/.dumi/theme/slots/ContentTabs/index.tsx(1 hunks) -
packages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsx(1 hunks) -
packages/x/.dumi/theme/slots/Header/Actions.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Header/Logo.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Header/Navigation.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Header/SwitchBtn.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Header/index.tsx(2 hunks) -
packages/x/.dumi/theme/slots/Sidebar/index.tsx(1 hunks) -
packages/x/.jest.js(1 hunks) -
packages/x/components/_util/hooks/use-collapsible.ts(1 hunks) -
packages/x/components/_util/hooks/use-shortcut-keys.ts(1 hunks) -
packages/x/components/_util/motion.ts(1 hunks) -
packages/x/components/_util/warning.ts(1 hunks) -
packages/x/components/actions/ActionsAudio.tsx(2 hunks) -
packages/x/components/actions/ActionsCopy.tsx(2 hunks) -
packages/x/components/actions/ActionsFeedback.tsx(4 hunks) -
packages/x/components/actions/ActionsItem.tsx(2 hunks) -
packages/x/components/actions/ActionsMenu.tsx(2 hunks) -
packages/x/components/actions/Item.tsx(2 hunks) -
packages/x/components/actions/index.tsx(4 hunks) -
packages/x/components/attachments/DropArea.tsx(2 hunks) -
packages/x/components/attachments/FileList/index.tsx(4 hunks) -
packages/x/components/attachments/PlaceholderUploader.tsx(2 hunks) -
packages/x/components/attachments/index.tsx(6 hunks) -
packages/x/components/bubble/Bubble.tsx(6 hunks) -
packages/x/components/bubble/BubbleList.tsx(3 hunks) -
packages/x/components/bubble/Divider.tsx(2 hunks) -
packages/x/components/bubble/EditableContent.tsx(1 hunks) -
packages/x/components/bubble/System.tsx(2 hunks) -
packages/x/components/bubble/TypingContent.tsx(2 hunks) -
packages/x/components/bubble/hooks/useCompatibleScroll.ts(1 hunks) -
packages/x/components/bubble/hooks/useTyping.ts(1 hunks) -
packages/x/components/code-highlighter/CodeHighlighter.tsx(4 hunks) -
packages/x/components/conversations/Creation.tsx(2 hunks) -
packages/x/components/conversations/GroupTitle.tsx(3 hunks) -
packages/x/components/conversations/Item.tsx(2 hunks) -
packages/x/components/conversations/__tests__/index.test.tsx(1 hunks) -
packages/x/components/conversations/demo/shortcutKeys.tsx(1 hunks) -
packages/x/components/conversations/hooks/useCreation.tsx(2 hunks) -
packages/x/components/conversations/index.tsx(5 hunks) -
packages/x/components/file-card/FileCard.tsx(5 hunks) -
packages/x/components/file-card/List.tsx(4 hunks) -
packages/x/components/file-card/components/File.tsx(3 hunks) -
packages/x/components/file-card/components/ImageLoading.tsx(3 hunks) -
packages/x/components/mermaid/Mermaid.tsx(5 hunks) -
packages/x/components/prompts/index.tsx(6 hunks) -
packages/x/components/sender/SenderHeader.tsx(4 hunks) -
packages/x/components/sender/SenderSwitch.tsx(3 hunks) -
packages/x/components/sender/SlotTextArea.tsx(5 hunks) -
packages/x/components/sender/TextArea.tsx(2 hunks) -
packages/x/components/sender/__tests__/use-speech.test.tsx(1 hunks) -
packages/x/components/sender/components/ActionButton.tsx(2 hunks) -
packages/x/components/sender/components/LoadingButton.tsx(2 hunks) -
packages/x/components/sender/components/Skill.tsx(2 hunks) -
packages/x/components/sender/hooks/use-speech.ts(1 hunks) -
packages/x/components/sender/index.tsx(5 hunks) -
packages/x/components/sources/Sources.tsx(6 hunks) -
packages/x/components/sources/components/CarouselCard.tsx(3 hunks) -
packages/x/components/suggestion/index.tsx(3 hunks) -
packages/x/components/suggestion/useActive.ts(1 hunks) -
packages/x/components/think/Think.tsx(4 hunks) -
packages/x/components/thought-chain/Item.tsx(4 hunks) -
packages/x/components/thought-chain/Node.tsx(5 hunks) -
packages/x/components/thought-chain/Status.tsx(2 hunks) -
packages/x/components/thought-chain/index.tsx(4 hunks) -
packages/x/components/welcome/index.tsx(6 hunks) -
packages/x/docs/playground/ultramodern.tsx(2 hunks) -
packages/x/package.json(2 hunks)
⛔ Files not processed due to max files limit (7)
- packages/x/scripts/generate-component-changelog.ts
- packages/x/tests/mocks/@rc-component/virtual-list.ts
- packages/x/tests/mocks/rc-virtual-list.ts
- packages/x/tests/setup.ts
- packages/x/tests/setupAfterEnv.ts
- packages/x/tests/utils.tsx
- packages/x/typings/custom-typings.d.ts
✅ Files skipped from review due to trivial changes (2)
- packages/x/components/bubble/hooks/useTyping.ts
- packages/x/docs/playground/ultramodern.tsx
🚧 Files skipped from review as they are similar to previous changes (62)
- packages/x/.dumi/theme/slots/Header/Logo.tsx
- packages/x/.dumi/theme/slots/Footer/AdditionalInfo.tsx
- packages/x/components/sender/tests/use-speech.test.tsx
- packages/x/.dumi/theme/slots/Sidebar/index.tsx
- packages/x/components/actions/ActionsAudio.tsx
- packages/x/.dumi/pages/index/index.tsx
- packages/x-sdk/tests/setup.ts
- packages/x/.dumi/theme/builtins/InstallDependencies/npm.tsx
- packages/x/components/actions/ActionsItem.tsx
- packages/x/components/file-card/components/File.tsx
- packages/x-sdk/package.json
- packages/x/components/sender/index.tsx
- packages/x-sdk/src/x-chat/index.ts
- packages/x/components/_util/hooks/use-shortcut-keys.ts
- packages/x/.dumi/theme/builtins/VideoPlayer/index.tsx
- packages/x/components/bubble/Divider.tsx
- packages/x/components/code-highlighter/CodeHighlighter.tsx
- packages/x/components/sources/Sources.tsx
- packages/x/components/conversations/index.tsx
- packages/x/.dumi/pages/index/common/Container.tsx
- packages/x/components/thought-chain/Node.tsx
- packages/x/components/bubble/System.tsx
- packages/x/components/sender/hooks/use-speech.ts
- packages/x/components/bubble/hooks/useCompatibleScroll.ts
- packages/x/components/sender/components/ActionButton.tsx
- packages/x/components/think/Think.tsx
- packages/x/components/bubble/EditableContent.tsx
- packages/x/.dumi/hooks/useMenu.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/pnpm.tsx
- package.json
- packages/x/components/conversations/tests/index.test.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/yarn.tsx
- packages/x/components/thought-chain/Item.tsx
- packages/x/components/bubble/Bubble.tsx
- packages/x/components/bubble/TypingContent.tsx
- packages/x/.dumi/theme/builtins/IconSearch/CopyableIcon.tsx
- packages/x/components/actions/index.tsx
- packages/x/components/actions/ActionsMenu.tsx
- packages/x/components/attachments/PlaceholderUploader.tsx
- packages/x/.dumi/theme/slots/Header/index.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/utoo.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/bun.tsx
- packages/x/.dumi/components/SemanticPreview.tsx
- packages/x/components/sender/SlotTextArea.tsx
- packages/x/.dumi/theme/layouts/DocLayout/index.tsx
- packages/x/components/attachments/DropArea.tsx
- packages/x/.dumi/theme/slots/Header/Navigation.tsx
- packages/x/components/conversations/hooks/useCreation.tsx
- packages/x/.dumi/theme/slots/Header/Actions.tsx
- packages/x/.dumi/theme/slots/Content/DocAnchor.tsx
- packages/x/.dumi/theme/builtins/InstallDependencies/index.tsx
- packages/x/components/_util/motion.ts
- packages/x/components/sender/SenderSwitch.tsx
- packages/x/components/attachments/FileList/index.tsx
- packages/x/.dumi/theme/builtins/TokenCompare/index.tsx
- packages/x/components/sender/components/LoadingButton.tsx
- packages/x/components/thought-chain/index.tsx
- packages/x/components/conversations/demo/shortcutKeys.tsx
- packages/x-sdk/.jest.js
- packages/x/.dumi/theme/slots/Content/Contributors.tsx
- packages/x/components/thought-chain/Status.tsx
- packages/x/.dumi/theme/builtins/ImagePreview/index.tsx
🧰 Additional context used
🧠 Learnings (2)
📓 Common learnings
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时,需要用中文回复中文评论。该项目的文档支持中英双语。
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时,需要用中文回复中文评论。该项目的文档支持中英双语。
📚 Learning: 2024-11-23T15:50:20.802Z
Learnt from: YumoImer
Repo: ant-design/x PR: 223
File: package.json:224-224
Timestamp: 2024-11-23T15:50:20.802Z
Learning: `rc-drawer` 依赖在 `.dumi/theme/layouts/SidebarLayout` 文件中被使用,是项目中的必要依赖,今后不应建议移除。
Applied to files:
packages/x/.dumi/theme/slots/Content/index.tsxpackages/x/.dumi/hooks/useThemeAnimation.tspackages/x/.dumi/theme/common/styles/Common.tsxpackages/x/.dumi/theme/slots/ContentTabs/index.tsxpackages/x/package.json
🧬 Code graph analysis (1)
packages/x/.dumi/pages/index/components/MainBanner.tsx (1)
packages/x/.dumi/theme/utils.ts (1)
getLocalizedPathname(123-151)
⏰ 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). (4)
- GitHub Check: Socket Security: Pull Request Alerts
- GitHub Check: test
- GitHub Check: build preview
- GitHub Check: size
🔇 Additional comments (54)
packages/x/components/sender/components/Skill.tsx (2)
3-3: 导入语句迁移正确!从
classnames迁移到clsx的导入语句正确,符合 PR 的包体积优化目标。
50-52: clsx 使用正确!类名合并逻辑正确,
clsx的 API 在此场景下与classnames完全兼容。条件类名${componentCls}-close-disabled将在config.disabled为真时正确应用。packages/x/components/conversations/Creation.tsx (1)
1-1: LGTM!依赖迁移正确。从
classnames迁移到clsx的变更正确且 API 完全兼容。这两处改动(导入语句和函数调用)保持了相同的参数和行为,同时有助于减小包体积。Also applies to: 51-51
packages/x/.dumi/pages/index/components/MainBanner.tsx (1)
3-3: 迁移实现正确!从
classnames到clsx的迁移完全正确:
- 导入语句使用了正确的命名导出
- 所有用法(包括条件类名)都与 clsx API 完全兼容
- 无逻辑变更,完美符合依赖重构的目标
Also applies to: 263-263, 268-268, 278-278
packages/x/.dumi/theme/builtins/MarkdownPluginsOverView.tsx (1)
4-4: 导入语句正确!从
classnames迁移到clsx的导入符合 PR 目标,语法正确。packages/x/components/welcome/index.tsx (1)
2-2: LGTM!迁移正确且一致从
classnames到clsx的迁移实现正确,所有用法保持一致。clsx与classnames的 API 完全兼容,且包体积更小,符合本次 PR 的优化目标。Also applies to: 71-71, 87-87, 102-102, 114-114, 147-147
packages/x/components/sender/TextArea.tsx (1)
1-2: 依赖迁移与clsx使用整体看起来是无行为变更的等价替换
pickAttrs/getValue从rc-util迁到@rc-component/util后,调用方式保持不变,getComponent与pickAttrs(restProps, …)的行为预期应与之前一致。className={clsx(\${prefixCls}-input`, classNames.input)}在语义上等价于原来的classnames用法,classNames.input` 为空时也会被安全忽略。唯一需要您再确认的点是工程配置与其他文件用法的一致性:
- 当前写法是
import { clsx } from 'clsx';,clsx库同时提供默认导出和具名导出,但在某些打包/类型配置下两种写法的行为会有差异。- 建议对照本仓库其他使用
clsx的文件,保持统一的导入风格,并跑一遍完整构建和测试,确认不会再出现 ESM/CJS 入口差异导致的报错。整体上这块改动可以接受,只需要在 CI / 打包结果中再确认一次。
Also applies to: 5-5, 177-178
packages/x/.dumi/theme/slots/Content/ColumnCard.tsx (1)
4-4: 迁移实现正确!从
classnames到clsx的迁移在此文件中实现正确。第4行导入已更新为import { clsx } from 'clsx';,三处类名合并的用法(clsx(logo, 'zhihu-logo')、clsx(logo, 'yuque-logo')、clsx(logo, 'juejin-logo'))与原classnamesAPI 完全兼容,且clsx体积更小,符合 PR 的包体积优化目标。clsx依赖已正确添加到packages/x/package.json,整个仓库中未发现classnames的任何残留使用。packages/x/.dumi/pages/index/components/SceneIntroduction/index.tsx (2)
3-3: clsx 的命名导入写法是正确且与官方推荐兼容的
clsx从 1.2.0 起就支持import { clsx } from 'clsx'与默认导入两种形式,这里的写法是合法且常见的,用命名导入也有利于后续统一代码风格。
231-235: classnames → clsx 的迁移在这里是等价替换,行为保持不变
clsx会忽略false/null/undefined等假值,因此
- 只有在
active === item.key时才会拼上styles['item-active'],- 只有在
item.disabled为真时才会拼上styles['item-disabled'],整体逻辑与原先基于 classnames 的实现一致,不会改变样式切换行为。
packages/x/components/_util/hooks/use-collapsible.ts (1)
1-2: 导入迁移验证通过,无需进一步修改。这两处导入变更正确迁移了依赖包:
@rc-component/motion确实导出CSSMotionProps类型@rc-component/util/lib/hooks/useMergedState正确导出了同名 hook导入路径和语法均符合新包的文档规范,类型导入和默认导入的写法都正确。此处变更可以通过。
packages/x/.dumi/theme/slots/Header/SwitchBtn.tsx (3)
1-1: omit 引入路径迁移看起来合理,但需确认版本一致从
rc-util迁移到@rc-component/util/lib/omit与本 PR 的整体方向一致,写法和使用方式保持不变。不过要确保整个仓库中@rc-component/util版本已统一升级,且构建配置对该子路径解析正常(例如 Jest、打包器别名等)。
4-4: 使用命名导入的 clsx 是兼容的,注意确认依赖版本这里从
classnames换成了clsx,并采用import { clsx } from 'clsx';的命名导入写法。根据 clsx 官方文档,默认导入和命名导入clsx在运行时是等价的,两种写法都被支持,只要依赖版本不低于引入命名导出的版本即可。(github.com)
建议确认 package.json 中的 clsx 版本满足这一前提(通常 >= 1.2),以避免老版本在构建或类型检查阶段出现不兼容情况。
87-90: clsx 替换 classNames 在此处无行为差异两处
<span>的className现在通过clsx(labelStyle, value === 1 ? labelXStyle : labelYStyle)构造,只传入字符串样式,与之前使用 classNames 的模式等价,不依赖对象/数组等高级用法,因此在value切换时前后景样式的逻辑保持不变。整体实现清晰可读,符合本次依赖迁移目标。packages/x/components/sources/components/CarouselCard.tsx (4)
35-37: Wrapper 使用clsx合并 className 没问题这里将原来的
classnames切换为clsx,保留了原有的${compCls}-wrapper与外部className合并逻辑,行为一致,看起来没有问题。
40-42: 左侧按钮的禁用态 class 逻辑保持不变
clsx调用方式与原先classnames相同,slide === 0时追加-btn-disabled,逻辑清晰且与现有边界判断一致。
52-54: 右侧按钮禁用条件与分页逻辑一致这里基于
slide === (items?.length || 1) - 1控制禁用态 class,和下方{slide + 1}/{items?.length || 1}的分页计算同源,切换到clsx后语义未变,整体 OK。
3-3: 无需修改。import { clsx } from 'clsx';是完全有效的导入方式。clsx 库同时提供默认导出和具名导出别名,两种导入形式都可以使用。项目中 50+ 个文件均使用此具名导入模式,包括同目录的其他组件,表明该导入方式在项目中正确有效。packages/x/components/conversations/Item.tsx (3)
46-51: LGTM!类名合并逻辑正确。
clsx的使用方式与classnames完全兼容,这里的调用模式(字符串、模板字符串和条件对象的组合)在两个库中行为一致。代码逻辑正确,不会引入任何功能回归。
6-6: clsx 依赖已正确配置。
packages/x/package.json中已包含clsx ^2.1.1,且不存在对旧classnames依赖的引用。代码库中无任何残留的classnames导入。迁移工作已完成。
2-2: 所有验证检查已完成,变更正确无误。✓
@rc-component/util已正确添加到packages/x/package.json的依赖中(版本^1.4.0)
✓pickAttrsAPI 在@rc-component/util和rc-util中兼容
✓ 代码中的导入已正确迁移(第 2 行)
✓ 不存在孤立的旧导入此变更可以合并。
packages/x/components/attachments/index.tsx (2)
126-220: 类名合并工具迁移正确所有
clsx()调用的用法都正确,与原classnamesAPI 完全兼容:
- 第 126 行:简单的字符串参数合并
- 第 174 行:合并 context 和 props 类名
- 第 191、200 行:合并根类名
- 第 211-220 行:混合使用字符串、对象(条件类名)和变量
这些都是
clsx和classnames的标准用法,迁移平滑。该重构有助于减小 bundle 尺寸,符合 PR 目标。
1-3: 导入迁移已正确完成从
rc-util迁移到@rc-component/util以及从classnames迁移到clsx的导入已验证无误。确认项:
- 第 1 行:
useEvent和useMergedState正确从@rc-component/util导入- 第 3 行:
clsx正确从clsx包导入packages/x/package.json中已添加依赖:"clsx": "^2.1.1"和"@rc-component/util": "^1.4.0"- 第 126、174、191、200、211 行的
clsx()调用均已正确更新- 仓库中不存在遗漏的
classnames或旧rc-util引用迁移完整,无需进一步修改。
packages/x/components/actions/ActionsCopy.tsx (2)
75-86: 类名合并逻辑正确
clsx()的使用方式符合其 API 规范:
- 正确处理字符串、变量和条件对象
- 条件类名
{ [\${copyCls}-rtl`]: direction === 'rtl' }的语法在clsx` 中完全支持迁移不会影响组件的类名合并逻辑。
1-3: 依赖迁移正确,已验证无遗留包导入变更已确认无误:
pickAttrs已从rc-util迁移到@rc-component/util(第1行)classnames已迁移到clsx,使用命名导入(第3行)全量扫描确认迁移完整:
- 整个代码库中无遗留的
rc-util/lib/pickAttrs导入- 无遗留的
classnames包导入- 47 个文件已使用
clsx,36 个文件已使用@rc-component/util迁移对包体积优化的目标已实现,无需进一步处理。
packages/x/components/suggestion/useActive.ts (1)
1-1: useEvent 引入路径迁移符合 PR 目标从
rc-util迁移到@rc-component/util与本 PR 目的完全一致,且不会改变useActive的对外行为。请确认仓库里已升级并安装了合适版本的@rc-component/util,并跑一遍构建与测试,确保该包确实以命名导出的形式提供useEvent,避免因打包配置或 ESM/CJS 差异导致再次出现Unexpected token 'export'之类问题。packages/x/components/sender/SenderHeader.tsx (2)
2-4: rc-motion 与 classnames 的依赖迁移在本文件里是正确的这里把
rc-motion换成了@rc-component/motion的默认导出CSSMotion,并显式引入MotionEventHandler类型,同时将原来的classnames切换为从clsx的命名导入,写法和这两个库的官方推荐方式是一致的。建议再整体确认一下:package.json/tsconfig中已经移除旧的rc-motion、classnames,并且其它文件的导入风格(默认还是命名导出)与本文件保持统一即可。
82-84: classNames → clsx 的替换方式在这里是等价且安全的三处
clsx(...)调用都沿用了原来classNames的使用模式(基础前缀 + 状态 class + 可选classes.*扩展 + RTL 条件对象),clsx对undefined/ 假值参数和对象键的处理与classnames保持兼容,因此这些修改不会改变现有的 class 拼接结果,逻辑上可以直接通过。Also applies to: 97-98, 120-121
packages/x/components/prompts/index.tsx (2)
1-4: 依赖迁移到 @rc-component/ 与 clsx 看起来是正确的*
CSSMotion从@rc-component/motion默认导入与原rc-motionAPI 保持一致。(npmjs.com)composeRef从@rc-component/util/lib/ref引入与原rc-util/lib/ref路径风格一致,符合本次 rc-* → @rc-component/* 的迁移目标。(npmjs.com)clsx官方支持默认导出和命名导出(import { clsx } from 'clsx'),当前用法是合法且推荐的别名形式。(github.com)这一段整体改动与 antd 6.x 主仓的依赖选择保持一致,没有明显兼容性风险。
199-200: 各处 className 从 classnames 切换到 clsx 的语义保持一致
- 根节点
className={clsx(mergedCls, motionClassName)}:在 motion 注入的类名基础上追加外层合成类,顺序合理。- 标题
Typography.Title、item 容器、content 容器分别用 clsx 合并基础 BEM 类、contextConfig.classNames.*与自定义classNames.*,都只是在运算函数层面替换,没有更改条件逻辑。- clsx 对
undefined和false值会自动忽略,因此contextConfig.classNames.*/classNames.*这类可选字段在未传入时不会产生多余空类名。整体来看,这几处替换是无副作用的等价重构,达到统一 className 工具的目的。
Also applies to: 206-210, 225-233, 244-248
packages/x/components/actions/ActionsFeedback.tsx (2)
84-96: 代码变更正确!
clsx的使用方式正确,API 与classnames完全兼容。类名合并逻辑保持不变。
111-120: 代码变更正确!
clsx的使用方式正确,条件逻辑也符合预期(like 按钮检查value === 'like')。packages/x/.dumi/theme/common/styles/Common.tsx (1)
1-3:updateCSS路径迁移到@rc-component/util与整体重构一致这里只是把
updateCSS的来源从rc-util换成了@rc-component/util,调用方式未变,在React.useInsertionEffect中注入全局 CSS 的行为也保持一致。只要对应的@rc-component/util已在相关package.json中声明,这里就没有额外风险。packages/x/.dumi/hooks/useThemeAnimation.ts (1)
1-4: 动态样式工具从rc-util迁移到@rc-component/util
removeCSS/updateCSS的调用方式保持不变,只调整了包来源,契合本次 rc-* → @rc-component/* 的整体迁移,现有主题切换动画逻辑不会受到影响。后续只需确保所有使用这些工具的包在 Jest 与打包配置中都已覆盖@rc-component/util即可。packages/x/.jest.js (1)
1-35: 在 Jest 中编译@rc-component/*模块是必要的把
'@rc-component'加入compileModules,从而在transformIgnorePatterns中将该作用域下的包标记为“需要编译”,可以避免 ESM 形式的@rc-component/*在 Jest 里抛出SyntaxError: Unexpected token 'export',这与 PR 里提到的错误现象对应,调整是合理的。建议确认其它 package(例如 markdown、sdk 等)的 Jest 配置也都已同步包含
'@rc-component',保持一致性。packages/x-markdown/.jest.js (1)
1-35: 为 x-markdown 的 Jest 配置补充@rc-component编译白名单这里在
compileModules中加入'@rc-component',与主包的 Jest 配置保持一致,确保 markdown 相关测试在处理@rc-component/*依赖时不会被transformIgnorePatterns忽略,避免 ESM 解析错误,调整方向正确。packages/x/components/_util/warning.ts (1)
1-1: warning 工具迁移到@rc-component/util保持了现有告警逻辑仅调整了
rcWarning与resetWarned的导入来源,内部的warning封装、devUseWarning以及废弃信息聚合逻辑都保持不变,行为预期与迁移前一致。后续可以依赖现有单测或运行时日志,确认在开发与测试环境下的告警输出没有差异。packages/x/.dumi/theme/slots/Content/index.tsx (1)
2-3: 从classnames切换到clsx,rtl布局类名行为保持不变这里用
clsx(styles.articleWrapper, { rtl: isRTL })替换原来的类名工具,依旧通过对象形式按布尔值控制rtl类名,和原本classnames的用法语义一致,不会改变 RTL 与默认布局下生成的className。整体上是一次无行为差异的工具替换。Also applies to: 60-61
packages/x/components/actions/Item.tsx (1)
2-3:Item组件使用clsx组合类名的迁移是等价的
className={clsx(\${prefixCls}-item`, classNames.item, { [`${prefixCls}-list-danger`]: item?.danger })}与原先的classnames` 写法在语义上等价:
- 总是带上基础的
\${prefixCls}-item``;- 若
classNames.item存在则追加;item?.danger为真时再加上 danger 态类名。因此这次替换不会影响
Item的样式或点击行为,仅减少依赖体积,符合本次 PR 的重构目标。Also applies to: 31-33
packages/x-markdown/package.json (1)
51-57: 依赖从classnames迁移到clsx完整无误包依赖已正确从
classnames迁移至clsx@^2.1.1。经验证,仓库中不存在残留的classnames依赖或导入,clsx 在packages/x-markdown/src/XMarkdown/index.tsx中已正确导入并用于类名合并(第 24 行:clsx('x-markdown', rootClassName, className))。迁移完整无遗留。packages/x/.dumi/theme/common/PrevAndNext.tsx (1)
4-4: Prev/Next 使用 clsx 迁移语义一致,可以直接接受这里将
classnames换成clsx且参数顺序保持不变(pageNav、prevNav/nextNav、外部prev/next.className),行为与之前一致,没有引入新的边界情况。Also applies to: 148-158
packages/x/components/bubble/BubbleList.tsx (1)
1-3: BubbleList 中 util 路径与 clsx 迁移看起来是无损替换
omit/pickAttrs切到@rc-component/util/es/*与该包实际导出保持一致,仅是命名空间迁移。- 两处
classnames改为clsx,参数顺序未变,依旧覆盖rootClassName/className/ 语义 class(如*-autoscroll),渲染结果与之前一致。这块改动可以直接合入。
Also applies to: 131-135, 152-159, 216-218
packages/x/components/conversations/GroupTitle.tsx (1)
2-4: GroupTitle 的 motion 与 clsx 迁移与 antd 生态保持一致
CSSMotion/CSSMotionProps改为从@rc-component/motion引入,符合 rc 系列整体重命名策略,类型签名保持不变。- 所有
classnames(...)替换为clsx(...)仅更换工具函数,group-title、group-label、折叠触发器以及 motion 容器的 class 组合逻辑与之前一致。整体修改可以放心合并。
请在本包内跑一遍现有测试或本地切换分组展开/收起,确认动画行为与迁移前一致即可。
Also applies to: 47-59, 52-53, 55-58, 65-67
packages/x/.dumi/theme/builtins/Previewer/CodePreviewer.tsx (1)
6-6: CodePreviewer 中使用 clsx 组合 code box/高亮区域 class 是等价迁移
codeBoxClass与highlightClass使用clsx以布尔对象控制展开态,与之前classnames写法一一对应,不会改变最终渲染的 className,仅替换为更轻量的工具函数。Also applies to: 163-167, 170-172
packages/x/.dumi/theme/common/Color/ColorPalettes.tsx (1)
1-1: ColorPalettes 使用 clsx 只做等价替换根节点
className={clsx('color-palettes', { 'color-palettes-dark': dark })}与原classnames用法一致,dark 为真才追加深色样式,不影响现有展示逻辑。Also applies to: 81-88
packages/x/components/mermaid/Mermaid.tsx (1)
3-3: Mermaid 组件中 clsx 迁移保持原有样式组合语义
mergedCls保留了prefixCls、上下文配置的className/classNames.root、外部className、hashId/cssVarCls 以及 RTL 标记,改用clsx后输出完全等价。- header、graph、code 三处仅从
classnames改为clsx,依旧是简单的字符串 + 条件 class 组合,没有改变什么时候显示隐藏图表或代码视图的逻辑。整体实现稳妥,可直接合并。
Also applies to: 79-90, 272-277, 299-305, 314-318
packages/x/components/suggestion/index.tsx (1)
3-5: Suggestion 组件:hooks 与 clsx 迁移整体正确,仅有一处可选的小增强
useEvent/useMergedState从@rc-component/util根导入与该包的index.d.ts定义一致,等价于原先从 rc-util hooks 引入,不改变受控/非受控与事件回调的语义。rootClassName与内部内容容器的className={clsx(...)}
- 继续同时合并
rootClassName、className、语义 class(如*-block、*-content)以及 hashId/cssVarCls;block为真时追加${prefixCls}-block,与此前逻辑一致。- 可选的小改进:为了与其它组件(如 Mermaid)中对
contextConfig的用法风格一致,可以考虑后续将
contextConfig.classNames.content改为contextConfig.classNames?.content,contextConfig.styles.content改为contextConfig.styles?.content,
以防未来useXComponentConfig返回时某些字段为空对象以外的 falsy 值。不过这不是本次 PR 新引入的问题,可以视情况另起 PR 优化。整体迁移方向是对的,建议合并后通过一次构建 + Suggestion 交互回归(尤其是受控 open 场景)。
Also applies to: 93-100, 107-116, 174-184, 201-213
packages/x/package.json (1)
80-92: 依赖从rc-*迁移到@rc-component/*与引入clsx的迁移已完成
- 运行时依赖新增
clsx、@rc-component/motion、@rc-component/util,版本号与 antd 主仓当前使用的一致,有利于减少重复依赖和 bundle 体积。- devDependencies 中补充
@rc-component/drawer、@rc-component/resize-observer、@rc-component/table、@rc-component/virtual-list,对应之前 rc-* 包的迁移。- 已确认源码中不存在旧的
rc-*或classnames的 import,package.json 中也不存在遗留的旧依赖声明。packages/x-sdk/tests/utils.tsx (1)
1-2: 测试工具中resize-observer路径迁移看起来是等价替换这里只是将
rc-resize-observer的 es/lib 工具路径迁移到@rc-component/resize-observer,triggerResize的调用方式未变,测试语义也保持一致,看起来是无损迁移。Also applies to: 70-72
packages/x-markdown/tests/setup.ts (1)
43-48: 注释同步到新的依赖命名即可,代码逻辑本身无变化这里只是把说明从旧的
rc-motion更新为新的命名空间,和下方AnimationEvent/TransitionEvent的 hack 一致,行为不变,可以保持。packages/x-markdown/src/XMarkdown/index.tsx (1)
1-2:classnames→clsx迁移在这里是 1:1 等价替换
clsx('x-markdown', rootClassName, className)与原先classnames(...)的调用方式一致,mergedCls仍然是简单的类名合并,渲染逻辑保持不变。- 仓库
packages/x-markdown依赖clsx@^2.1.1,已远超 v1.2.0 最低要求,命名导出import { clsx } from 'clsx'完全支持。packages/x/components/file-card/List.tsx (1)
2-5:List中对 motion 与类名工具的迁移基本是 1:1 等价
CSSMotionList从@rc-component/motion引入,API 与原 rc-motion 保持一致,keys/motionName/component/motionAppear/motionLeave/motionEnter等 props 完全对应,动画行为没有变化。- 所有
classnames(...)都按相同参数顺序替换为clsx(...),包括:
mergedCls组合根节点类名与 RTL 标记(行 63-73);- content 容器的 overflow / ping / size 状态类(行 127-132);
- item wrapper 上的
${compCls}-item+ motionCls(行 149);- 传给
FileCard的className合并 item 自带类与列表级classNameCard(行 157)。
这些改动都是机械式迁移,无逻辑回归。可选优化:行 125 外层
<div className={clsx(mergedCls)}>中,mergedCls已经是 clsx 返回的字符串,可简化为className={mergedCls}以减少一次函数调用(纯可选)。packages/x/components/file-card/FileCard.tsx (1)
14-18:FileCard:pickAttrs 迁移与 clsx 替换整体符合预期
pickAttrs改为从@rc-component/util/lib/pickAttrs引入,这是 rc-util 同一仓库的新命名空间版本,API 保持「从 props 中挑出合法 DOM/ARIA/DATA 属性」的行为不变。第 190-194 行domProps = pickAttrs(restProps, { attr: true, aria: true, data: true })的使用方式与之前一致。- 根节点
mergedCls(第 202-213 行)的构成全部通过clsx合并,包含prefixCls、contextConfig.className、className、rootClassName、classNames.root、hashId、cssVarCls和 RTL 标记,语义等价于原先classnames(...)的写法。- image / video / audio 三个分支中:
- 第 258 行:image wrapper className 改用
clsx- 第 265 行:
Image的rootClassName改用clsx- 第 284 行:video 元素的 className 改用
clsx- 第 294 行:audio 元素的 className 改用
clsx已验证 package.json 中
@rc-component/util版本为 ^1.4.0,且未存在直接的rc-util依赖,pickAttrs 路径完全正确。所有类名合并工具替换仅涉及工具层面,未改动任何条件逻辑或样式 key,展示行为保持不变。packages/x/components/file-card/components/ImageLoading.tsx (1)
2-2:ImageLoading中的类名合并改用clsx迁移已完成
- 外层容器、Skeleton
rootClassName和内部 Flex 上的类名拼接都按原来的对象/字符串模式等价地换成了clsx(...),条件类(-image-spin-${size})逻辑保持不变mergeSinkProps的使用方式未改动,loading 文案与 icon 的展示逻辑也一致- 包级别依赖已正确更新:
clsx@^2.1.1在 dependencies 中,classnames已移除- file-card 组件内所有文件(List.tsx、FileCard.tsx、File.tsx、ImageLoading.tsx)均已迁移至 clsx,无残留的 classnames 导入
| import pickAttrs from '@rc-component/util/lib/pickAttrs'; | ||
| import { Tooltip } from 'antd'; | ||
| import classnames from 'classnames'; | ||
| import pickAttrs from 'rc-util/lib/pickAttrs'; | ||
| import { clsx } from 'clsx'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# 检查是否还有旧的 rc-util 导入残留
echo "=== 检查 rc-util 旧导入 ==="
rg -n "from 'rc-util" --type=tsx --type=ts -g '!node_modules' || echo "未找到 rc-util 导入"
echo -e "\n=== 检查 @rc-component/util 新导入 ==="
rg -n "from '@rc-component/util" --type=tsx --type=ts -g '!node_modules' -C 1 || echo "未找到 @rc-component/util 导入"
echo -e "\n=== 检查 classnames 旧导入 ==="
rg -n "from ['\"]classnames['\"]" --type=tsx --type=ts -g '!node_modules' || echo "未找到 classnames 导入"
echo -e "\n=== 检查 clsx 新导入 ==="
rg -n "from ['\"]clsx['\"]" --type=tsx --type=ts -g '!node_modules' || echo "未找到 clsx 导入"Repository: ant-design/x
Length of output: 361
🏁 Script executed:
#!/bin/bash
# 检查是否还有旧的 rc-util 导入残留
echo "=== 检查 rc-util 旧导入 ==="
rg "from 'rc-util" -g '*.ts' -g '*.tsx' -g '!node_modules' || echo "未找到 rc-util 导入"
echo -e "\n=== 检查 @rc-component/util 新导入 ==="
rg "from '@rc-component/util" -g '*.ts' -g '*.tsx' -g '!node_modules' -C 1 || echo "未找到 @rc-component/util 导入"
echo -e "\n=== 检查 classnames 旧导入 ==="
rg "from ['\"]classnames['\"]" -g '*.ts' -g '*.tsx' -g '!node_modules' || echo "未找到 classnames 导入"
echo -e "\n=== 检查 clsx 新导入 ==="
rg "from ['\"]clsx['\"]" -g '*.ts' -g '*.tsx' -g '!node_modules' || echo "未找到 clsx 导入"
echo -e "\n=== 查看 ActionsFeedback.tsx 文件的前 20 行 ==="
cat -n packages/x/components/actions/ActionsFeedback.tsx | head -20Repository: ant-design/x
Length of output: 13427
🏁 Script executed:
#!/bin/bash
# 查看 ActionsFeedback.tsx 的完整内容
cat -n packages/x/components/actions/ActionsFeedback.tsxRepository: ant-design/x
Length of output: 5563
导入变更符合库迁移目标,但发现第 138 行存在逻辑错误。
@rc-component/util 的 pickAttrs API 与 rc-util 完全兼容,clsx 与 classnames 行为一致。代码库中已无旧库导入残留,整个迁移已全面完成。
但第 138 行存在逻辑错误:
[`${classNames.disliked}`]: classNames.disliked && value === 'like', // ❌ 应为 'dislike'应改为:
[`${classNames.disliked}`]: classNames.disliked && value === 'dislike',这会导致 dislike 按钮在选中状态时无法应用 disliked 样式类。
🤖 Prompt for AI Agents
In packages/x/components/actions/ActionsFeedback.tsx around lines 138 (file
header lines 2-4 show imports), the conditional assigning the 'disliked' CSS
class uses the wrong comparison (value === 'like'); change the condition so it
checks value === 'dislike' when classNames.disliked is present so the disliked
class is applied when the value is 'dislike'.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
这是 #1194 刻意为之的,不是本PR修改的。
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# 查看 PR #1194 的相关信息以了解该逻辑的背景
gh pr view 1194 --repo ant-design/x --json title,body,url
Length of output: 1566
@yoyo837 感谢您的澄清!我查看了 PR #1194 的信息,确认该逻辑是在那个 PR 中有意设计的(涉及 Actions 语义化修复)。
非常抱歉误将这个现有的逻辑标记为问题。您说得对,这不是本 PR #1448 修改的内容。本 PR 专注于依赖迁移(rc-* → @rc-component/*,classnames → clsx),没有改变业务逻辑。
再次感谢您的指正!🙏
🧬 Code Graph Analysis Results
<no_relevant_code_snippets>
- File: packages/x/components/x-provider/index.tsx, lines 79-79
useXProviderContext
- File: packages/x/components/actions/interface.ts, lines 4-4
export type SemanticType = 'root' | 'item' | 'itemDropdown';
- File: packages/x/components/actions/ActionsAudio.tsx, lines 12-12
export type SemanticType = 'root' | 'default' | 'running' | 'error' | 'loading';
- File: packages/x/components/actions/ActionsCopy.tsx, lines 9-9
export type SemanticType = 'root';
🧠 Learnings used
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时,需要用中文回复中文评论。该项目的文档支持中英双语。
Learnt from: afc163
Repo: ant-design/x PR: 0
File: :0-0
Timestamp: 2025-04-11T14:47:09.527Z
Learning: 当评审 ant-design/x 仓库中的 PR 时,需要用中文回复中文评论。该项目的文档支持中英双语。
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@kimteayon 看看这个
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Seems like the humans are having a chat. I'll hop back into my burrow for now. If you need me again, just tag @coderabbitai in a new comment, and I'll come hopping out!
|
@gemini-code-assist Please review again. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Code Review
This pull request is a large-scale refactoring that migrates dependencies from rc-* to @rc-component/* and replaces classnames with the more lightweight clsx for bundle size optimization. The changes are extensive and consistently applied across the codebase. The migration appears to be thorough and well-executed. I've found one minor issue with an incorrect import path which I've commented on. Overall, this is a great improvement for dependency management and bundle size.
|
@coderabbitai Review again please. |
|
@yoyo837: I'll review the changes in this PR again. This is a significant refactoring that migrates all 🧠 Learnings used✅ Actions performedReview triggered.
|
|
@coderabbitai #1448 (comment) 处preview构建失败,怎么解决? |
|
Tip For best results, initiate chat on the files or code changes. 🧩 Analysis chain🏁 Script executed: Length of output: 238 🏁 Script executed: Length of output: 189 🏁 Script executed: Length of output: 1031 🏁 Script executed: Length of output: 1374 🏁 Script executed: Length of output: 3686 🏁 Script executed: Length of output: 7134 🏁 Script executed: Length of output: 4834 🏁 Script executed: Length of output: 2236 🏁 Script executed: Length of output: 8515 🏁 Script executed: Length of output: 7532 @yoyo837 我已经找到preview构建失败的原因了。 根据工作流日志分析,问题出在Surge部署步骤: 问题原因: 当前使用的 解决方案:
由于这涉及到仓库的 secrets 配置,需要 @afc163 或其他有管理员权限的维护者来处理 SURGE_TOKEN 的更新。 🧠 Learnings used |
size-limit report 📦
|

中文版模板 / Chinese template
🤔 This is a ...
🔗 Related Issues
💡 Background and Solution
📝 Change Log
Summary by CodeRabbit
Refactor
Chores
Tests
✏️ Tip: You can customize this high-level summary in your review settings.