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.

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

feat: migrate less to token for Checkbox #42097

Merged
merged 10 commits into from
May 18, 2023

Conversation

poyiding
Copy link
Contributor

@poyiding poyiding commented May 1, 2023

[中文版模板 / 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

💡 Background and solution

ref #41884

📝 Changelog

Language Changelog
🇺🇸 English migrate less to token for Checkbox
🇨🇳 Chinese Checkbox 组件less变量迁移

☑️ 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

🚀 Summary

🤖 Generated by Copilot at 8d7fece

Moved checkboxSize from less variable to component token for Checkbox component. Updated the migration guide for less variables to component tokens in both English and Chinese documentation.

🔍 Walkthrough

🤖 Generated by Copilot at 8d7fece

  • Move checkboxSize property from CheckboxToken to ComponentToken interface to enable user customization of checkbox size through componentConfig prop (link)
  • Remove checkboxSize property from getStyle function and use component token instead to calculate checkbox width and height (link, link)
  • Modify genComponentStyleHook function to accept a function that returns component token based on style token, and use it to derive checkboxSize from controlInteractiveSize global variable (link)
  • Add Checkbox component to migration guide for less variables to component tokens in English and Chinese documentation, and explain the deprecated or changed less variables and the new component token API (docs/react/migrate-less-variables.en-US.md, docs/react/migrate-less-variables.zh-CN.md, link, link)

@github-actions
Copy link
Contributor

github-actions bot commented May 1, 2023

@MadCcc
Copy link
Member

MadCcc commented May 3, 2023

PR body 里 changelog 填一下

@MadCcc
Copy link
Member

MadCcc commented May 3, 2023

lint 有问题,类型需要改一下,可以参照其他的组件,checkbox 的 ComponentToken 这个类型没有使用过大概
参考:https://github.com/ant-design/ant-design/pull/42083/files#diff-1d8c7d2026da8b02ccc59970cea90849086b133e4b8f55d59ae475ac814d9e1bR95

@poyiding
Copy link
Contributor Author

poyiding commented May 4, 2023

lint 有问题,类型需要改一下,可以参照其他的组件,checkbox 的 ComponentToken 这个类型没有使用过大概 参考:https://github.com/ant-design/ant-design/pull/42083/files#diff-1d8c7d2026da8b02ccc59970cea90849086b133e4b8f55d59ae475ac814d9e1bR95

需要 @MadCcc 给genComponentStyleHooks 加上组件依赖

| `@checkbox-size` | `controlInteractiveSize` | - |
| `@checkbox-color` | `colorPrimary` | - |
| `@checkbox-check-color` | `colorWhite` | - |
| `@checkbox-check-bg` | - | 由于样式变化已废弃 |
Copy link
Member

Choose a reason for hiding this comment

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

这个可以加回来

<!-- prettier-ignore -->
| less 变量 | Component Token | 备注 |
| --- | --- | --- |
| `@checkbox-size` | `controlInteractiveSize` | - |
Copy link
Member

Choose a reason for hiding this comment

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

这个这样的话就可以不用把 checkboxSize 移到 ComponentToken 里去了

@codecov
Copy link

codecov bot commented May 5, 2023

Codecov Report

Patch coverage: 100.00% and no project coverage change.

Comparison is base (65d7a5b) 100.00% compared to head (eb2b62d) 100.00%.

Additional details and impacted files
@@            Coverage Diff            @@
##           feature    #42097   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          640       640           
  Lines        10855     10855           
  Branches      2950      2950           
=========================================
  Hits         10855     10855           
Impacted Files Coverage Δ
components/tag/index.tsx 100.00% <100.00%> (ø)

☔ View full report in Codecov by Sentry.
📢 Do you have feedback about the report comment? Let us know in this issue.

@yoyo837 yoyo837 mentioned this pull request May 10, 2023
51 tasks
@MadCcc MadCcc merged commit da1162f into ant-design:feature May 18, 2023
@MadCcc MadCcc mentioned this pull request Jun 6, 2023
20 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants