mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
Stop using external NumericInput component.
This commit is contained in:
parent
ea28c8a437
commit
f33bb3e2fd
17
package-lock.json
generated
17
package-lock.json
generated
@ -25228,11 +25228,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"react-numeric-input": {
|
|
||||||
"version": "2.2.3",
|
|
||||||
"resolved": "https://registry.npmjs.org/react-numeric-input/-/react-numeric-input-2.2.3.tgz",
|
|
||||||
"integrity": "sha1-S/WRjD6v7YUagN8euZLZQQArtVI="
|
|
||||||
},
|
|
||||||
"react-onclickoutside": {
|
"react-onclickoutside": {
|
||||||
"version": "6.7.1",
|
"version": "6.7.1",
|
||||||
"resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.7.1.tgz",
|
"resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.7.1.tgz",
|
||||||
@ -26441,6 +26436,18 @@
|
|||||||
"object-assign": "4.1.1"
|
"object-assign": "4.1.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"react": {
|
||||||
|
"version": "15.6.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/react/-/react-15.6.2.tgz",
|
||||||
|
"integrity": "sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI=",
|
||||||
|
"requires": {
|
||||||
|
"create-react-class": "15.6.2",
|
||||||
|
"fbjs": "0.8.16",
|
||||||
|
"loose-envify": "1.3.1",
|
||||||
|
"object-assign": "4.1.1",
|
||||||
|
"prop-types": "15.6.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
"react-hyperscript": {
|
"react-hyperscript": {
|
||||||
"version": "2.4.2",
|
"version": "2.4.2",
|
||||||
"resolved": "https://registry.npmjs.org/react-hyperscript/-/react-hyperscript-2.4.2.tgz",
|
"resolved": "https://registry.npmjs.org/react-hyperscript/-/react-hyperscript-2.4.2.tgz",
|
||||||
|
@ -163,7 +163,6 @@
|
|||||||
"react-dom": "^15.6.2",
|
"react-dom": "^15.6.2",
|
||||||
"react-hyperscript": "^3.0.0",
|
"react-hyperscript": "^3.0.0",
|
||||||
"react-markdown": "^3.0.0",
|
"react-markdown": "^3.0.0",
|
||||||
"react-numeric-input": "^2.2.3",
|
|
||||||
"react-redux": "^5.0.5",
|
"react-redux": "^5.0.5",
|
||||||
"react-router-dom": "^4.2.2",
|
"react-router-dom": "^4.2.2",
|
||||||
"react-select": "^1.0.0",
|
"react-select": "^1.0.0",
|
||||||
|
@ -4,7 +4,6 @@ const inherits = require('util').inherits
|
|||||||
const { conversionUtil, multiplyCurrencies } = require('../../conversion-util')
|
const { conversionUtil, multiplyCurrencies } = require('../../conversion-util')
|
||||||
const currencyFormatter = require('currency-formatter')
|
const currencyFormatter = require('currency-formatter')
|
||||||
const currencies = require('currency-formatter/currencies')
|
const currencies = require('currency-formatter/currencies')
|
||||||
const NumericInput = require('react-numeric-input')
|
|
||||||
|
|
||||||
module.exports = CurrencyDisplay
|
module.exports = CurrencyDisplay
|
||||||
|
|
||||||
@ -92,6 +91,7 @@ CurrencyDisplay.prototype.getConvertedValueToRender = function (nonFormattedValu
|
|||||||
}
|
}
|
||||||
|
|
||||||
CurrencyDisplay.prototype.handleChange = function (newVal) {
|
CurrencyDisplay.prototype.handleChange = function (newVal) {
|
||||||
|
console.log(`%^ 95 newVal`, newVal);
|
||||||
this.setState({ valueToRender: newVal })
|
this.setState({ valueToRender: newVal })
|
||||||
this.props.onChange(this.getAmount(newVal))
|
this.props.onChange(this.getAmount(newVal))
|
||||||
}
|
}
|
||||||
@ -124,27 +124,34 @@ CurrencyDisplay.prototype.render = function () {
|
|||||||
style: {
|
style: {
|
||||||
borderColor: inError ? 'red' : null,
|
borderColor: inError ? 'red' : null,
|
||||||
},
|
},
|
||||||
onClick: () => this.currencyInput && this.currencyInput.focus(),
|
onClick: () => {
|
||||||
|
this.currencyInput && this.currencyInput.focus()
|
||||||
|
},
|
||||||
}, [
|
}, [
|
||||||
|
|
||||||
h('div.currency-display__primary-row', [
|
h('div.currency-display__primary-row', [
|
||||||
|
|
||||||
h('div.currency-display__input-wrapper', [
|
h('div.currency-display__input-wrapper', [
|
||||||
|
|
||||||
h(NumericInput, {
|
h('input', {
|
||||||
className: primaryBalanceClassName,
|
className: primaryBalanceClassName,
|
||||||
value: `${valueToRender}`,
|
value: `${valueToRender}`,
|
||||||
placeholder: `0 ${primaryCurrency}`,
|
placeholder: '0',
|
||||||
|
type: 'number',
|
||||||
readOnly,
|
readOnly,
|
||||||
...(!readOnly ? {
|
...(!readOnly ? {
|
||||||
onChange: e => this.handleChange(e),
|
onChange: e => this.handleChange(e.target.value),
|
||||||
onBlur: () => onBlur(this.getAmount(valueToRender)),
|
onBlur: () => onBlur(this.getAmount(valueToRender)),
|
||||||
} : {}),
|
} : {}),
|
||||||
style: false,
|
ref: input => { this.currencyInput = input },
|
||||||
format: num => `${num} ${primaryCurrency}`,
|
style: {
|
||||||
parse: stringWithCurrency => stringWithCurrency && stringWithCurrency.match(/^([.\d]+)/)[1],
|
width: this.getInputWidth(valueToRender, readOnly),
|
||||||
|
},
|
||||||
|
min: 0,
|
||||||
}),
|
}),
|
||||||
|
|
||||||
|
h('span.currency-display__currency-symbol', primaryCurrency),
|
||||||
|
|
||||||
]),
|
]),
|
||||||
|
|
||||||
]),
|
]),
|
||||||
|
Loading…
Reference in New Issue
Block a user