refactoring rc-motion to @rc-component/motion #364
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
## Walkthrough
本次更新主要将组件和类型中的 `destroyInactivePanel` 属性重命名为 `destroyOnHidden`，并同步更新相关文档、类型定义、测试用例和依赖包。此外，还调整了部分依赖包的来源和版本，统一了类型声明和导入路径。
## Changes
| 文件/文件组 | 变更摘要 |
|-----------------------------------------------------------------------------|------------------------------------------------------------------------------------------------------------|
| .gitignore | 新增忽略 `pnpm-lock.yaml` 文件。 |
| README.md | 将 Collapse 组件文档中的 `destroyInactivePanel` 属性重命名为 `destroyOnHidden`。 |
| package.json | 替换依赖 `rc-motion` 为 `@rc-component/motion`，增加/升级相关依赖和类型定义，提升 React 相关依赖版本。 |
| docs/examples/_util/motionUtil.ts<br>src/Panel.tsx<br>src/interface.ts | 将 motion 相关类型和组件的导入路径从 `rc-motion` 改为 `@rc-component/motion`。 |
| src/Collapse.tsx<br>src/hooks/useItems.tsx<br>src/interface.ts<br>src/Panel.tsx | 将所有 `destroyInactivePanel` 属性及相关逻辑重命名为 `destroyOnHidden`，并同步类型定义和用法。 |
| src/PanelContent.tsx | `PanelContent` 组件 props 类型声明由交叉类型改为 `PropsWithChildren<Readonly<CollapsePanelProps>>`。 |
| src/interface.ts | `CollapsePanelProps` 的 `header` 和 `extra` 属性类型由 `string | React.ReactNode` 改为 `React.ReactNode`。 |
| tests/index.spec.tsx | `KeyCode` 导入路径调整，测试用例中的 `destroyInactivePanel` 改为 `destroyOnHidden`。 |
| now.json | 删除该部署配置文件。 |
| vercel.json | 新增 Vercel 部署配置文件，指定框架为 "umijs"。 |
| .dumirc.ts | 移除配置中的 `outputPath: '.doc'`。 |
| .github/workflows/site-deploy.yml | 修改 GitHub Actions 部署流程，发布目录由 `./.doc` 改为 `./dist`。 |
## Sequence Diagram(s)
```mermaid
sequenceDiagram
participant User
participant Collapse
participant Panel
User->>Collapse: 设置 destroyOnHidden 属性
Collapse->>Panel: 传递 destroyOnHidden
Panel->>Panel: 根据 destroyOnHidden 控制面板销毁Suggested reviewers
Poem
|
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub.
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (11)
.gitignore(1 hunks)README.md(1 hunks)docs/examples/_util/motionUtil.ts(1 hunks)package.json(3 hunks)src/Collapse.tsx(2 hunks)src/Panel.tsx(4 hunks)src/PanelContent.tsx(1 hunks)src/hooks/useItems.tsx(10 hunks)src/index.tsx(1 hunks)src/interface.ts(4 hunks)tests/index.spec.tsx(2 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (2)
src/PanelContent.tsx (1)
src/interface.ts (1)
CollapsePanelProps(46-68)
src/hooks/useItems.tsx (1)
src/interface.ts (2)
CollapseProps(22-42)CollapsePanelProps(46-68)
🪛 GitHub Actions: ✅ test
src/index.tsx
[error] 1-1: ESLint: 'React' is defined but never used. (@typescript-eslint/no-unused-vars)
🔇 Additional comments (35)
docs/examples/_util/motionUtil.ts (1)
1-5: 依赖包路径更新正确成功将导入路径从
rc-motion更新为@rc-component/motion，与 PR 目标一致。.gitignore (1)
31-31: 添加 pnpm-lock.yaml 到 .gitignore 文件正确地将 pnpm 的锁文件添加到 .gitignore 中，与其他包管理器的锁文件（yarn.lock、package-lock.json）保持一致。
README.md (1)
81-81: 文档中属性名称统一更新成功将文档中的
destroyInactivePanel更新为destroyOnHidden，与代码变更保持一致。tests/index.spec.tsx (2)
3-3: 依赖包路径更新正确成功将导入路径从
rc-util/lib/KeyCode更新为@rc-component/util/lib/KeyCode，与 PR 目标一致。
243-243: 测试用例属性名称统一更新成功将测试代码中的
destroyInactivePanel更新为destroyOnHidden，与其他文件的变更保持一致。src/Collapse.tsx (2)
23-23: 属性名称更改：destroyInactivePanel -> destroyOnHidden属性名称从
destroyInactivePanel更改为destroyOnHidden，这使得属性名称更加直观，更好地描述了其功能：在面板隐藏时销毁内容。
75-75: 保持属性名称一致性在
useItems钩子中正确地使用更新后的destroyOnHidden属性名，保持了整个代码库的一致性。package.json (4)
49-49: 依赖包更新：rc-motion -> @rc-component/motion将
rc-motion替换为@rc-component/motion，与 PR 标题 "refactoring rc-motion to @rc-component/motion" 保持一致。这是一个好的改进，使用了更标准化的包命名方式。
60-62: TypeScript 类型声明更新添加了
@types/node并更新了 React 相关的类型声明到 v19，这与 React 版本升级保持一致。
77-78: React 依赖升级到 v19将 React 和 React DOM 依赖从 v18 升级到 v19.1.0，确保组件与最新的 React 版本兼容。
82-83: 更新 peerDependencies 的最低要求将 peerDependencies 的最低要求从
>=16.9.0提高到>=18.0.0，这是合理的，因为 React 18 引入了许多新特性和 API 更改。src/PanelContent.tsx (1)
7-7: 改进类型定义将 props 类型从交叉类型
CollapsePanelProps & { children: React.ReactNode }更改为React.PropsWithChildren<Readonly<CollapsePanelProps>>，这是一个更好的做法：
- 使用
Readonly使 props 显式只读，符合 React 的最佳实践- 使用
PropsWithChildren工具类型代替手动添加 children 属性- 代码更简洁且更符合 React 类型系统的标准用法
src/Panel.tsx (4)
2-2: 更新导入路径：rc-motion -> @rc-component/motion从
'rc-motion'更改为'@rc-component/motion'，与 package.json 中的依赖更改保持一致。
26-26: 属性名称更新：destroyInactivePanel -> destroyOnHidden属性名称从
destroyInactivePanel更改为destroyOnHidden，保持了整个代码库的命名一致性。
107-107: 更新 CSSMotion 组件的属性将传递给
CSSMotion组件的属性从destroyInactivePanel更新为removeOnLeave={destroyOnHidden}，这不仅与新的属性名称保持一致，而且使用了@rc-component/motion包中CSSMotion组件期望的属性名。
120-120: 改进代码风格：void 0 -> undefined将
role={accordion ? 'tabpanel' : void 0}更改为role={accordion ? 'tabpanel' : undefined}，这是一个风格上的改进，使用更符合现代 JavaScript 习惯的undefined而不是void 0。两者在功能上等效，但undefined更具可读性。src/hooks/useItems.tsx (13)
10-10: 更新了 Props 类型中的属性名称Props 类型中 CollapseProps 的 Pick 类型，将
destroyInactivePanel属性更名为destroyOnHidden，使命名更加直观。
19-19: 更新了解构赋值中的属性名称解构赋值中的
destroyInactivePanel属性更名为destroyOnHidden，与接口定义保持一致。
35-35: 更新了 item 属性名称item 对象中的
destroyInactivePanel属性更名为destroyOnHidden，保持命名一致性。
43-43: 更新了合并变量名称将
mergedDestroyInactivePanel变量名更新为mergedDestroyOnHidden，并相应更新了引用的属性名。
46-48: 改进了条件语句格式为单行 if 语句添加了明确的花括号，提高了代码的可读性和一致性。
75-75: 更新了组件属性名称CollapsePanel 组件中的
destroyInactivePanel属性更名为destroyOnHidden。
91-93: 改进了空值检查格式为空值检查条件语句添加了明确的花括号，提高了代码的可读性和一致性。
99-99: 更新了解构赋值中的属性名称props 解构赋值中的
destroyInactivePanel属性更名为destroyOnHidden。
113-113: 更新了 child.props 解构赋值中的属性名称child.props 解构赋值中的
destroyInactivePanel属性更名为destroyOnHidden。
128-130: 改进了条件语句格式为单行 if 语句添加了明确的花括号，提高了代码的一致性和可维护性。
144-144: 更新了属性合并逻辑将属性名从
destroyInactivePanel更新为destroyOnHidden，同时保持了同样的合并逻辑 (childDestroyOnHidden ?? destroyOnHidden)。
164-164: 增强了类型安全性为
React.cloneElement添加了类型参数<CollapsePanelProps>，提高了类型安全性。
175-177: 改进了代码格式并增强了类型安全性改进了返回语句的格式，并添加了类型转换
as React.ReactElement<CollapsePanelProps>，确保类型安全。src/interface.ts (6)
1-1: 更新了依赖包路径将
rc-motion导入源更新为@rc-component/motion，符合 PR 标题中提到的重构目标。
31-31: 更新了 CollapseProps 接口属性名将
CollapseProps接口中的destroyInactivePanel属性更名为destroyOnHidden，使命名更加直观。
45-45: 添加了空行在
SemanticName类型定义后添加了空行，改进了代码格式。
48-48: 优化了 header 属性类型将
CollapsePanelProps接口中header属性的类型从string | React.ReactNode简化为React.ReactNode（因为string已包含在React.ReactNode中）。
58-58: 更新了 CollapsePanelProps 接口属性名将
CollapsePanelProps接口中的destroyInactivePanel属性更名为destroyOnHidden，保持整个组件库的命名一致性。
61-61: 优化了 extra 属性类型将
CollapsePanelProps接口中extra属性的类型从string | React.ReactNode简化为React.ReactNode（因为string已包含在React.ReactNode中）。
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## master #364 +/- ##
==========================================
+ Coverage 99.12% 99.15% +0.02%
==========================================
Files 5 5
Lines 114 118 +4
Branches 43 43
==========================================
+ Hits 113 117 +4
Misses 1 1 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
There was a problem hiding this comment.
Pull Request Overview
Refactors animation integration from rc-motion to @rc-component/motion, renames the panel destruction prop, and updates related imports, dependencies, and documentation.
- Renamed
destroyInactivePanelprop todestroyOnHiddenacross interfaces, components, tests, and docs - Replaced
rc-motionwith@rc-component/motionimports and added@rc-component/motiondependency - Updated React and related peer/dev dependencies to version 19.x
Reviewed Changes
Copilot reviewed 10 out of 10 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| tests/index.spec.tsx | Updated import path for KeyCode and prop rename in test |
| src/interface.ts | Swapped CSSMotionProps import and renamed prop types |
| src/hooks/useItems.tsx | Renamed destroyInactivePanel to destroyOnHidden in hook logic |
| src/PanelContent.tsx | Adjusted forwardRef generic to use PropsWithChildren |
| src/Panel.tsx | Updated motion import, prop rename, and cleaned up role default |
| src/Collapse.tsx | Renamed default prop and forwarded prop in main component |
| package.json | Added @rc-component/motion, bumped React versions, removed old lib |
| docs/examples/_util/motionUtil.ts | Updated motion import types |
| README.md | Renamed prop in documentation table |
Comments suppressed due to low confidence (1)
README.md:84
- [nitpick] The description is grammatically awkward. Consider rephrasing to: "Whether to destroy panels when hidden (not active), default false."
<td>If destroy the panel which not active, default false. </td>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary by CodeRabbit
新功能
破坏性变更
依赖更新
文档
测试
配置
忽略文件