Fix that colorpicker shows up on click

Right now this error triggers but it at least works but we get another error.

**Current issue**
```
Uncaught TypeError: Cannot read property 'contains' of undefined
    at HTMLDocument.<anonymous> (velocity.js:13)
```

**After this fix issue**
```
Warning: Can't call setState (or forceUpdate) on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in the componentWillUnmount method.
    in ColorPicker (created by ColorType)
    in div (created by Context.Consumer)
    in Styled(div) (created by ForwardRef)
```

addons/knobs/src/components/types/Color.js

@@ -28,10 +28,11 @@ class ColorType extends React.Component {
     document.addEventListener('mousedown', this.handleWindowMouseDown);
   }
 
-  shouldComponentUpdate(nextProps) {
+  shouldComponentUpdate(nextProps, nextState) {
     const { knob } = this.props;
+    const { displayColorPicker } = this.state;
 
-    return nextProps.knob.value !== knob.value;
+    return nextProps.knob.value !== knob.value || nextState.displayColorPicker !== displayColorPicker;
   }
 
   componentWillUnmount() {