@stokr/components-library 2.3.58-beta.6 → 2.3.58-beta.7

package/dist/components/InvestCalculator/InvestCalculator.js

@@ -10,195 +10,193 @@ var _formik = require("formik");
 var yup = _interopRequireWildcard(require("yup"));
 var _Input = _interopRequireDefault(require("../Input/Input"));
 var _Select = _interopRequireDefault(require("../Input/Select"));
-var _InvestCalculator = require("./InvestCalculator.styles");
+var _InvestCalculator2 = require("./InvestCalculator.styles");
 var _fixDecimals = _interopRequireDefault(require("../../utils/fix-decimals"));
-var _templateObject, _PropTypes$shape, _PropTypes$shape2;
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } //import Config from '../../api/StokrConfig'
+var _templateObject;
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } //import Config from '../../api/StokrConfig'
 //import { tokenDecimals } from '../../constants/decimals'
 
-var InvestCalculatorCurrencies = {
+const InvestCalculatorCurrencies = exports.InvestCalculatorCurrencies = {
   EUR: 'eur',
   GUSD: 'gusd',
   USDT: 'usdt',
   CRYPTO: 'crypto'
 };
-exports.InvestCalculatorCurrencies = InvestCalculatorCurrencies;
-var BN = require('bignumber.js');
-var getNumericPart = function getNumericPart(input) {
+const BN = require('bignumber.js');
+const getNumericPart = input => {
   // Normalize decimal separator and
   // find numeric part (w/o leading zeros)
-  var match = input.replace(/,/, '.').match(/[1-9]\d*(\.\d*)?|\.\d*/);
+  let match = input.replace(/,/, '.').match(/[1-9]\d*(\.\d*)?|\.\d*/);
   // Prepend leading zero if necessary
   return match ? match[0].replace(/^\./, '0.') : '0';
 };
-var InvestCalculator = /*#__PURE__*/function (_PureComponent) {
-  _inherits(InvestCalculator, _PureComponent);
-  var _super = _createSuper(InvestCalculator);
-  function InvestCalculator() {
-    var _this;
-    _classCallCheck(this, InvestCalculator);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _super.call.apply(_super, [this].concat(args));
-    _defineProperty(_assertThisInitialized(_this), "state", {
+class InvestCalculator extends _react.PureComponent {
+  constructor() {
+    super(...arguments);
+    _defineProperty(this, "state", {
       tokens: 0,
       currencyValue: 0,
       selectedCurrencyValue: 0,
-      selectedCurrency: _this.props.userSelectedCurrency === 'gemini' ? InvestCalculatorCurrencies.GUSD : InvestCalculatorCurrencies.USDT,
+      selectedCurrency: this.props.userSelectedCurrency === 'gemini' ? InvestCalculatorCurrencies.GUSD : InvestCalculatorCurrencies.USDT,
       // selectedCurrency: InvestCalculatorCurrencies.ETH,
       errors: {}
     });
-    _defineProperty(_assertThisInitialized(_this), "normalizeCurrencySelected", function (currencySelected) {
+    _defineProperty(this, "normalizeCurrencySelected", currencySelected => {
       if (currencySelected === 'euro') return 'eur';
       if (currencySelected === 'gemini') return 'gusd';
       if (currencySelected === 'tether') return 'usdt';
     });
-    _defineProperty(_assertThisInitialized(_this), "onFocus", function (e, field) {
-      var onFocus = _this.props.onFocus;
+    _defineProperty(this, "onFocus", (e, field) => {
+      const {
+        onFocus
+      } = this.props;
       onFocus && onFocus(e, field);
     });
-    _defineProperty(_assertThisInitialized(_this), "onBlur", function (e, field) {
-      var onBlur = _this.props.onBlur;
+    _defineProperty(this, "onBlur", (e, field) => {
+      const {
+        onBlur
+      } = this.props;
       onBlur && onBlur(e, field);
     });
-    _defineProperty(_assertThisInitialized(_this), "onChange", function (e, field) {
-      var onChange = _this.props.onChange;
+    _defineProperty(this, "onChange", (e, field) => {
+      const {
+        onChange
+      } = this.props;
       onChange && onChange(e, field);
     });
-    _defineProperty(_assertThisInitialized(_this), "onErrors", function (e, field) {
-      var onErrors = _this.props.onErrors;
+    _defineProperty(this, "onErrors", (e, field) => {
+      const {
+        onErrors
+      } = this.props;
       onErrors && onErrors(e, field);
     });
-    _defineProperty(_assertThisInitialized(_this), "changeTokens", function (e, field) {
-      var _this$props = _this.props,
-        exchangeRate = _this$props.exchangeRate,
-        available = _this$props.available,
-        name = _this$props.name,
-        userSelectedCurrency = _this$props.userSelectedCurrency;
-      var selectedCurrency = _this.state.selectedCurrency;
-      var tokensInput = getNumericPart(e.target.value);
-      var tokens = BN(tokensInput);
+    _defineProperty(this, "changeTokens", (e, field) => {
+      const {
+        exchangeRate,
+        available,
+        name,
+        userSelectedCurrency
+      } = this.props;
+      const {
+        selectedCurrency
+      } = this.state;
+      let tokensInput = getNumericPart(e.target.value);
+      let tokens = BN(tokensInput);
       if (tokens.gt(available)) {
         tokens = BN(available);
         tokensInput = tokens.toFixed(4);
       }
-      var currencyValue = tokens.times(exchangeRate[selectedCurrency]);
-      var selectedCurrencyValue = tokens * exchangeRate[_this.normalizeCurrencySelected(userSelectedCurrency)];
-      _this.validate({
+      const currencyValue = tokens.times(exchangeRate[selectedCurrency]);
+      const selectedCurrencyValue = tokens * exchangeRate[this.normalizeCurrencySelected(userSelectedCurrency)];
+      this.validate({
         tokens: tokens.toNumber(),
         currencyValue: currencyValue.toNumber(),
-        selectedCurrency: selectedCurrency
+        selectedCurrency
       });
-      _this.setState({
+      this.setState({
         tokens: tokensInput,
         currencyValue: currencyValue.toFixed(4),
-        selectedCurrencyValue: selectedCurrencyValue
-      }, function () {
-        _this.onChange({
+        selectedCurrencyValue
+      }, () => {
+        this.onChange({
           target: {
-            name: name,
+            name,
             value: tokens,
-            currencyValue: currencyValue,
+            currencyValue,
             currencyName: selectedCurrency,
-            selectedCurrencyValue: selectedCurrencyValue
+            selectedCurrencyValue
           }
         }, field);
       });
     });
-    _defineProperty(_assertThisInitialized(_this), "changeCurrency", function (e) {
-      var _this$props2 = _this.props,
-        exchangeRate = _this$props2.exchangeRate,
-        name = _this$props2.name,
-        userSelectedCurrency = _this$props2.userSelectedCurrency;
-      var tokens = _this.state.tokens;
-      var selectedCurrency = e.value;
-      var currencyValue = tokens * exchangeRate[selectedCurrency];
-      var selectedCurrencyValue = tokens * exchangeRate[_this.normalizeCurrencySelected(userSelectedCurrency)];
-      _this.validate({
-        tokens: tokens,
-        currencyValue: currencyValue,
-        selectedCurrency: selectedCurrency
+    _defineProperty(this, "changeCurrency", e => {
+      const {
+        exchangeRate,
+        name,
+        userSelectedCurrency
+      } = this.props;
+      const {
+        tokens
+      } = this.state;
+      const selectedCurrency = e.value;
+      const currencyValue = tokens * exchangeRate[selectedCurrency];
+      const selectedCurrencyValue = tokens * exchangeRate[this.normalizeCurrencySelected(userSelectedCurrency)];
+      this.validate({
+        tokens,
+        currencyValue,
+        selectedCurrency
       });
-      _this.setState({
-        currencyValue: currencyValue,
-        selectedCurrency: selectedCurrency,
-        selectedCurrencyValue: selectedCurrencyValue
-      }, function () {
-        _this.onChange({
+      this.setState({
+        currencyValue,
+        selectedCurrency,
+        selectedCurrencyValue
+      }, () => {
+        this.onChange({
           target: {
-            name: name,
+            name,
             value: tokens,
-            currencyValue: currencyValue,
+            currencyValue,
             currencyName: selectedCurrency,
-            selectedCurrencyValue: selectedCurrencyValue
+            selectedCurrencyValue
           }
         });
       });
     });
-    _defineProperty(_assertThisInitialized(_this), "changeCurrencyValue", function (e, field) {
-      var _this$props3 = _this.props,
-        exchangeRate = _this$props3.exchangeRate,
-        name = _this$props3.name,
-        available = _this$props3.available,
-        userSelectedCurrency = _this$props3.userSelectedCurrency;
-      var selectedCurrency = _this.state.selectedCurrency;
-      var currencyValueInput = getNumericPart(e.target.value);
-      var currencyValue = BN(currencyValueInput);
-      var tokens = currencyValue.div(exchangeRate[selectedCurrency]);
-      var selectedCurrencyValue = tokens * exchangeRate[_this.normalizeCurrencySelected(userSelectedCurrency)];
+    _defineProperty(this, "changeCurrencyValue", (e, field) => {
+      const {
+        exchangeRate,
+        name,
+        available,
+        userSelectedCurrency
+      } = this.props;
+      const {
+        selectedCurrency
+      } = this.state;
+      let currencyValueInput = getNumericPart(e.target.value);
+      let currencyValue = BN(currencyValueInput);
+      let tokens = currencyValue.div(exchangeRate[selectedCurrency]);
+      const selectedCurrencyValue = tokens * exchangeRate[this.normalizeCurrencySelected(userSelectedCurrency)];
       if (tokens.gt(available)) {
         tokens = BN(available);
         currencyValue = tokens.times(exchangeRate[selectedCurrency]);
         currencyValueInput = currencyValue.toFixed(4);
       }
-      _this.validate({
+      this.validate({
         tokens: tokens.toNumber(),
         currencyValue: currencyValue.toNumber(),
-        selectedCurrency: selectedCurrency
+        selectedCurrency
       });
-      _this.setState({
+      this.setState({
         tokens: tokens.toFixed(4),
         currencyValue: currencyValueInput,
-        selectedCurrencyValue: selectedCurrencyValue
-      }, function () {
-        _this.onChange({
+        selectedCurrencyValue
+      }, () => {
+        this.onChange({
           target: {
-            name: name,
+            name,
             value: tokens,
-            currencyValue: currencyValue,
+            currencyValue,
             currencyName: selectedCurrency,
-            selectedCurrencyValue: selectedCurrencyValue
+            selectedCurrencyValue
           }
         }, field);
       });
     });
-    _defineProperty(_assertThisInitialized(_this), "validate", function (values) {
-      var _this$props4 = _this.props,
-        minTokensCount = _this$props4.minTokensCount,
-        available = _this$props4.available,
-        maxFunds = _this$props4.maxFunds,
-        name = _this$props4.name,
-        tokenName = _this$props4.tokenName,
-        userSelectedCurrency = _this$props4.userSelectedCurrency;
-      var validationSchema = yup.object().shape({
+    _defineProperty(this, "validate", values => {
+      const {
+        minTokensCount,
+        available,
+        maxFunds,
+        name,
+        tokenName,
+        userSelectedCurrency
+      } = this.props;
+      const validationSchema = yup.object().shape({
         tokens: yup.number().min(minTokensCount, "Minimum investment: ".concat(minTokensCount)).max(available, "Unfortunately there are less ".concat(tokenName, " TOKENS available as you wish to buy. Please choose a smaller amount.")),
         currencyValue: yup.number().when('selectedCurrency', {
           is: InvestCalculatorCurrencies.EUR,
@@ -207,143 +205,148 @@ var InvestCalculator = /*#__PURE__*/function (_PureComponent) {
           otherwise: yup.number().max(maxFunds[InvestCalculatorCurrencies.CRYPTO], "Unfortunately there are not sufficient ".concat(userSelectedCurrency, " available on your chosen Ethereum address."))
         })
       });
-      var callback = function callback() {
-        var errors = _this.state.errors;
-        _this.onErrors({
+      const callback = () => {
+        const {
+          errors
+        } = this.state;
+        this.onErrors({
           target: {
-            name: name,
-            errors: errors
+            name,
+            errors
           }
         });
       };
       try {
         validationSchema.validateSync(values);
-        _this.setState({
+        this.setState({
           errors: {}
         }, callback);
       } catch (e) {
-        _this.setState({
+        this.setState({
           errors: (0, _formik.yupToFormErrors)(e)
         }, callback);
       }
     });
-    return _this;
   }
-  _createClass(InvestCalculator, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      var isIban = this.props.isIban;
-      if (isIban) {
-        this.setState({
-          selectedCurrency: InvestCalculatorCurrencies.EUR
-        });
-      }
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props5 = this.props,
-        available = _this$props5.available,
-        tokenName = _this$props5.tokenName,
-        id = _this$props5.id,
-        name = _this$props5.name,
-        isIban = _this$props5.isIban,
-        userSelectedCurrency = _this$props5.userSelectedCurrency;
-      var _this$state = this.state,
-        errors = _this$state.errors,
-        tokens = _this$state.tokens,
-        currencyValue = _this$state.currencyValue,
-        selectedCurrency = _this$state.selectedCurrency;
-      return /*#__PURE__*/_react.default.createElement(_InvestCalculator.Wrapper, null, /*#__PURE__*/_react.default.createElement(_InvestCalculator.Container, null, /*#__PURE__*/_react.default.createElement(_InvestCalculator.Title, {
-        error: !!errors.tokens
-      }, "".concat(tokenName, " tokens")), /*#__PURE__*/_react.default.createElement(_InvestCalculator.InputWrap, null, /*#__PURE__*/_react.default.createElement(_Input.default, {
-        id: id,
-        name: name,
-        value: tokens.toString(),
-        onChange: this.changeTokens,
-        onBlur: this.handleBlur
-      })), /*#__PURE__*/_react.default.createElement(_InvestCalculator.Caption, null, "Still available: ".concat((0, _fixDecimals.default)(available,
-      //tokenDecimals,
-      2), " ").concat(tokenName)), /*#__PURE__*/_react.default.createElement(_InvestCalculator.StyledFormError, {
-        show: !!errors.tokens
-      }, errors.tokens)), /*#__PURE__*/_react.default.createElement(_InvestCalculator.EqualSign, null, "="), /*#__PURE__*/_react.default.createElement(_InvestCalculator.Container, null, isIban ? /*#__PURE__*/_react.default.createElement(_InvestCalculator.Title, {
-        error: !!errors.tokens
-      }, "\u20AC value") : /*#__PURE__*/_react.default.createElement(_InvestCalculator.Title, {
-        error: selectedCurrency === InvestCalculatorCurrencies.GUSD && !!errors.currencyValue || selectedCurrency === InvestCalculatorCurrencies.USDT && !!errors.currencyValue
-      }, userSelectedCurrency === 'ether' ? 'ETH VALUE' : userSelectedCurrency === 'gemini' ? 'GUSD VALUE' : 'USDT VALUE')
-      // <SelectWrapper>
-      //   <Select
-      //     id={`${id}-currencySelect`}
-      //     name={`${id}-currencySelect`}
-      //     value={selectedCurrency}
-      //     options={[
-      //       {
-      //         key: '1',
-      //         value: InvestCalculatorCurrencies.EUR,
-      //         label: (
-      //           <Label
-      //             error={
-      //               selectedCurrency === InvestCalculatorCurrencies.EUR &&
-      //               !!errors.currencyValue
-      //             }
-      //           >
-      //             € VALUE
-      //           </Label>
-      //         ),
-      //       },
-      //       {
-      //         key: '2',
-      //         value:
-      //           userSelectedCurrency === 'ether'
-      //             ? InvestCalculatorCurrencies.ETH
-      //             : userSelectedCurrency === 'gemini'
-      //             ? InvestCalculatorCurrencies.GUSD
-      //             : InvestCalculatorCurrencies.USDT,
-      //         label: (
-      //           <Label
-      //             error={
-      //               (selectedCurrency ===
-      //                 InvestCalculatorCurrencies.ETH &&
-      //                 !!errors.currencyValue) ||
-      //               (selectedCurrency ===
-      //                 InvestCalculatorCurrencies.GUSD &&
-      //                 !!errors.currencyValue) ||
-      //               (selectedCurrency ===
-      //                 InvestCalculatorCurrencies.USDT &&
-      //                 !!errors.currencyValue)
-      //             }
-      //           >
-      //             {userSelectedCurrency === 'ether'
-      //               ? 'ETH VALUE'
-      //               : userSelectedCurrency === 'gemini'
-      //               ? 'GUSD VALUE'
-      //               : 'USDT VALUE'}
-      //           </Label>
-      //         ),
-      //       },
-      //     ]}
-      //     onChange={this.changeCurrency}
-      //     onBlur={() => {}}
-      //   />
-      // </SelectWrapper>
-      , /*#__PURE__*/_react.default.createElement(_InvestCalculator.InputWrap, null, /*#__PURE__*/_react.default.createElement(_Input.default, {
-        id: "".concat(id, "-valueInput"),
-        name: "".concat(id, "-valueInput"),
-        value: currencyValue.toString(),
-        onChange: this.changeCurrencyValue,
-        onBlur: function onBlur() {}
-      })), /*#__PURE__*/_react.default.createElement(_InvestCalculator.StyledFormError, {
-        paddingTop: true,
-        show: !!errors.currencyValue
-      }, errors.currencyValue)));
+  componentDidMount() {
+    const {
+      isIban
+    } = this.props;
+    if (isIban) {
+      this.setState({
+        selectedCurrency: InvestCalculatorCurrencies.EUR
+      });
     }
-  }]);
-  return InvestCalculator;
-}(_react.PureComponent);
+  }
+  render() {
+    const {
+      available,
+      tokenName,
+      id,
+      name,
+      isIban,
+      userSelectedCurrency
+    } = this.props;
+    const {
+      errors,
+      tokens,
+      currencyValue,
+      selectedCurrency
+    } = this.state;
+    return /*#__PURE__*/_react.default.createElement(_InvestCalculator2.Wrapper, null, /*#__PURE__*/_react.default.createElement(_InvestCalculator2.Container, null, /*#__PURE__*/_react.default.createElement(_InvestCalculator2.Title, {
+      error: !!errors.tokens
+    }, "".concat(tokenName, " tokens")), /*#__PURE__*/_react.default.createElement(_InvestCalculator2.InputWrap, null, /*#__PURE__*/_react.default.createElement(_Input.default, {
+      id: id,
+      name: name,
+      value: tokens.toString(),
+      onChange: this.changeTokens,
+      onBlur: this.handleBlur
+    })), /*#__PURE__*/_react.default.createElement(_InvestCalculator2.Caption, null, "Still available: ".concat((0, _fixDecimals.default)(available,
+    //tokenDecimals,
+    2), " ").concat(tokenName)), /*#__PURE__*/_react.default.createElement(_InvestCalculator2.StyledFormError, {
+      show: !!errors.tokens
+    }, errors.tokens)), /*#__PURE__*/_react.default.createElement(_InvestCalculator2.EqualSign, null, "="), /*#__PURE__*/_react.default.createElement(_InvestCalculator2.Container, null, isIban ? /*#__PURE__*/_react.default.createElement(_InvestCalculator2.Title, {
+      error: !!errors.tokens
+    }, "\u20AC value") : /*#__PURE__*/_react.default.createElement(_InvestCalculator2.Title, {
+      error: selectedCurrency === InvestCalculatorCurrencies.GUSD && !!errors.currencyValue || selectedCurrency === InvestCalculatorCurrencies.USDT && !!errors.currencyValue
+    }, userSelectedCurrency === 'ether' ? 'ETH VALUE' : userSelectedCurrency === 'gemini' ? 'GUSD VALUE' : 'USDT VALUE')
+    // <SelectWrapper>
+    //   <Select
+    //     id={`${id}-currencySelect`}
+    //     name={`${id}-currencySelect`}
+    //     value={selectedCurrency}
+    //     options={[
+    //       {
+    //         key: '1',
+    //         value: InvestCalculatorCurrencies.EUR,
+    //         label: (
+    //           <Label
+    //             error={
+    //               selectedCurrency === InvestCalculatorCurrencies.EUR &&
+    //               !!errors.currencyValue
+    //             }
+    //           >
+    //             € VALUE
+    //           </Label>
+    //         ),
+    //       },
+    //       {
+    //         key: '2',
+    //         value:
+    //           userSelectedCurrency === 'ether'
+    //             ? InvestCalculatorCurrencies.ETH
+    //             : userSelectedCurrency === 'gemini'
+    //             ? InvestCalculatorCurrencies.GUSD
+    //             : InvestCalculatorCurrencies.USDT,
+    //         label: (
+    //           <Label
+    //             error={
+    //               (selectedCurrency ===
+    //                 InvestCalculatorCurrencies.ETH &&
+    //                 !!errors.currencyValue) ||
+    //               (selectedCurrency ===
+    //                 InvestCalculatorCurrencies.GUSD &&
+    //                 !!errors.currencyValue) ||
+    //               (selectedCurrency ===
+    //                 InvestCalculatorCurrencies.USDT &&
+    //                 !!errors.currencyValue)
+    //             }
+    //           >
+    //             {userSelectedCurrency === 'ether'
+    //               ? 'ETH VALUE'
+    //               : userSelectedCurrency === 'gemini'
+    //               ? 'GUSD VALUE'
+    //               : 'USDT VALUE'}
+    //           </Label>
+    //         ),
+    //       },
+    //     ]}
+    //     onChange={this.changeCurrency}
+    //     onBlur={() => {}}
+    //   />
+    // </SelectWrapper>
+    , /*#__PURE__*/_react.default.createElement(_InvestCalculator2.InputWrap, null, /*#__PURE__*/_react.default.createElement(_Input.default, {
+      id: "".concat(id, "-valueInput"),
+      name: "".concat(id, "-valueInput"),
+      value: currencyValue.toString(),
+      onChange: this.changeCurrencyValue,
+      onBlur: () => {}
+    })), /*#__PURE__*/_react.default.createElement(_InvestCalculator2.StyledFormError, {
+      paddingTop: true,
+      show: !!errors.currencyValue
+    }, errors.currencyValue)));
+  }
+}
 exports.InvestCalculator = InvestCalculator;
 InvestCalculator.propTypes = {
-  exchangeRate: _propTypes.default.shape((_PropTypes$shape = {}, _defineProperty(_PropTypes$shape, InvestCalculatorCurrencies.ETH, _propTypes.default.number.isRequired), _defineProperty(_PropTypes$shape, InvestCalculatorCurrencies.EUR, _propTypes.default.number.isRequired), _PropTypes$shape)).isRequired,
-  maxFunds: _propTypes.default.shape((_PropTypes$shape2 = {}, _defineProperty(_PropTypes$shape2, InvestCalculatorCurrencies.CRYPTO, _propTypes.default.number), _defineProperty(_PropTypes$shape2, InvestCalculatorCurrencies.EUR, _propTypes.default.number), _PropTypes$shape2)).isRequired,
+  exchangeRate: _propTypes.default.shape({
+    [InvestCalculatorCurrencies.ETH]: _propTypes.default.number.isRequired,
+    [InvestCalculatorCurrencies.EUR]: _propTypes.default.number.isRequired
+  }).isRequired,
+  maxFunds: _propTypes.default.shape({
+    [InvestCalculatorCurrencies.CRYPTO]: _propTypes.default.number,
+    [InvestCalculatorCurrencies.EUR]: _propTypes.default.number
+  }).isRequired,
   minTokensCount: _propTypes.default.number,
   available: _propTypes.default.number.isRequired,
   tokenName: _propTypes.default.string.isRequired,
@@ -355,11 +358,10 @@ InvestCalculator.propTypes = {
   onErrors: _propTypes.default.func
 };
 InvestCalculator.defaultProps = {
-  onChange: function onChange() {},
-  onBlur: function onBlur() {},
-  onFocus: function onFocus() {},
-  onErrors: function onErrors() {},
+  onChange: () => {},
+  onBlur: () => {},
+  onFocus: () => {},
+  onErrors: () => {},
   minTokensCount: 0
 };
-var _default = InvestCalculator;
-exports.default = _default;
+var _default = exports.default = InvestCalculator;