Skip to content

fix: render custom step icons - #396

Open
nrps9909 wants to merge 1 commit into
react-component:masterfrom
nrps9909:codex/render-custom-icons
Open

fix: render custom step icons#396
nrps9909 wants to merge 1 commit into
react-component:masterfrom
nrps9909:codex/render-custom-icons

Conversation

@nrps9909

@nrps9909 nrps9909 commented Aug 27, 2026

Copy link
Copy Markdown
Contributor

Summary

  • render each item custom icon inside the default StepIcon container
  • preserve the existing iconRender override path by passing it the populated origin node
  • extend the existing custom-icon test to verify JSX and string icons are present

Problem

StepItem.icon is public and the official customIcon demo supplies JSX and string icons, but the current semantic Step implementation initializes an empty <StepIcon />. Without an iconRender supplied by a wrapper, every custom icon is therefore dropped while the item still receives the custom class.

On the unmodified current master (95b7a56), the new assertion failed because .rcicon-cloud was absent. This change restores the standalone rc-steps behavior with the smallest possible change.

Validation

  • npm test -- --runInBand (24 tests, 13 snapshots)
  • npm run tsc
  • npm run lint
  • npm run compile
  • npx prettier --check src/Step.tsx tests/index.test.tsx

I also checked all open PR changed files and searched open issues/PRs for the same custom-icon rendering regression; no current overlap was found. PR #108 touches an old JavaScript Step implementation for a different finish/error step-number option.

AI assistance disclosure: Codex was used to trace the regression, audit current overlap, implement the minimal change, and run validation. The failure was reproduced on the exact upstream base before the implementation change.

Summary by CodeRabbit

  • Bug 修复

    • 修复步骤组件默认图标内容未正确显示的问题。
    • 确保自定义图标支持 React 元素和文本内容,并能正确渲染。
  • 测试

    • 增加对云朵、Apple 和 GitHub 自定义图标显示效果的验证。

@vercel

vercel Bot commented Aug 27, 2026

Copy link
Copy Markdown

@nrps9909 is attempting to deploy a commit to the afc163's projects Team on Vercel.

A member of the Team first needs to authorize it.

@coderabbitai

coderabbitai Bot commented Aug 27, 2026

Copy link
Copy Markdown

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 17a4f3b8-6309-4cd1-b904-668793038f00

📥 Commits

Reviewing files that changed from the base of the PR and between 95b7a56 and 0e496e0.

⛔ Files ignored due to path filters (1)
  • tests/__snapshots__/index.test.tsx.snap is excluded by !**/*.snap
📒 Files selected for processing (2)
  • src/Step.tsx
  • tests/index.test.tsx

Included review availability: Your plan provides up to 2 included reviews per hour; 1 remains after this review.


Walkthrough

本次变更使默认 StepIcon 接收 icon 属性,并增加自定义图标的渲染断言。

Changes

自定义图标渲染

Layer / File(s) Summary
图标属性传递与渲染验证
src/Step.tsx, tests/index.test.tsx
默认 StepIcon 现在渲染 icon 属性。测试验证 React 元素图标及字符串图标的输出。

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

Merge Risk: ⚪ Minimal · up to 0e496

This restores rendering for supported custom step icons while preserving the existing override path. The change is localized and merge-ready after normal checks, with no actionable merge-blocking risk remaining.

Poem

小兔看见图标亮,
云朵苹果和 GitHub。
StepIcon 接住新内容,
测试逐个确认无误。
胡萝卜旁代码香。

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 2 files. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed 标题“fix: render custom step icons”准确概括了本次变更的主要内容,即修复自定义步骤图标的渲染。标题简洁且具体。
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.
  • Fix all pre-merge checks with AI
✨ Finishing Touches 💡 1
🛠️ Fix failing CI checks 💡
  • Create stacked PR
  • Commit on current branch
🧪 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 27, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 100.00%. Comparing base (95b7a56) to head (0e496e0).

Additional details and impacted files
@@            Coverage Diff            @@
##            master      #396   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files            6         6           
  Lines           99        99           
  Branches        38        38           
=========================================
  Hits            99        99           

☔ 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.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

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.

1 participant