Skip to content

refactor: [v6] use CSS logical properties#52560

Merged
zombieJ merged 8 commits intonextfrom
v6-css-logic
Feb 12, 2025
Merged

refactor: [v6] use CSS logical properties#52560
zombieJ merged 8 commits intonextfrom
v6-css-logic

Conversation

@li-jia-nan
Copy link
Member

@li-jia-nan li-jia-nan commented Jan 24, 2025

中文版模板 / Chinese template

🤔 This is a ...

  • 🆕 New feature
  • 🐞 Bug fix
  • 📝 Site / documentation improvement
  • 📽️ Demo improvement
  • 💄 Component style improvement
  • 🤖 TypeScript definition improvement
  • 📦 Bundle size optimization
  • ⚡️ Performance optimization
  • ⭐️ Feature enhancement
  • 🌐 Internationalization
  • 🛠 Refactoring
  • 🎨 Code style optimization
  • ✅ Test Case
  • 🔀 Branch merge
  • ⏩ Workflow
  • ❓ Other (about what?)

🔗 Related Issues

  • Describe the source of related requirements, such as links to relevant issue discussions.
  • For example: close #xxxx, fix #xxxx

💡 Background and Solution

  • The specific problem to be addressed.
  • List the final API implementation and usage if needed.
  • If there are UI/interaction changes, consider providing screenshots or GIFs.

📝 Change Log

Language Changelog
🇺🇸 English refactor: [v6] use CSS logical properties
🇨🇳 Chinese refactor: [v6] use CSS logical properties

@bolt-new-by-stackblitz
Copy link

bolt-new-by-stackblitz bot commented Jan 24, 2025

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

@github-actions
Copy link
Contributor

github-actions bot commented Jan 24, 2025 •
edited
Loading

Preview is ready

@github-actions
Copy link
Contributor

github-actions bot commented Jan 24, 2025 •
edited by li-jia-nan
Loading

👁 Visual Regression Report for PR #52560 Failed ❌

🎯 Target branch: next (e6d4eb0)
📖 View Full Report ↗︎
📖 Alternative Report ↗︎
📊 Summary: 🔄 2 changed

Expected (Branch next) Actual (Current PR) Diff
input-group.compact.png input-group.compact.png input-group.compact.css-var.png input-group.compact.css-var.png
input-otp.compact.png input-otp.compact.png input-otp.compact.css-var.png input-otp.compact.css-var.png

Important

There are 2 diffs found in this PR: 🔄 2 changed.
Please check all items:

  • Visual diff is acceptable

@petercat-assistant
Copy link

petercat-assistant bot commented Jan 24, 2025

Walkthrough

This pull request refactors the grid component in the Ant Design library to utilize CSS logical properties. The changes primarily involve replacing traditional CSS properties like marginLeft and marginRight with marginInline, and paddingLeft and paddingRight with paddingInline. This refactoring aims to improve the adaptability of the grid layout for different writing modes and directions.

Changes

Files Summary
components/grid/__tests__/__snapshots__/demo-extend.test.ts.snap, components/grid/__tests__/__snapshots__/demo.test.ts.snap Updated snapshot tests to reflect changes in CSS properties.
components/grid/__tests__/__snapshots__/index.test.tsx.snap Minor updates in snapshot tests for grid component.
components/grid/__tests__/index.test.tsx, components/grid/__tests__/server.test.tsx Refactored test cases to use marginInline and paddingInline instead of marginLeft, marginRight, paddingLeft, and paddingRight.
components/grid/col.tsx, components/grid/row.tsx Updated grid component logic to use CSS logical properties for margin and padding.

petercat-assistant[bot]
petercat-assistant bot reviewed Jan 24, 2025
View reviewed changes
petercat-assistant[bot]
petercat-assistant bot reviewed Jan 24, 2025
View reviewed changes
petercat-assistant[bot]
petercat-assistant bot reviewed Jan 24, 2025
View reviewed changes
petercat-assistant[bot]
petercat-assistant bot reviewed Jan 24, 2025
View reviewed changes
@github-actions
Copy link
Contributor

github-actions bot commented Jan 24, 2025 •
edited
Loading

size-limit report 📦

Path Size
dist/antd.min.js 500.22 KB (-12 B 🔽)
dist/antd-with-locales.min.js 569.3 KB (-19 B 🔽)

@pkg-pr-new
Copy link

pkg-pr-new bot commented Jan 24, 2025 •
edited
Loading

Open in Stackblitz

More templates

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

commit: 9ca158d

@cloudflare-workers-and-pages
Copy link

cloudflare-workers-and-pages bot commented Jan 24, 2025 •
edited
Loading

Deploying ant-design with  Cloudflare Pages  Cloudflare Pages

Latest commit: 9ca158d
Status: ✅  Deploy successful!
Preview URL: https://88c54148.ant-design.pages.dev
Branch Preview URL: https://v6-css-logic.ant-design.pages.dev

View logs

@codecov
Copy link

codecov bot commented Jan 24, 2025 •
edited
Loading

Bundle Report

Changes will decrease total bundle size by 58 bytes (-0.0%) ⬇️. This is within the configured threshold ✅

Detailed changes
Bundle name Size Change
antd.min-array-push 3.73MB -58 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 -29 bytes 2.02MB -0.0%
antd.min.js -29 bytes 1.71MB -0.0%

@codecov
Copy link

codecov bot commented Jan 24, 2025 •
edited
Loading

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 100.00%. Comparing base (e6d4eb0) to head (9ca158d).
Report is 3 commits behind head on next.

Additional details and impacted files 
@@            Coverage Diff            @@
##              next    #52560   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          765       765           
  Lines        13769     13767    -2     
  Branches      3601      3601           
=========================================
- Hits         13769     13767    -2

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

@zombieJ zombieJ merged commit aaf384a into next Feb 12, 2025
42 checks passed
@zombieJ zombieJ deleted the v6-css-logic branch February 12, 2025 09:16
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@zombieJ zombieJ zombieJ approved these changes

+1 more reviewer

@petercat-assistant petercat-assistant[bot] petercat-assistant[bot] left review comments

Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@li-jia-nan @zombieJ