EditableInput with focus doesn't change value

Hey @casesandberg

I found a potential bug on EditableInput. When EditableInput is focused and you drag a Saturation or a Hue, the value doesn’t change.

I create a small demo. You can edit it here: https://codesandbox.io/s/n53766998j

Just trying to debug the problem seems that if you change it by a normal input this “bug” disappear.

The problem may be that the EditableInput doesn’t receive new props and doesn’t trigger componentWillReceiveProps: https://github.com/casesandberg/react-color/blob/master/src/components/common/EditableInput.js#L14.

and btw, thanks for react-color, it’s anwesome lib!

[casesandberg]

I agree the inputs should only hold focus when you are actually focused on them. I believe this an accessibility problem of the sliders not taking focus. I am looking into this for v3.0.0

[casesandberg]

The EdibleInput components only updates when you are not focused to prevent hex completion. For example, when you start to type in 333, the value that comes back is actually 333333, but we don’t want to replace that in the field if you were meaning to type 333aaa.

I just looked at the demo you provided and see the issue you are talking about. I think the appropriate behaviour would be for the input to blur when you click or drag on anything outside of it. This would fix the issue you are talking about and update with the appropriate value.