aboutsummaryrefslogtreecommitdiffstats
path: root/ui
diff options
context:
space:
mode:
authorDan <danjm.com@gmail.com>2018-03-16 23:32:07 +0800
committerDan <danjm.com@gmail.com>2018-03-17 02:08:29 +0800
commita348b60735f945e3a593256bbd016dc6deee8e36 (patch)
tree547da823b82755db14047d3cf192136c8930d62b /ui
parente2f340b3242c436bd4d7bc802662ae6f9f195899 (diff)
downloadtangerine-wallet-browser-a348b60735f945e3a593256bbd016dc6deee8e36.tar
tangerine-wallet-browser-a348b60735f945e3a593256bbd016dc6deee8e36.tar.gz
tangerine-wallet-browser-a348b60735f945e3a593256bbd016dc6deee8e36.tar.bz2
tangerine-wallet-browser-a348b60735f945e3a593256bbd016dc6deee8e36.tar.lz
tangerine-wallet-browser-a348b60735f945e3a593256bbd016dc6deee8e36.tar.xz
tangerine-wallet-browser-a348b60735f945e3a593256bbd016dc6deee8e36.tar.zst
tangerine-wallet-browser-a348b60735f945e3a593256bbd016dc6deee8e36.zip
Currency input defaults to empty string
Diffstat (limited to 'ui')
-rw-r--r--ui/app/components/currency-input.js20
1 files changed, 14 insertions, 6 deletions
diff --git a/ui/app/components/currency-input.js b/ui/app/components/currency-input.js
index 6f7862e51..940238fa5 100644
--- a/ui/app/components/currency-input.js
+++ b/ui/app/components/currency-input.js
@@ -8,8 +8,12 @@ inherits(CurrencyInput, Component)
function CurrencyInput (props) {
Component.call(this)
+ const sanitizedValue = sanitizeValue(props.value)
+
this.state = {
- value: sanitizeValue(props.value),
+ value: sanitizedValue,
+ emptyState: false,
+ focused: false,
}
}
@@ -58,9 +62,11 @@ CurrencyInput.prototype.handleChange = function (newValue) {
if (value === '0' && newValue[newValueLastIndex] === '0') {
parsedValue = parsedValue.slice(0, newValueLastIndex)
}
-
const sanitizedValue = sanitizeValue(parsedValue)
- this.setState({ value: sanitizedValue })
+ this.setState({
+ value: sanitizedValue,
+ emptyState: newValue === '' && sanitizedValue === '0',
+ })
onInputChange(sanitizedValue)
}
@@ -86,17 +92,19 @@ CurrencyInput.prototype.render = function () {
readOnly,
inputRef,
} = this.props
+ const { emptyState, focused } = this.state
const inputSizeMultiplier = readOnly ? 1 : 1.2
const valueToRender = this.getValueToRender()
-
return h('input', {
className,
- value: valueToRender,
- placeholder,
+ value: emptyState ? '' : valueToRender,
+ placeholder: focused ? '' : placeholder,
size: valueToRender.length * inputSizeMultiplier,
readOnly,
+ onFocus: () => this.setState({ focused: true, emptyState: valueToRender === '0' }),
+ onBlur: () => this.setState({ focused: false, emptyState: false }),
onChange: e => this.handleChange(e.target.value),
ref: inputRef,
})