1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00

Convert InputNumber component to use JSX (#7503)

This commit is contained in:
Whymarrh Whitby 2019-11-22 20:13:58 -03:30 committed by GitHub
parent f7c9903d95
commit 6820a245b5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,5 +1,5 @@
import React from 'react'
const Component = require('react').Component
const h = require('react-hyperscript')
const inherits = require('util').inherits
const {
addCurrencies,
@ -52,32 +52,35 @@ InputNumber.prototype.setValue = function (newValue) {
}
}
InputNumber.prototype.render = function () {
InputNumber.prototype.render = function InputNumber () {
const { unitLabel, step = 1, placeholder, value } = this.props
return h('div.customize-gas-input-wrapper', {}, [
h('input', {
className: 'customize-gas-input',
value,
placeholder,
type: 'number',
onChange: e => {
return (
<div className="customize-gas-input-wrapper">
<input
className="customize-gas-input"
value={value}
placeholder={placeholder}
type="number"
onChange={e => {
this.setValue(e.target.value)
},
min: 0,
}),
h('span.gas-tooltip-input-detail', {}, [unitLabel]),
h('div.gas-tooltip-input-arrows', {}, [
h('div.gas-tooltip-input-arrow-wrapper', {
onClick: () => this.setValue(addCurrencies(value, step, { toNumericBase: 'dec' })),
}, [
h('i.fa.fa-angle-up'),
]),
h('div.gas-tooltip-input-arrow-wrapper', {
onClick: () => this.setValue(subtractCurrencies(value, step, { toNumericBase: 'dec' })),
}, [
h('i.fa.fa-angle-down'),
]),
]),
])
}}
min={0}
/>
<span className="gas-tooltip-input-detail">{unitLabel}</span>
<div className="gas-tooltip-input-arrows">
<div className="gas-tooltip-input-arrow-wrapper"
onClick={() => this.setValue(addCurrencies(value, step, { toNumericBase: 'dec' }))}
>
<i className="fa fa-angle-up" />
</div>
<div
className="gas-tooltip-input-arrow-wrapper"
onClick={() => this.setValue(subtractCurrencies(value, step, { toNumericBase: 'dec' }))}
>
<i className="fa fa-angle-down" />
</div>
</div>
</div>
)
}