Skip to content

Comments

feat: add pharos circle colorful icon#1571

Open
wangshangluobai wants to merge 4 commits intomainfrom
Yuexian-Pharos
Open

feat: add pharos circle colorful icon#1571
wangshangluobai wants to merge 4 commits intomainfrom
Yuexian-Pharos

Conversation

@wangshangluobai
Copy link
Collaborator

@wangshangluobai wangshangluobai commented Dec 28, 2025

[中文版模板 / Chinese template]

💡 Background and solution

添加 Pharos 链的 circle colorful icon

🔗 Related issue link

Summary by CodeRabbit

  • 新功能

    • 新增“法老圆形彩色”图标,扩展图标库的视觉选项并可直接在项目中使用。
  • 维护/发布

    • 添加并更新变更记录与版本说明,准备发布包含该新图标的包版本。

✏️ Tip: You can customize this high-level summary in your review settings.

@changeset-bot
Copy link

changeset-bot bot commented Dec 28, 2025

🦋 Changeset detected

Latest commit: 13e3216

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 15 packages
Name Type
@ant-design/web3-icons Minor
@ant-design/web3-assets Patch
@ant-design/web3-bitcoin Patch
@ant-design/web3 Patch
@ant-design/web3-eth-web3js Patch
@ant-design/web3-ethers-v5 Patch
@ant-design/web3-ethers Patch
@ant-design/web3-solana Patch
@ant-design/web3-sui Patch
@ant-design/web3-ton Patch
@ant-design/web3-tron Patch
@ant-design/web3-wagmi Patch
@example/eth-web3js Patch
@example/ethers-v5 Patch
@example/ethers Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel
Copy link

vercel bot commented Dec 28, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Review Updated (UTC)
ant-design-web3 Error Error Jan 22, 2026 5:51am

Request Review

@dosubot dosubot bot added the size:M This PR changes 30-99 lines, ignoring generated files. label Dec 28, 2025
@github-actions
Copy link

github-actions bot commented Dec 28, 2025

Preview is ready

@coderabbitai
Copy link

coderabbitai bot commented Dec 28, 2025

Note

Other AI code review bot(s) detected

CodeRabbit 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.

📝 Walkthrough

Walkthrough

新增 PharosCircleColorful React 图标组件并将其导出;新增两个 changeset 文件记录依赖版本/变更说明。更改包含组件实现、索引导出和变更集元信息。

Changes

Cohort / File(s) 变更摘要
Changeset 声明
.changeset/clever-candies-draw.md, .changeset/big-pugs-tell.md
新增两条 changeset,记录对 @ant-design/web3-icons 的版本/变更说明,包含特性说明 "feat: add pharos circle colorful icon"
新增图标组件
packages/icons/src/components/pharos-circle-colorful.tsx
新增 PharosCircleColorful React 组件:基于 Ant Design Icon 封装内联 SVG,支持 ConfigProvider 前缀、className 合并、ref 转发及 displayName,使用 eraseDefaultProps 保护默认属性
索引导出更新
packages/icons/src/index.ts
添加导出:export * from './components/pharos-circle-colorful',将新组件纳入包的公共 API

Sequence Diagram(s)

(无)

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐰 轻踏代码田野间,

彩环跃出新颜面,
小耳一摆送祝愿,
图标库里添新篇,
轻声欢跃向前船 ✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed PR标题准确总结了主要变更:添加Pharos链的circle colorful图标,与changeset文件和代码更改内容完全一致。
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
✨ Finishing touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch Yuexian-Pharos

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.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@gemini-code-assist
Copy link

Summary of Changes

Hello @wangshangluobai, 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 enhances the icon library by adding a new 'Pharos circle colorful icon'. This involves incorporating the SVG graphic, creating a dedicated React component to display it, and ensuring it is properly exported for consumption by other parts of the system.

Highlights

  • New Icon Component Added: A new React component, PharosCircleColorful, has been introduced to render the new icon. This component integrates with Ant Design's icon system and uses a provided SVG asset.
  • SVG Asset Inclusion: The visual definition for the Pharos circle colorful icon is added as a new SVG file, pharos-circle-colorful.svg, within the svgs directory.
  • Icon Export: The newly created PharosCircleColorful component is now exported from the main index.ts file, making it accessible for use throughout the @ant-design/web3-icons library.
  • Changelog Entry: A new changeset file has been added, indicating a 'major' feature addition for the @ant-design/web3-icons package, documenting the inclusion of the Pharos circle colorful icon.

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

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 by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

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 pull request 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

  1. 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.

@github-actions github-actions bot added the major label Dec 28, 2025
@dosubot dosubot bot added the feature Independent new features label Dec 28, 2025
Copy link

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

本次 PR 添加了 Pharos 链的图标。代码基本正确,但有几个地方可以改进。首先,changeset 文件将此次更新错误地标记为 major,而它应该是一个 minor 更新。其次,新添加的 SVG 文件存在一些问题:标题描述性不强,渐变效果的 ID 太过通用可能导致渲染冲突,以及一些从设计工具中残留的多余属性。最后,自动生成的 React 组件的 JSDoc 中包含了一个无效的 base64 编码的 SVG。我已经在代码中留下了具体的修改建议。

Comment on lines +3 to +14
<title>PharosIcon1</title>
<defs>
<linearGradient id="linear-gradient" x1="120.24" y1="7576.74" x2="198.13" y2="7576.74" gradientTransform="matrix(1, 0, 0, -1, 0, 7674.41)" gradientUnits="userSpaceOnUse">
<stop offset="0.17" stop-color="#fff"/>
<stop offset="0.84" stop-color="#fff" stop-opacity="0"/>
</linearGradient>
</defs>
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Layer_2" data-name="Layer 2">
<g id="Layer_1-2" data-name="Layer 1">
<circle fill="#0012b8" cx="155" cy="155" r="155"/>
<path fill="url(#linear-gradient)" d="M198.13,103.39l-46.36-21-31.53,7.32v2.13L160,113Z"/>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

high

此 SVG 文件中存在一些可以优化的地方:

  1. 可访问性: <title> 标签中的 PharosIcon1 描述性不强。建议使用更能描述图标内容的标题,如 Pharos Circle Colorful
  2. 高风险: <linearGradient>id 属性值 linear-gradient 太过通用。当多个 SVG 文件嵌入到同一个 HTML 文档中时,这可能会导致 ID 冲突,从而造成渲染错误。建议为 id 设置一个唯一的值。
  3. 优化: <g> 标签中的 iddata-name 属性似乎是设计工具导出的残留物,在 SVG 中并未使用,可以移除以减小文件体积。

我已经提供了一个代码建议来一次性解决这些问题。

    <title>Pharos Circle Colorful</title>
    <defs>
        <linearGradient id="pharos-circle-colorful-gradient" x1="120.24" y1="7576.74" x2="198.13" y2="7576.74" gradientTransform="matrix(1, 0, 0, -1, 0, 7674.41)" gradientUnits="userSpaceOnUse">
            <stop offset="0.17" stop-color="#fff"/>
            <stop offset="0.84" stop-color="#fff" stop-opacity="0"/>
        </linearGradient>
    </defs>
    <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g>
            <g>
                <circle fill="#0012b8" cx="155" cy="155" r="155"/>
                <path fill="url(#pharos-circle-colorful-gradient)" d="M198.13,103.39l-46.36-21-31.53,7.32v2.13L160,113Z"/>

@@ -0,0 +1,5 @@
---
'@ant-design/web3-icons': major

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

将此更改标记为 major 似乎不正确。根据 Semantic Versioning,主要版本(major)的增加意味着有不兼容的 API 更改。添加一个新图标是一个向后兼容的新功能,应该被归类为 minor 版本更新。

Suggested change
'@ant-design/web3-icons': major
'@ant-design/web3-icons': minor

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

已调整

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

还是 major

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

忘提交了,上次调整成了 patch ,刚才想了下还是根据AI的建议调整成 minor

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

你有两个 changeset 文件,只要一个就够了。这个文件可以删掉。

import { eraseDefaultProps } from '../utils';
import SVGComponent from '../svgs/pharos-circle-colorful.svg';

/**![PharosCircleColorful](data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIGZpbGw9IiNjYWNhY2EiIHdpZHRoPSIyMHB4IiBoZWlnaHQ9IjIwcHgiIHZpZXdCb3g9IjAgMCAzMTAgMzEwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPHRpdGxlPlBoYXJvc0ljb24xPC90aXRsZT4KICAgIDxkZWZzPgogICAgICAgIDxsaW5lYXJHcmFkaWVudCBpZD0ibGluZWFyLWdyYWRpZW50IiB4MT0iMTIwLjI0IiB5MT0iNzU3Ni43NCIgeDI9IjE5OC4xMyIgeTI9Ijc1NzYuNzQiIGdyYWRpZW50VHJhbnNmb3JtPSJtYXRyaXgoMSwgMCwgMCwgLTEsIDAsIDc2NzQuNDEpIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CiAgICAgICAgICAgIDxzdG9wIG9mZnNldD0iMC4xNyIgc3RvcC1jb2xvcj0iI2ZmZiIvPgogICAgICAgICAgICA8c3RvcCBvZmZzZXQ9IjAuODQiIHN0b3AtY29sb3I9IiNmZmYiIHN0b3Atb3BhY2l0eT0iMCIvPgogICAgICAgIDwvbGluZWFyR3JhZGllbnQ+CiAgICA8L2RlZnM+CiAgICA8ZyBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBpZD0iTGF5ZXJfMiIgZGF0YS1uYW1lPSJMYXllciAyIj4KICAgICAgICAgICAgPGcgaWQ9IkxheWVyXzEtMiIgZGF0YS1uYW1lPSJMYXllciAxIj4KICAgICAgICAgICAgICAgIDxjaXJjbGUgZmlsbD0iIzAwMTJiOCIgY3g9IjE1NSIgY3k9IjE1NSIgcj0iMTU1Ii8+CiAgICAgICAgICAgICAgICA8cGF0aCBmaWxsPSJ1cmwoI2xpbmVhci1ncmFkaWVudCkiIGQ9Ik0xOTguMTMsMTAzLjM5bC00Ni4zNi0yMS0zMS41Myw3LjMydjIuMTNMMTYwLDExM1oiLz4KICAgICAgICAgICAgICAgIDxwYXRoIGZpbGw9IiNmZmYiIGQ9Ik0yMTIuMTEsMTcwLjc5bC01Ny4yOS0yNi4zNUwxMDguMzIsMTU3djMuMDdMMTU3LjI1LDE4N2w1NC44Ni0xNi4xNloiLz4KICAgICAgICAgICAgICAgIDxwYXRoIGZpbGw9IiNmZmYiIGQ9Ik0xMjAuMjQsOTEuODRsMzEuNTMtNy4zNUwxODcsNzYuMzFWNTVMMTIwLjI0LDY5LjY5WiIvPgogICAgICAgICAgICAgICAgPHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE5OC4xMiwxMDMuMzksMTYwLDExM2wtNTEuNywxM1YxNjBsNDYuNS0xMi41NCw0My4zLTExLjY5WiIvPgogICAgICAgICAgICAgICAgPHBvbHlnb24gZmlsbD0iI2ZmZiIgcG9pbnRzPSIyMTIuMTEgMTcwLjgzIDE1Ny4yMyAxODYuOTkgOTcuODkgMjA0LjQ1IDk3Ljg5IDI1NSAyMTIuMTEgMjE3Ljk0IDIxMi4xMSAxNzAuODMiLz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+Cg==) */

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

JSDoc 中的 base64 编码的 SVG 预览图像是无效的。解码后,<svg> 标签包含了重复的 widthheight 属性 (width="50" height="50"width="20px" height="20px")。这可能是由生成脚本引起的,但它会导致文档预览工具出错。请修复这个 base64 字符串,移除重复的属性。

@github-actions github-actions bot removed the major label Dec 28, 2025
Copy link

@coderabbitai coderabbitai bot left a 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/icons/src/components/pharos-circle-colorful.tsx (1)

1-2: 生成脚本中的拼写错误

第 2 行注释中有拼写错误:"DON NOT" 应为 "DO NOT"。由于这是自动生成的文件,建议在生成脚本(./scripts/generate.ts)中修复此问题,以确保后续生成的文件不会出现相同错误。

📜 Review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 01dc595 and 67a4298.

⛔ Files ignored due to path filters (2)
  • packages/icons/src/__tests__/__snapshots__/index.test.tsx.snap is excluded by !**/*.snap
  • packages/icons/src/svgs/pharos-circle-colorful.svg is excluded by !**/*.svg
📒 Files selected for processing (3)
  • .changeset/clever-candies-draw.md
  • packages/icons/src/components/pharos-circle-colorful.tsx
  • packages/icons/src/index.ts
🧰 Additional context used
🧠 Learnings (2)
📚 Learning: 2025-11-25T09:58:18.233Z
Learnt from: CR
Repo: ant-design/ant-design-web3 PR: 0
File: .cursor/rules/basic.mdc:0-0
Timestamp: 2025-11-25T09:58:18.233Z
Learning: Applies to **/style/index.{ts,tsx} : Styling implementation should be based on `ant-design/cssinjs` and utilize Ant Design's Design Tokens for custom styling support

Applied to files:

  • packages/icons/src/components/pharos-circle-colorful.tsx
📚 Learning: 2025-11-25T09:58:18.233Z
Learnt from: CR
Repo: ant-design/ant-design-web3 PR: 0
File: .cursor/rules/basic.mdc:0-0
Timestamp: 2025-11-25T09:58:18.233Z
Learning: This is a multi-package React project built on Ant Design component library, designed to provide Web3 projects with wallet connection capabilities and DApp UI components

Applied to files:

  • packages/icons/src/components/pharos-circle-colorful.tsx
⏰ 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: prepare preview
  • GitHub Check: ci
  • GitHub Check: ci
🔇 Additional comments (3)
.changeset/clever-candies-draw.md (1)

2-2: 确认版本变更类型是否正确

此变更集将版本标记为 major(主版本),但添加新图标通常应该是 minor(次版本)变更,因为它是功能添加而非破坏性变更。请确认这是否符合项目的版本控制策略。

packages/icons/src/components/pharos-circle-colorful.tsx (1)

13-27: 实现正确!

组件实现遵循了项目的最佳实践和既定模式:

  • 正确使用 forwardRef 和类型定义
  • 通过 ConfigProvider 获取前缀以支持主题定制
  • 适当合并 CSS 类名
  • 正确转发 ref
  • 设置了 displayName 便于调试
packages/icons/src/index.ts (1)

424-424: 正确添加了导出!

新组件的导出已正确添加到索引文件中,并且按字母顺序正确排列在 phantom-filledpink-circle-colorful 之间。

@codecov
Copy link

codecov bot commented Dec 28, 2025

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 100.00%. Comparing base (01dc595) to head (13e3216).
⚠️ Report is 4 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff            @@
##              main     #1571   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          878       879    +1     
  Lines        18993     19011   +18     
  Branches      1711      1713    +2     
=========================================
+ Hits         18993     19011   +18     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

feature Independent new features size:M This PR changes 30-99 lines, ignoring generated files.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants