Skip to content

fix(Image): use RTL icons in PreviewGroup - #59145

Merged
afc163 merged 1 commit into
ant-design:masterfrom
dogledogle:codex/fix-image-preview-group-rtl
Aug 28, 2026
Merged

afc163 merged 1 commit into
ant-design:masterfrom
dogledogle:codex/fix-image-preview-group-rtl

Conversation

@dogledogle

@dogledogle dogledogle commented Aug 28, 2026 •

Copy link
Copy Markdown
Contributor

🤔 这个变动的性质是?

  • 🐞 Bug 修复

🔗 相关 Issue

N/A

💡 需求背景和解决方案

在 ConfigProvider direction="rtl" 下,Image.PreviewGroup 的预览切换按钮仍使用 LTR 方向图标,导致按钮位置与箭头方向表达不一致。
image-preview-rtl-icon-before

修复预览配置,使其使用根据当前 direction 计算得到的 RTL 图标,确保预览配置与组件实际传入的图标保持一致。
image-preview-rtl-icon-after

(实测 X 平台使用 RTL 语言,查看多张图片时,左边按钮是←箭头,功能是“下一张”,右边按钮是右箭头,功能是“上一张”)。

📝 更新日志

语言 更新描述
🇺🇸 英文 Fix Image PreviewGroup switch icons in RTL direction.
🇨🇳 中文 修复 Image PreviewGroup 在 RTL 方向下切换按钮图标错误的问题。

@bolt-new-by-stackblitz

Copy link
Copy Markdown

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

@github-actions

github-actions Bot commented Aug 28, 2026 •

Copy link
Copy Markdown
Contributor

👁 Visual Regression Report for PR #59145 Passed ✅

🎯 Target branch: master (1cb3762)
📖 View Full Report ↗︎
📖 Alternative Report ↗︎

🎊 Congrats! No visual-regression diff found.

📖 中文报告

👁 PR #59145 视觉回归报告 通过 ✅

🎯 目标分支: master (1cb3762)

🎊 恭喜!未发现视觉回归差异。

@github-actions

github-actions Bot commented Aug 28, 2026 •

Copy link
Copy Markdown
Contributor

Preview is ready

@coderabbitai

coderabbitai Bot commented Aug 28, 2026 •

Copy link
Copy Markdown
Contributor

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 8464eaa5-9034-4ad2-96bf-ea95f1fff335

📥 Commits

Reviewing files that changed from the base of the PR and between 1cb3762 and 89f0027.

📒 Files selected for processing (1)
  • components/image/PreviewGroup.tsx

Included review availability: Your plan provides up to 10 included reviews per hour; 9 remain after this review.


📝 Walkthrough

Summary by CodeRabbit

  • Bug Fixes
    • 修复从右到左(RTL)布局下图片预览导航图标方向不正确的问题。
    • 图片预览功能现在会正确显示适配当前阅读方向的左右导航图标。

Walkthrough

Changes

RTL 预览图标

Layer / File(s) Summary
合并方向感知图标配置
components/image/PreviewGroup.tsx
InternalPreviewGroup 将 memoizedIcons 传递给 useMergedPreviewConfig。RTL 模式下,合并配置使用已交换 left 和 right 的图标。

Estimated code review effort: 1 (简单) | ~5 分钟

Merge Risk: ⚪ Minimal · up to 89f00

This localized change corrects navigation icons for right-to-left image previews without affecting data, permissions, integrations, or deployment behavior; no actionable merge-blocking risk remains after normal checks and review.

Poem

小兔看见图标转向,
RTL 路径清晰明亮。
左右交换不再迷路,
配置合并步伐稳当。
预览窗口轻轻发光。

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 1…
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
Title check ✅ Passed 标题准确概括了主要变更:修复 Image.PreviewGroup 在 RTL 模式下使用错误图标的问题。
Description check ✅ Passed 描述与变更内容一致。它说明了 RTL 图标问题、修复方案和影响范围。
Full details: Docstring Coverage

Explanation

No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 1 files.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

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

Comment @coderabbitai help to get the list of available commands.

@codecov

codecov Bot commented Aug 28, 2026 •

Copy link
Copy Markdown

Bundle Report

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

Detailed changes
Bundle name Size Change
antd.min-array-push 3.22MB -2 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 -1 bytes 1.79MB -0.0%
antd.min.js -1 bytes 1.43MB -0.0%

@pkg-pr-new

pkg-pr-new Bot commented Aug 28, 2026

Copy link
Copy Markdown

@codecov

codecov Bot commented Aug 28, 2026 •

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 100.00%. Comparing base (1cb3762) to head (89f0027).
⚠️ Report is 1 commits behind head on master.

Additional details and impacted files
@@            Coverage Diff            @@
##            master    #59145   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          834       834           
  Lines        15995     15995           
  Branches      4205      4205           
=========================================
  Hits         15995     15995           

☔ View full report in Codecov by Harness.
📢 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.

@dosubot dosubot Bot added the lgtm This PR has been approved by a maintainer label Aug 28, 2026
@afc163
afc163 merged commit e7676ed into ant-design:master Aug 28, 2026
47 checks passed
@dogledogle
dogledogle deleted the codex/fix-image-preview-group-rtl branch August 29, 2026 14:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

lgtm This PR has been approved by a maintainer

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants