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: menu support css variable theme #45750
Conversation
Run & review this pull request in StackBlitz Codeflow. |
size-limit report 📦
|
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. Latest deployment of this branch, based on commit 3d1dd17:
|
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## feature #45750 +/- ##
==========================================
Coverage 100.00% 100.00%
==========================================
Files 706 706
Lines 12002 12128 +126
Branches 3199 3233 +34
==========================================
+ Hits 12002 12128 +126
☔ View full report in Codecov by Sentry. |
argos 上有变化了 |
[中文版模板 / Chinese template]
🤔 This is a ...
🔗 Related issue link
💡 Background and solution
📝 Changelog
☑️ Self-Check before Merge
🚀 Summary
🤖 Generated by Copilot at 72681e7
This pull request adds CSS variable support to the menu component by using a custom hook and a utility library. It refactors the menu component style tokens and CSS objects to use the utility functions for handling units, arithmetic operations, and type aliases. It also fixes a typo in the RTL mode and improves the compatibility with different CSS units. The main files affected are
components/menu/menu.tsx
,components/menu/style/index.tsx
, andcomponents/menu/style/cssVar.ts
.🔍 Walkthrough
🤖 Generated by Copilot at 72681e7
useCSSVar
to register and use CSS variables for the menu component (link)useCSSVar
inmenu.tsx
,MenuDivider.tsx
,MenuItem.tsx
, andSubMenu.tsx
and wrap the returned elements with the CSS variable provider (link,link,link,link,link,link,link,link,link,link,link,link,link)unit
andtype
functions from@ant-design/cssinjs
to add unit suffixes to numeric values and declare type aliases for CSS objects inindex.tsx
,horizontal.tsx
,vertical.tsx
, andtheme.tsx
(link,link,link,link)index.tsx
to allow unitless values and usetoken.calc
andunit
functions to perform arithmetic operations and add unit suffixes (link,link,link,link,link,link,link,link,link,link,link,link)prepareComponentToken
inindex.tsx
to return the default token values for the menu component with dark mode and disabled state colors (link)prepareComponentToken
function call inindex.tsx
(link,link)transform
value for the submenu arrow in RTL mode inrtl.tsx
(link)token.calc
andunit
functions intheme.tsx
to perform arithmetic operations and add unit suffixes (link,link,link,link,link)token.calc
andunit
functions inhorizontal.tsx
andvertical.tsx
to perform arithmetic operations and add unit suffixes (link,link,link,link,link,link,link,link,link)