fix(iconButton): Disable icon from password validation.

packages/component-faraday-ui/src/IconButton.js

 import React from 'react'
 import { Icon } from '@pubsweet/ui'
 import styled from 'styled-components'
-
 import { positionHelper, marginHelper, paddingHelper } from './styledHelpers'
 
 const IconButton = styled.div`
@@ -10,7 +9,7 @@ const IconButton = styled.div`
   display: flex;
   justify-content: center;
   opacity: ${props => (props.disabled ? 0.7 : 1)};
-
+  pointer-events: ${props => (props.unclickable ? 'none' : 'auto')};
   &:hover {
     opacity: 0.7;
   }
@@ -18,16 +17,23 @@ const IconButton = styled.div`
   &[disabled] {
     cursor: not-allowed;
   }
-
   ${marginHelper};
   ${paddingHelper};
   ${positionHelper};
 `
 
-export default ({ icon, onClick, iconSize = 3, disabled, ...props }) => (
+export default ({
+  icon,
+  onClick,
+  unclickable,
+  iconSize = 3,
+  disabled,
+  ...props
+}) => (
   <IconButton
     disabled={disabled}
     onClick={!disabled ? onClick : null}
+    unclickable={unclickable}
     {...props}
   >
     <Icon size={iconSize} {...props}>

packages/component-faraday-ui/src/PasswordValidation.js

@@ -52,7 +52,7 @@ const PasswordValidation = ({
     </Row>
 
     <Row alignItems="center" justify="flex-start" mb={-1 / 2}>
-      <IconButton icon="info" iconSize={2} ml={-1 / 2} primary />
+      <IconButton icon="info" iconSize={2} ml={-1 / 2} primary unclickable />
       <RulesTitle>The password must contain: </RulesTitle>
     </Row>