aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/components
diff options
context:
space:
mode:
authorfragosti <francesco.agosti93@gmail.com>2018-10-05 10:24:10 +0800
committerfragosti <francesco.agosti93@gmail.com>2018-10-05 10:24:10 +0800
commit1eb8d17ce36274093583069aab0025768a4a91ce (patch)
tree13ca27cc615ed28633e3513f1e7a5dde303c36a6 /packages/instant/src/components
parentc5084f023ac0356660b9480f9e1f477001a61284 (diff)
downloaddexon-sol-tools-1eb8d17ce36274093583069aab0025768a4a91ce.tar
dexon-sol-tools-1eb8d17ce36274093583069aab0025768a4a91ce.tar.gz
dexon-sol-tools-1eb8d17ce36274093583069aab0025768a4a91ce.tar.bz2
dexon-sol-tools-1eb8d17ce36274093583069aab0025768a4a91ce.tar.lz
dexon-sol-tools-1eb8d17ce36274093583069aab0025768a4a91ce.tar.xz
dexon-sol-tools-1eb8d17ce36274093583069aab0025768a4a91ce.tar.zst
dexon-sol-tools-1eb8d17ce36274093583069aab0025768a4a91ce.zip
Create SelectedAssetInputAmount
Diffstat (limited to 'packages/instant/src/components')
-rw-r--r--packages/instant/src/components/amount_input.tsx37
-rw-r--r--packages/instant/src/components/instant_heading.tsx4
2 files changed, 26 insertions, 15 deletions
diff --git a/packages/instant/src/components/amount_input.tsx b/packages/instant/src/components/amount_input.tsx
index 699541bfb..8fead78ca 100644
--- a/packages/instant/src/components/amount_input.tsx
+++ b/packages/instant/src/components/amount_input.tsx
@@ -1,4 +1,5 @@
import { BigNumber } from '@0xproject/utils';
+import * as _ from 'lodash';
import * as React from 'react';
import { ColorOption } from '../style/theme';
@@ -12,16 +13,26 @@ export interface AmountInputProps {
onChange?: (value: BigNumber) => void;
}
-export const AmountInput: React.StatelessComponent<AmountInputProps> = props => (
- <Container borderBottom="1px solid rgba(255,255,255,0.3)" display="inline-block">
- <Input
- fontColor={props.fontColor}
- fontSize={props.fontSize}
- value={props.value ? props.value.toString() : undefined}
- placeholder="0.00"
- width="2em"
- />
- </Container>
-);
-
-AmountInput.defaultProps = {};
+export class AmountInput extends React.Component<AmountInputProps> {
+ public render(): React.ReactNode {
+ const { fontColor, fontSize, value } = this.props;
+ return (
+ <Container borderBottom="1px solid rgba(255,255,255,0.3)" display="inline-block">
+ <Input
+ fontColor={fontColor}
+ fontSize={fontSize}
+ onChange={this._handleChange}
+ value={value ? value.toString() : undefined}
+ placeholder="0.00"
+ width="2em"
+ />
+ </Container>
+ );
+ }
+ private _handleChange = (event: React.ChangeEvent<HTMLInputElement>): void => {
+ const bigNumberValue = new BigNumber(event.target.value);
+ if (!_.isUndefined(this.props.onChange)) {
+ this.props.onChange(bigNumberValue);
+ }
+ };
+}
diff --git a/packages/instant/src/components/instant_heading.tsx b/packages/instant/src/components/instant_heading.tsx
index 3da280652..2b07ef666 100644
--- a/packages/instant/src/components/instant_heading.tsx
+++ b/packages/instant/src/components/instant_heading.tsx
@@ -1,9 +1,9 @@
import { BigNumber } from '@0xproject/utils';
import * as React from 'react';
+import { SelectedAssetAmountInput } from '../containers/selected_asset_amount_input';
import { ColorOption } from '../style/theme';
-import { AmountInput } from './amount_input';
import { Container, Flex, Text } from './ui';
export interface InstantHeadingProps {}
@@ -24,7 +24,7 @@ export const InstantHeading: React.StatelessComponent<InstantHeadingProps> = pro
</Container>
<Flex direction="row" justify="space-between">
<Container>
- <AmountInput fontSize="45px" />
+ <SelectedAssetAmountInput fontSize="45px" />
<Container display="inline-block" marginLeft="10px">
<Text fontSize="45px" fontColor={ColorOption.white} textTransform="uppercase">
rep