Merge d716d74 into 95b693d

src/components/Common/InputField.js

@@ -25,6 +25,7 @@ export const InputField = props => {
         value={props.value}
         onChange={props.onChange}
         onKeyPress={props.onKeyPress}
+        onPaste={props.onPaste}
       />
       <p className="description">{props.description}</p>
       { props.pristine ? null : <p style={errorStyle}>{error}</p> }

src/components/Common/NumericInput.js

@@ -18,49 +18,60 @@ export class NumericInput extends Component {
     }
   }
 
+  onPaste = e => {
+    if (isNaN(parseFloat(e.clipboardData.getData('text/plain'))))
+      e.preventDefault()
+  }
+
   onKeyPress = e => {
     if (!this.props.acceptFloat) {
-      if (isNaN(parseInt(e.key, 10))) e.preventDefault()
+      const firstCharacterIsMinus = e.key === '-' && this.state.value === ''
+      const acceptsNegativeValues = this.props.min < 0 || this.props.max < 0
+
+      if (!(firstCharacterIsMinus && acceptsNegativeValues) && isNaN(parseInt(e.key, 10))) e.preventDefault()
     }
   }
 
   onChange = e => {
-    const { value } = e.target
+    let value = this.props.acceptFloat ? parseFloat(e.target.value) : parseInt(e.target.value, 10)
     let isValid = true
 
-    if (this.props.min) {
-      isValid = isValid && value >= parseFloat(this.props.min)
-    }
-
-    if (isValid && this.props.max) {
-      isValid = isValid && value <= parseFloat(this.props.max)
-    }
-
-    if (isValid && this.props.acceptFloat) {
-      if (this.props.maxDecimals) {
+    if (this.props.acceptFloat) {
+      if (this.props.maxDecimals !== undefined) {
         isValid = isValid && countDecimalPlaces(value) <= this.props.maxDecimals
       }
 
-      if (this.props.minDecimals) {
+      if (this.props.minDecimals !== undefined) {
         isValid = isValid && countDecimalPlaces(value) >= this.props.minDecimals
       }
     }
 
-    if (value === '') {
+    if (isValid && this.props.min !== undefined) {
+      isValid = isValid && value >= this.props.min
+    }
+
+    if (isValid && this.props.max !== undefined) {
+      isValid = isValid && value <= this.props.max
+    }
+
+    if (isNaN(value)) {
+      value = ''
       isValid = true
     }
 
-    const newValue = value === '' ? '' : parseFloat(value)
     this.setState({
       pristine: false,
       valid: isValid ? VALID : INVALID,
-      value: newValue
-    }, () => this.props.onValueUpdate(newValue))
+      value
+    })
+
+    this.props.onValueUpdate(value)
   }
 
   render () {
     return (
       <InputField
+        disabled={this.props.disabled}
         side={this.props.side}
         type='number'
         errorMessage={this.props.errorMessage}
@@ -70,6 +81,7 @@ export class NumericInput extends Component {
         title={this.props.title}
         onKeyPress={e => this.onKeyPress(e)}
         onChange={e => this.onChange(e)}
+        onPaste={e => this.onPaste(e)}
         description={this.props.description}
       />
     )