refactor: optimize style type #508
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Walkthrough在 src/IDialogPropTypes.tsx 中，将 wrapStyle、bodyStyle、maskStyle 三个公开属性的类型由 Record<string, any> 更改为 CSSProperties。 Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Poem
Tip 🔌 Remote MCP (Model Context Protocol) integration is now available!Pro plan users can now connect to remote MCP servers from the Integrations page. Connect with popular remote MCPs such as Notion and Linear to add more context to your reviews and chats. ✨ Finishing Touches
🧪 Generate unit tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. CodeRabbit Commands (Invoked using PR/Issue comments)Type Other keywords and placeholders
CodeRabbit Configuration File (
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Summary of Changes
Hello @zbw-zbw, 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!
本次拉取请求重构了样式类型声明，以使用 CSSProperties，从而提高类型安全性和代码清晰度。
Highlights
- 类型优化: 在 src/IDialogPropTypes.tsx 中，将 wrapStyle、bodyStyle 和 maskStyle 的通用类型 Record<string, any> 替换为 CSSProperties。这增强了样式属性的类型检查。
Using Gemini Code Assist
The 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 in your pull request via creating an issue comment (i.e. comment on the pull request page) using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands.
| Feature | Command | Description |
|---|---|---|
| Code Review | /gemini review |
Performs a code review for the current pull request in its current state. |
| Pull Request Summary | /gemini summary |
Provides a summary of the current pull request in its current state. |
| Comment | @gemini-code-assist | Responds in comments when explicitly tagged, both in issue comments and review comments. |
| Help | /gemini help |
Displays a list of available commands. |
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 .gemini/ folder in the base of the repository. Detailed instructions can be found here.
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
-
Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (4)
src/IDialogPropTypes.tsx (4)
40-42: 减少 API 重复：引导使用 styles 统一入口（文档/注释层面即可）当前既有
wrapStyle/bodyStyle/maskStyle，也有聚合的styles?: ModalStyles。为降低重复与歧义，建议在这三个单独样式 prop 上添加轻量 JSDoc 注释，提示优先使用styles.wrapper/body/mask。不改变行为，仅作引导：- wrapStyle?: CSSProperties; - bodyStyle?: CSSProperties; - maskStyle?: CSSProperties; + /** 建议优先使用 styles.wrapper 以统一管理样式 */ + wrapStyle?: CSSProperties; + /** 建议优先使用 styles.body 以统一管理样式 */ + bodyStyle?: CSSProperties; + /** 建议优先使用 styles.mask 以统一管理样式 */ + maskStyle?: CSSProperties;
48-49: 将 bodyProps/maskProps/wrapProps 从 any 收紧，提升可维护性这三个
any容易掩盖错误，且难以获益于智能提示。若底层渲染元素是 div，建议收紧为标准属性类型：- bodyProps?: any; - maskProps?: any; + bodyProps?: React.HTMLAttributes<HTMLDivElement>; + maskProps?: React.HTMLAttributes<HTMLDivElement>; ... - wrapProps?: any; + wrapProps?: React.HTMLAttributes<HTMLDivElement>;若底层并非 div，请据实际元素替换为相应的
HTMLAttributes<...>。Also applies to: 53-53
51-52: 在 styles 上补充注释，明确其为推荐的样式入口为配合前述指引，可在
styles字段上加一句注释，帮助使用者优先迁移至聚合 API：- styles?: ModalStyles; + /** 推荐：统一样式入口，可替代 wrapStyle/bodyStyle/maskStyle 的分别传入 */ + styles?: ModalStyles;
40-42: 静态排查结果：未发现内部使用中存在null、数组或字符串赋给 wrapStyle/bodyStyle/maskStyle 的场景，但因其为对外暴露的 API，仍需评估破坏性变更影响。
- 脚本排查（
rg）未在src/下检出以下可疑用法：
- 样式项含
: null- 样式值为数组（例如
boxShadow: [...]）- 整体将字符串或数组赋给
wrapStyle/bodyStyle/maskStyle- 由于这些 prop 定义在公共接口中，虽然当前代码库内部无不合规范用法，但下游用户可能仍在样式对象中使用
null、数组或其它非标准值。建议按照语义化版本管理原则，将此次类型收紧视为破坏性变更并在下一个主版本（major）中发布；若希望提供更平滑的过渡，可短期放宽为联合类型：
- wrapStyle?: CSSProperties; - bodyStyle?: CSSProperties; - maskStyle?: CSSProperties; + // 过渡期：兼容历史 any，用于消化存量调用；后续再移除 Record + wrapStyle?: CSSProperties | Record<string, any>; + bodyStyle?: CSSProperties | Record<string, any>; + maskStyle?: CSSProperties | Record<string, any>;此方案可在主版本中先提供兼容，待下游完成升级后再移除
Record<string, any>。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (1)
src/IDialogPropTypes.tsx(1 hunks)
🔇 Additional comments (1)
src/IDialogPropTypes.tsx (1)
40-42: 将 wrapStyle/bodyStyle/maskStyle 强类型化为 CSSProperties 很棒
- 与已有的
style/rootStyle一致，类型更严谨。- 获得完备的 TS 补全与校验（避免拼写错误与非法取值），对 CSS 变量也友好（
CSSProperties含索引签名）。
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #508 +/- ##
=======================================
Coverage 98.46% 98.46%
=======================================
Files 8 8
Lines 195 195
Branches 68 68
=======================================
Hits 192 192
Misses 3 3 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
优化 style 类型声明
Summary by CodeRabbit