Fix disable color on iconbutton (#1638)

Co-authored-by: Brandon Scott <[email protected]>

Author: deli-ght

src/buttons/src/IconButton.js

@@ -7,7 +7,7 @@ import Button, { getIconSizeForButton, internalStyles, pseudoSelectors } from '.
 
 const IconButton = memo(
   forwardRef(function IconButton(props, ref) {
-    const { icon, iconSize, ...restProps } = props
+    const { disabled, icon, iconSize, ...restProps } = props
 
     // modifiers
     const { appearance, intent = 'none', size = 'medium' } = props
@@ -27,11 +27,12 @@ const IconButton = memo(
         height={height}
         width={height}
         minWidth={height}
+        disabled={disabled}
         {...restProps}
       >
         <IconWrapper
           icon={icon}
-          color={intent === 'none' ? 'default' : 'currentColor'}
+          color={intent === 'none' && !disabled ? 'default' : 'currentColor'}
           size={iconSize || relativeIconSize}
         />
       </Button>

src/buttons/stories/index.stories.js

@@ -184,6 +184,8 @@ buttonsStory.add('Button types', () => (
       <Button appearance="minimal" marginRight={16} intent="warning">
         Minimal
       </Button>
+      <IconButton marginRight={16} icon={<Icons.PlusIcon />} />
+      <IconButton marginRight={16} intent="danger" icon={<Icons.PlusIcon />} />
     </Box>
     <Heading marginTop={24}>Disabled Appearance</Heading>
     <Box marginTop={12}>
@@ -199,6 +201,8 @@ buttonsStory.add('Button types', () => (
       <Button disabled appearance="minimal" marginRight={16} intent="warning">
         Minimal
       </Button>
+      <IconButton disabled icon={<Icons.PlusIcon />} marginRight={16} />
+      <IconButton disabled marginRight={16} intent="danger" icon={<Icons.PlusIcon />} />
     </Box>
   </Box>
 ))