feat:action icon allow to hide bg color T1366#2312
Conversation
There was a problem hiding this comment.
Pull request overview
This PR adds a withBackground prop to four action icon components, allowing consumers to conditionally hide the background rectangle. The prop defaults to true to maintain backward compatibility.
- Added optional
withBackgroundprop to ActionUpdateRecord, ActionSendEmail, ActionHttpRequest, and ActionAI components - Wrapped background rect elements in conditional rendering based on the
withBackgroundprop - Maintained backward compatibility by defaulting
withBackgroundto true
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| packages/icons/src/components/ActionUpdateRecord.tsx | Added withBackground prop with conditional rendering for the background rect |
| packages/icons/src/components/ActionSendEmail.tsx | Added withBackground prop with conditional rendering for the background rect |
| packages/icons/src/components/ActionHttpRequest.tsx | Added withBackground prop with conditional rendering for the background rect |
| packages/icons/src/components/ActionAI.tsx | Added withBackground prop with conditional rendering for the background rect |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| {...props} | ||
| > | ||
| <rect width="24" height="24" fill="#FEE2E2" fillOpacity="0.1" /> | ||
| {withBackground && <rect width={24} height={24} fill="#FEE2E2" fillOpacity="0.1" />} |
There was a problem hiding this comment.
The width and height attributes on the rect element should use string values ("24") instead of expression values ({24}) for consistency with the other updated files (ActionUpdateRecord, ActionSendEmail, and ActionAI). In JSX, both forms work, but string values are preferred for static numeric values and maintain consistency across the codebase.
| {withBackground && <rect width={24} height={24} fill="#FEE2E2" fillOpacity="0.1" />} | |
| {withBackground && <rect width="24" height="24" fill="#FEE2E2" fillOpacity="0.1" />} |
🧹 Preview Environment Cleanup
|
🧹 Preview Environment Cleanup
|
Related Issues: T1366