diff --git a/src/components/PositiveNumberInput/PositiveNumberInput.jsx b/src/components/PositiveNumberInput/PositiveNumberInput.jsx
index 7f01cf7ff..b042858c4 100644
--- a/src/components/PositiveNumberInput/PositiveNumberInput.jsx
+++ b/src/components/PositiveNumberInput/PositiveNumberInput.jsx
@@ -7,10 +7,12 @@ class PositiveNumberInput extends React.PureComponent {
super(props)
this.isInputValid = true
+ this.previousValue = props.value || ''
this.onKeyDown = this.onKeyDown.bind(this)
this.onPaste = this.onPaste.bind(this)
this.onKeyUp = this.onKeyUp.bind(this)
+ this.onChange = this.onChange.bind(this)
}
onKeyDown(evt) {
@@ -44,9 +46,44 @@ class PositiveNumberInput extends React.PureComponent {
this.props.onKeyUp(evt)
}
+ onChange(evt) {
+ const { onChange } = this.props
+
+ this.enforceInputBelowMax(evt)
+ onChange(evt)
+ }
+
+ /**
+ * Makes sure the input value is kept below the max value
+ * @param {Event} evt The change event
+ */
+ enforceInputBelowMax(evt) {
+ const value = evt.target.value
+ if (this.isBelowMaxLimit(value)) {
+ this.previousValue = value
+ } else {
+ evt.target.value = this.previousValue
+ }
+ }
+
+ isBelowMaxLimit(text) {
+ const { max = Infinity } = this.props
+ return Number(text) <= max
+ }
+
render() {
const props = omit(this.props, ['onValidityChange'])
- return
+ return (
+
+ )
}
}
@@ -54,16 +91,17 @@ PositiveNumberInput.defaultProps = {
onKeyDown: noop,
onPaste: noop,
onKeyUp: noop,
- onValidityChange: noop
-
+ onValidityChange: noop,
+ onChange: noop,
}
PositiveNumberInput.propTypes = {
+ max: PT.number,
onKeyDown: PT.func,
onPaste: PT.func,
onKeyUp: PT.func,
- onValidityChange: PT.func
+ onValidityChange: PT.func,
+ onChange: PT.func,
}
-
export default PositiveNumberInput
diff --git a/src/projects/detail/components/TalentPickerRow/TalentPickerRow.jsx b/src/projects/detail/components/TalentPickerRow/TalentPickerRow.jsx
index d6ab115be..ce777caaf 100644
--- a/src/projects/detail/components/TalentPickerRow/TalentPickerRow.jsx
+++ b/src/projects/detail/components/TalentPickerRow/TalentPickerRow.jsx
@@ -100,9 +100,9 @@ class TalentPickerRow extends React.PureComponent {
People