fix: init BigNumberInput not BigNumber when initializing state

2 files changed, 14 insertions, 9 deletions

diff --git a/packages/instant/src/components/zero_ex_instant.tsx b/packages/instant/src/components/zero_ex_instant.tsx
index 8454de43c..b080f0bad 100644
--- a/packages/instant/src/components/zero_ex_instant.tsx
+++ b/packages/instant/src/components/zero_ex_instant.tsx
@@ -1,6 +1,5 @@
 import { AssetBuyer } from '@0x/asset-buyer';
 import { ObjectMap, SignedOrder } from '@0x/types';
-import { BigNumber } from '@0x/utils';
 import * as _ from 'lodash';
 import * as React from 'react';
 import { Provider } from 'react-redux';
@@ -12,6 +11,7 @@ import { store, Store } from '../redux/store';
 import { fonts } from '../style/fonts';
 import { AssetMetaData, Network } from '../types';
 import { assetUtils } from '../util/asset';
+import { BigNumberInput } from '../util/big_number_input';
 import { errorUtil } from '../util/error';
 import { getProvider } from '../util/provider';
 import { web3Wrapper } from '../util/web3_wrapper';
@@ -64,7 +64,7 @@ export class ZeroExInstant extends React.Component<ZeroExInstantProps> {
             selectedAsset: assetUtils.createAssetFromAssetData(props.assetData, completeAssetMetaDataMap, networkId),
             selectedAssetAmount: _.isUndefined(props.defaultAssetBuyAmount)
                 ? state.selectedAssetAmount
-                : new BigNumber(props.defaultAssetBuyAmount),
+                : new BigNumberInput(props.defaultAssetBuyAmount),
             assetMetaDataMap: completeAssetMetaDataMap,
         };
         return storeStateFromProps;
diff --git a/packages/instant/src/util/big_number_input.ts b/packages/instant/src/util/big_number_input.ts
index d2a9a8dc5..370d91a0a 100644
--- a/packages/instant/src/util/big_number_input.ts
+++ b/packages/instant/src/util/big_number_input.ts
@@ -10,14 +10,19 @@ import * as _ from 'lodash';
  */
 export class BigNumberInput extends BigNumber {
     private readonly _isEndingWithDecimal: boolean;
-    constructor(bigNumberString: string) {
-        const hasDecimalPeriod = _.endsWith(bigNumberString, '.');
-        let internalString = bigNumberString;
-        if (hasDecimalPeriod) {
-            internalString = bigNumberString.slice(0, -1);
+    constructor(numberOrString: string | number) {
+        if (_.isString(numberOrString)) {
+            const hasDecimalPeriod = _.endsWith(numberOrString, '.');
+            let internalString = numberOrString;
+            if (hasDecimalPeriod) {
+                internalString = numberOrString.slice(0, -1);
+            }
+            super(internalString);
+            this._isEndingWithDecimal = hasDecimalPeriod;
+        } else {
+            super(numberOrString);
+            this._isEndingWithDecimal = false;
         }
-        super(internalString);
-        this._isEndingWithDecimal = hasDecimalPeriod;
     }
     public toDisplayString(): string {
         const internalString = super.toString();