fix[ant-design#42120] use fontWeightStrong token for Typography.Text strong by p-a · Pull Request #54185 · ant-design/ant-design

p-a · 2025-06-24T07:40:16Z

🤔 This is a ...

🔗 Related Issues

💡 Background and Solution

fontWeight was hard coded for Typography.Text strong and Tree titles.
This fix replaces the hard coded value with the fontWeightStrong token .

📝 Change Log

Language	Changelog
🇺🇸 English	Typography.Text strong font-weight now uses the `fontWeightStrong` token.
🇨🇳 Chinese	Typography.Text 强字体粗细现在使用 `fontWeightStrong` 标记

…strong and tree title

bolt-new-by-stackblitz · 2025-06-24T07:40:20Z

Run & review this pull request in StackBlitz Codeflow.

coderabbitai · 2025-06-24T07:40:24Z

📝 Walkthrough

Summary by CodeRabbit

样式
- 树节点标题和 strong 元素的字体粗细现在会根据主题配置动态调整，更好地适配自定义主题。

Walkthrough

本次更改将部分组件中硬编码的字体粗细（fontWeight）替换为基于主题 token 的动态值。具体涉及树组件和排版组件，将原先的固定数值替换为 fontWeightStrong 设计 token，从而支持通过主题自定义字体粗细。

Changes

文件	变更摘要
components/tree/style/index.ts	将过滤节点标题的 fontWeight 从硬编码 500 改为使用 token.fontWeightStrong
components/typography/style/mixins.ts	将 strong 元素的 fontWeight 从硬编码 600 改为使用 token.fontWeightStrong

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant ThemeProvider
    participant TreeComponent
    participant TypographyComponent

    User->>ThemeProvider: 提供自定义 fontWeightStrong
    ThemeProvider->>TreeComponent: 注入 token.fontWeightStrong
    ThemeProvider->>TypographyComponent: 注入 token.fontWeightStrong
    TreeComponent->>TreeComponent: 渲染节点，使用 token.fontWeightStrong
    TypographyComponent->>TypographyComponent: 渲染 strong，使用 token.fontWeightStrong

Assessment against linked issues

Objective	Addressed	Explanation
允许通过 design token 动态配置 fontWeight（#42120）	✅
移除 fontWeight 的硬编码（#42120）	✅

Suggested labels

lgtm

Suggested reviewers

li-jia-nan
afc163
zombieJ

Poem

兔子挥笔改字体，
粗细随主题自定义。
不再硬编码，
设计 token 来掌舵。
树与排版皆灵动，
风格随你变，
代码焕新容！

📜 Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between a998a00 and 0490cbf.

📒 Files selected for processing (2)

components/tree/style/index.ts (1 hunks)
components/typography/style/mixins.ts (1 hunks)

🧰 Additional context used

📓 Path-based instructions (3)

`**/*.{js,jsx,ts,tsx}`: Component should have a `ref` prop that provides an object with at least a `nativeElement: HTMLElement` and a `focus: VoidFunction`.

**/*.{js,jsx,ts,tsx}: Component should have a ref prop that provides an object with at least a nativeElement: HTMLElement and a focus: VoidFunction.

components/typography/style/mixins.ts
components/tree/style/index.ts

`components/*/style/**`: 每个组件的样式应该放在 style/ 目录下，样式文件应与组件结构保持一致。

components/*/style/**: 每个组件的样式应该放在 style/ 目录下，样式文件应与组件结构保持一致。

components/typography/style/mixins.ts
components/tree/style/index.ts

`**/*.{ts,tsx}`: 所有组件和函数必须提供准确的类型定义。避免使用 `any` 类型，尽可能精确地定义类型。使用接口（interface）而非类型别名（type）定义对象结构。导出所有公共接口类型，方便用户使用。确保编译无任何类型错误或警告。组件 props 应使用 interface 定义，便于扩展。组件 props 接口命名应为...

**/*.{ts,tsx}: 所有组件和函数必须提供准确的类型定义。
避免使用 any 类型，尽可能精确地定义类型。
使用接口（interface）而非类型别名（type）定义对象结构。
导出所有公共接口类型，方便用户使用。
确保编译无任何类型错误或警告。
组件 props 应使用 interface 定义，便于扩展。
组件 props 接口命名应为 ComponentNameProps。
为组件状态定义专门的接口，如 ComponentNameState。
复杂的数据结构应拆分为多个接口定义。
组件的 ref 类型应该明确定义，使用 React.ForwardRefRenderFunction。
所有回调函数类型应明确定义参数和返回值。
为复杂泛型提供类型别名以提高可读性。
扩展原生 DOM 元素属性时，继承相应的内置类型。
组件 Props 使用 interface 定义。
工具类型使用 type 定义。
导出类型时使用 export type。
组件属性使用 JSDoc 注释说明用途。
为复杂的类型、函数、组件添加 JSDoc 注释。
在 interface 和重要类型定义上添加文档注释。

components/typography/style/mixins.ts
components/tree/style/index.ts

🔇 Additional comments (2)

components/typography/style/mixins.ts (1)

121-121: LGTM! 正确使用设计token替换硬编码值

将hardcode的字体粗细值替换为 token.fontWeightStrong 符合设计token系统的最佳实践，提高了主题化的一致性和可维护性。

components/tree/style/index.ts (1)

231-231: LGTM! 统一字体粗细token的使用

在Tree组件的过滤节点标题中使用 token.fontWeightStrong 替换硬编码值，与Typography组件的相同变更保持一致，实现了跨组件的样式统一。

✨ Finishing Touches

📝 Generate Docstrings

🧪 Generate Unit Tests

Create PR with Unit Tests
Post Copyable Unit Tests in Comment

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

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

Review comments: Directly reply to a review comment made by CodeRabbit. Example:
- I pushed a fix in commit <commit_id>, please review it.
- Explain this complex logic.
- Open a follow-up GitHub issue for this discussion.
Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
- @coderabbitai explain this code block.
- @coderabbitai modularize this function.
PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
- @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
- @coderabbitai read src/utils.ts and explain its main purpose.
- @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
- @coderabbitai help me debug CodeRabbit configuration file.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

@coderabbitai pause to pause the reviews on a PR.
@coderabbitai resume to resume the paused reviews.
@coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
@coderabbitai full review to do a full review from scratch and review all the files again.
@coderabbitai summary to regenerate the summary of the PR.
@coderabbitai generate docstrings to generate docstrings for this PR.
@coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
@coderabbitai auto-generate unit tests to generate unit tests for this PR.
@coderabbitai resolve resolve all the CodeRabbit review comments.
@coderabbitai configuration to show the current CodeRabbit configuration for the repository.
@coderabbitai help to get help.

Other keywords and placeholders

Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (`.coderabbit.yaml`)

You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
Please see the configuration documentation for more information.
If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

Visit our Documentation for detailed information on how to use CodeRabbit.
Join our Discord Community to get help, request features, and share feedback.
Follow us on X/Twitter for updates and announcements.

github-actions · 2025-06-24T07:40:29Z

👁 Visual Regression Report for PR #54185 Passed ✅

🎯 Target branch: master (99be912)
📖 View Full Report ↗︎
📖 Alternative Report ↗︎

🎊 Congrats! No visual-regression diff found.

github-actions · 2025-06-24T07:40:29Z

pkg-pr-new · 2025-06-24T07:47:40Z

More templates

npm i https://pkg.pr.new/ant-design/ant-design/antd@54185

commit: da9528b

codecov · 2025-06-24T07:47:42Z

Bundle Report

Changes will increase total bundle size by 60 bytes (0.0%) ⬆️. This is within the configured threshold ✅

Detailed changes

Bundle name	Size	Change
antd.min-array-push	3.4MB	60 bytes (0.0%) ⬆️

Affected Assets, Files, and Routes:

view changes for bundle: antd.min-array-push

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
`antd-with-locales.min.js`	30 bytes	1.85MB	0.0%
`antd.min.js`	30 bytes	1.54MB	0.0%

codecov · 2025-06-24T08:20:16Z

Codecov Report

All modified and coverable lines are covered by tests ✅

Please upload report for BASE (master@99be912). Learn more about missing BASE report.
Report is 1 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff             @@
##             master    #54185   +/-   ##
==========================================
  Coverage          ?   100.00%           
==========================================
  Files             ?       774           
  Lines             ?     14032           
  Branches          ?      3717           
==========================================
  Hits              ?     14032           
  Misses            ?         0           
  Partials          ?         0

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

github-actions · 2025-06-26T01:44:53Z

🎉 Thank you for your contribution! If you have not yet joined our DingTalk community group, please feel free to join us (when joining, please provide the link to this PR).

🎉 感谢您的贡献！如果您还没有加入钉钉社区群，请扫描下方二维码加入我们（加群时请提供此 PR 链接）。

fix[ant-design#42120] use fontWeightStrong token for Typography.Text …

0490cbf

…strong and tree title

coderabbitai Bot requested review from afc163, li-jia-nan and zombieJ June 24, 2025 07:40

coderabbitai Bot added the lgtm This PR has been approved by a maintainer label Jun 24, 2025

Merge branch 'master' into fix-42120-typography-text-strong

2634c29

Merge branch 'master' into fix-42120-typography-text-strong

da9528b

yoyo837 approved these changes Jun 26, 2025

View reviewed changes

afc163 merged commit a85f31d into ant-design:master Jun 26, 2025
42 checks passed

zombieJ mentioned this pull request Jun 30, 2025

docs: changelog of 5.26.3 #54234

Merged

17 tasks

Uh oh!

Conversation

p-a commented Jun 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🤔 This is a ...

🔗 Related Issues

💡 Background and Solution

📝 Change Log

Uh oh!

bolt-new-by-stackblitz Bot commented Jun 24, 2025

Uh oh!

coderabbitai Bot commented Jun 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Walkthrough

Changes

Sequence Diagram(s)

Assessment against linked issues

Suggested labels

Suggested reviewers

Poem

Chat

Support

CodeRabbit Commands (Invoked using PR comments)

Other keywords and placeholders

CodeRabbit Configuration File (.coderabbit.yaml)

Documentation and Community

Uh oh!

github-actions Bot commented Jun 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

👁 Visual Regression Report for PR #54185 Passed ✅

Uh oh!

github-actions Bot commented Jun 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

pkg-pr-new Bot commented Jun 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

codecov Bot commented Jun 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Bundle Report

Affected Assets, Files, and Routes:

Assets Changed:

Uh oh!

codecov Bot commented Jun 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

Uh oh!

github-actions Bot commented Jun 26, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

p-a commented Jun 24, 2025 •

edited

Loading

coderabbitai Bot commented Jun 24, 2025 •

edited

Loading

CodeRabbit Configuration File (`.coderabbit.yaml`)

github-actions Bot commented Jun 24, 2025 •

edited

Loading

github-actions Bot commented Jun 24, 2025 •

edited

Loading

pkg-pr-new Bot commented Jun 24, 2025 •

edited

Loading

codecov Bot commented Jun 24, 2025 •

edited

Loading

codecov Bot commented Jun 24, 2025 •

edited

Loading