refactor: pass color prop to icon from Button [CFISO-1471] (#2766)

* refactor: pass color prop to icon from Button * chore: add changeset * chore: add comment about color prop * refactor: remove unecessary import * Update packages/components/button/src/Button/Button.tsx
contentful · May 28, 2024 · de6c1fe · de6c1fe
1 parent ff4b940
commit de6c1fe
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 0 deletions.
diff --git a/.changeset/small-ways-kneel.md b/.changeset/small-ways-kneel.md
@@ -0,0 +1,5 @@
+---
+'@contentful/f36-button': patch
+---
+
+Pass color prop to icon from button
diff --git a/packages/components/button/src/Button/Button.tsx b/packages/components/button/src/Button/Button.tsx
@@ -73,6 +73,13 @@ function _Button<E extends React.ElementType = typeof BUTTON_DEFAULT_TAG>(
         >
           {React.cloneElement(icon, {
             size: icon.props.size ?? `${size === 'large' ? 'medium' : 'small'}`,
+            // We need to pass the color to the icons to enable the usaged of the V5 icons
+            // it may change in the future
+            color:
+              (variant === 'transparent' &&
+                icon.props.variant === undefined &&
+                icon.props.color) ||
+              'currentColor',
             // we want to allow variants for icons for transparent buttons
             variant:
               (variant === 'transparent' && icon.props.variant) ||