Skip to content
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.

Sign up for GitHub

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

Jump to bottom

feat: Text Button tokens #47870

Open
wants to merge 3 commits into
base: feature
Choose a base branch
from
Open

feat: Text Button tokens #47870

wants to merge 3 commits into from

Conversation

madocto
Copy link
Contributor

@madocto madocto commented Mar 14, 2024

[中文版模板 / Chinese template]

🤔 This is a ...

  • New feature
  • Bug fix
  • Site / documentation update
  • Demo update
  • Component style update
  • TypeScript definition update
  • Bundle size optimization
  • Performance optimization
  • Enhancement feature
  • Internationalization
  • Refactoring
  • Code style optimization
  • Test Case
  • Branch merge
  • Workflow
  • Other (about what?)

🔗 Related issue link

close: #47647

💡 Background and solution

📝 Changelog

Language Changelog
🇺🇸 English Button add textColor, textHoverColor and textActiveColor tokens.
🇨🇳 Chinese Button 添加 textColor、textHoverColor 和 textActiveColor 三个 token。

☑️ Self-Check before Merge

⚠️ Please check all items below before requesting a reviewing. ⚠️

  • Doc is updated/provided or not needed
  • Demo is updated/provided or not needed
  • TypeScript definition is updated/provided or not needed
  • Changelog is provided or not needed

@stackblitz StackBlitz
Copy link

stackblitz bot commented Mar 14, 2024

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Mar 14, 2024 •
edited

Preview is ready

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Mar 14, 2024 •
edited

👁 Visual Regression Report for PR #47870 Passed ✅

🎯 Target branch: feature (fe83792)
📖 View Full Report ↗︎

🎊 Congrats! No visual-regression diff found.

@codesandbox-ci CodeSandbox CI
Copy link

codesandbox-ci bot commented Mar 14, 2024 •
edited

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

@codecov Codecov
Copy link

codecov bot commented Mar 14, 2024 •
edited

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 100.00%. Comparing base (fe83792) to head (e21780c).

Additional details and impacted files 
@@            Coverage Diff            @@
##           feature    #47870   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          743       743           
  Lines        12828     12828           
  Branches      3364      3364           
=========================================
  Hits         12828     12828

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

@madocto madocto requested a review from MadCcc March 14, 2024 07:04
afc163
afc163 reviewed Mar 16, 2024
View reviewed changes
components/button/style/index.ts
@@ -342,14 +342,16 @@ const genLinkButtonStyle: GenerateStyle<ButtonToken, CSSObject> = (token) => ({

// Type: Text
const genTextButtonStyle: GenerateStyle<ButtonToken, CSSObject> = (token) => ({
color: token.textColor,
Copy link
Member

Choose a reason for hiding this comment

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

textColor 和 colorText 是啥关系？

Copy link
Contributor Author

Choose a reason for hiding this comment

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

  • textColor 是 <Button type="text">Text Button</Button> 文本按钮自定义的文本颜色。
  • colorText 是主题中默认的一级文本色。

Copy link
Member

Choose a reason for hiding this comment

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

这两个命名太容易混淆了。得想办法区分开

Copy link
Contributor Author

Choose a reason for hiding this comment

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

可以把 textColor 改为 textBtnColor，相应的文本按钮颜色 textBtnHoverColor、textBtnActiveColor，但是对比其它类型按钮多了 Btn，不统一了。

Copy link
Contributor Author

Choose a reason for hiding this comment

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

感觉把 colorText 改为 colorTextPrimary 最恰当，与 colorTextSecondary、colorTextTertiary 都是一致的，但是会 breaking change 了。

Copy link
Member

Choose a reason for hiding this comment

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

textBtnColor 确实好一点。

Copy link
Contributor Author

Choose a reason for hiding this comment

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

只改 textBtnColor 吗？比如已有的 textHoverBg 保持不变吗？

Copy link
Member

Choose a reason for hiding this comment

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

textTypeColor texTypeHoverBg 如何

Copy link
Contributor Author

Choose a reason for hiding this comment

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

textHoverBg 是在 5.13.0 版本添加的 #46936 ，应该也不能改的...

  • 已有的文本按钮 token：textHoverBg
  • 添加的文本按钮 token：textColor、textHoverColor、textActiveColor

Copy link
Member

Choose a reason for hiding this comment

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

不改了吧，text 这里虽然看起来很奇怪但是语义上代表 “text” 类型的按钮

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

@afc163 afc163 afc163 left review comments

@MadCcc MadCcc Awaiting requested review from MadCcc

At least 1 approving review is required to merge this pull request.

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

None yet
3 participants
@madocto @afc163 @MadCcc