tg-core-components 5.5.0-bethard → 5.5.0-master

package/lib/widgets/CashierAccordion/Payment/PaymentAccountForms/index.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.InteracWithdrawal = exports.PaysafecardWithdrawal = exports.InstadebitWithdrawal = exports.IDebitWithdrawal = exports.IdealWithdrawal = exports.EProPaymentWallWithdrawal = exports.EcoPayzWithdrawal = exports.TrustlyWithdrawal = exports.BankWithdrawal = exports.ZimplerWithdrawal = exports.MiFinityEWalletWithdrawal = exports.AstroPayBankWithdrawal = exports.MuchBetterWithdrawal = exports.NetellerWithdrawal = exports.VenusPointWithdrawal = exports.CreditcardWithdrawal = exports.SkrillWithdrawal = exports.BankIBANWithdrawal = exports.BankLocalWithdrawal = exports.JetonWithdrawal = exports.CryptoCurrencyWithdrawal = exports.BestPayWithdrawal = exports.BankIntlWithdrawal = exports.MiFinityEWalletDeposit = exports.BankIntlDeposit = exports.BestPayDeposit = exports.FunangaDeposit = exports.PaysafecardDeposit = exports.InstadebitDeposit = exports.IDebitDeposit = exports.IdealDeposit = exports.EProPaymentWallDeposit = exports.EcoPayzDeposit = exports.TrustlyDeposit = exports.BankDeposit = exports.ZimplerDeposit = exports.CryptoCurrencyDeposit = exports.AstroPayBankDeposit = exports.MobilePayDeposit = exports.PProDeposit = exports.MuchBetterDeposit = exports.SiruDeposit = exports.VenusPointDeposit = exports.NetellerDeposit = exports.CreditcardDeposit = exports.SkrillDeposit = undefined;
+exports.InteracWithdrawal = exports.PaysafecardWithdrawal = exports.InstadebitWithdrawal = exports.IDebitWithdrawal = exports.IdealWithdrawal = exports.EProPaymentWallWithdrawal = exports.EcoPayzWithdrawal = exports.TrustlyWithdrawal = exports.BankWithdrawal = exports.ZimplerWithdrawal = exports.MiFinityEWalletWithdrawal = exports.EzeeWalletWithdrawal = exports.AstroPayBankWithdrawal = exports.MuchBetterWithdrawal = exports.NetellerWithdrawal = exports.VenusPointWithdrawal = exports.CreditcardWithdrawal = exports.SkrillWithdrawal = exports.BankIBANWithdrawal = exports.BankLocalWithdrawal = exports.JetonWithdrawal = exports.CryptoCurrencyWithdrawal = exports.BestPayWithdrawal = exports.BankIntlWithdrawal = exports.MiFinityEWalletDeposit = exports.BankIntlDeposit = exports.BestPayDeposit = exports.FunangaDeposit = exports.PaysafecardDeposit = exports.InstadebitDeposit = exports.IDebitDeposit = exports.IdealDeposit = exports.EProPaymentWallDeposit = exports.EcoPayzDeposit = exports.TrustlyDeposit = exports.BankDeposit = exports.ZimplerDeposit = exports.EzeeWalletDeposit = exports.CryptoCurrencyDeposit = exports.AstroPayBankDeposit = exports.MobilePayDeposit = exports.PProDeposit = exports.MuchBetterDeposit = exports.SiruDeposit = exports.VenusPointDeposit = exports.NetellerDeposit = exports.CreditcardDeposit = exports.SkrillDeposit = undefined;
 
 var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
@@ -17,10 +17,22 @@ var _identity = require('lodash/identity');
 
 var _identity2 = _interopRequireDefault(_identity);
 
+var _TextInput = require('../../../../components/Deposit/TextInput');
+
+var _TextInput2 = _interopRequireDefault(_TextInput);
+
+var _Select = require('../../../../components/Deposit/Select');
+
+var _Select2 = _interopRequireDefault(_Select);
+
 var _PaymentAccountParser = require('../../Payment/PaymentAccountParser');
 
 var Parser = _interopRequireWildcard(_PaymentAccountParser);
 
+var _CardInput = require('../../../../components/Deposit/CardInput');
+
+var _CardInput2 = _interopRequireDefault(_CardInput);
+
 var _astroPayBankTransaltions = require('./astroPayBankTransaltions');
 
 var _astroPayBankTransaltions2 = _interopRequireDefault(_astroPayBankTransaltions);
@@ -33,81 +45,37 @@ var _translate = require('../../../../lib/utils/translate');
 
 var _translate2 = _interopRequireDefault(_translate);
 
-var _Input = require('../../../../components/Input');
-
-var _Input2 = _interopRequireDefault(_Input);
-
-var _Select = require('../../../../components/Select');
-
-var _Select2 = _interopRequireDefault(_Select);
-
-var _payment = require('payment');
-
-var _payment2 = _interopRequireDefault(_payment);
-
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 var injectMethod = function injectMethod(newProps, BaseComponent) {
   return function (props) {
     return _react2.default.createElement(BaseComponent, _extends({}, props, newProps));
   };
 };
 
-var formatCreditCardNumber = function formatCreditCardNumber(value) {
-  value = value.replace(/[^\d|\*]/g, '');
-  var issuer = _payment2.default.fns.cardType(value);
-  switch (issuer) {
-    case 'amex':
-      value = value.slice(0, 4) + ' ' + value.slice(4, 10) + ' ' + value.slice(10, 15);
-      break;
-    case 'dinersclub':
-      value = value.slice(0, 4) + ' ' + value.slice(4, 8) + ' ' + value.slice(8, 12) + ' ' + value.slice(12, 14);
-      break;
-    default:
-      value = value.slice(0, 4) + ' ' + value.slice(4, 8) + ' ' + value.slice(8, 12) + ' ' + value.slice(12, 16);
-      break;
-  }
-  return value.trim();
-};
-
 var Creditcard = function Creditcard(_ref) {
   var account = _ref.account,
       intl = _ref.intl,
       method = _ref.method,
-      provider = _ref.provider,
-      change = _ref.change,
-      values = _ref.values;
+      provider = _ref.provider;
 
   return _react2.default.createElement(
     'div',
-    null,
-    _react2.default.createElement(_Input2.default, {
+    { className: 'payment-account-info' },
+    _react2.default.createElement(_CardInput2.default, {
+      className: 'layout-item-12',
       disabled: account.accountId,
-      transform: function transform(creditCardNumber) {
-        return formatCreditCardNumber(creditCardNumber);
-      },
-      value: values['cardNumber'],
-      onChange: function onChange(e, creditCardNumber) {
-        return change && change('cardNumber', creditCardNumber);
-      },
       name: 'cardNumber',
       label: (0, _translate2.default)({ id: 'cashier.details.cardNumber' }, intl),
       required: !account.accountId,
-      inputmode: 'numeric',
+      type: 'number',
       autocomplete: 'cc-number',
       autoFocus: !account.accountId
     }),
-    _react2.default.createElement(_Input2.default, {
+    _react2.default.createElement(_CardInput2.default, {
       disabled: account.accountId,
-      value: values['cardHolder'],
-      onChange: function onChange(e, cardHolder) {
-        return change && change('cardHolder', cardHolder);
-      },
-      pattern: '[^0-9]*',
       name: 'cardHolder',
       type: 'cardHolder',
       autocomplete: 'cc-name',
@@ -117,17 +85,9 @@ var Creditcard = function Creditcard(_ref) {
     _react2.default.createElement(
       'div',
       { className: 'layout-item' },
-      _react2.default.createElement(_Input2.default, {
+      _react2.default.createElement(_CardInput2.default, {
+        className: method === 'deposit' ? 'layout-item-6' : 'layout-item-12',
         name: 'expiryDate',
-        pattern: '(?:0[1-9]|1[0-2])/[0-9]{2}',
-        value: values['expiryDate'],
-        onChange: function onChange(e, expiryDate) {
-          return change && change('expiryDate', expiryDate);
-        },
-        transform: function transform(expirationDate) {
-          expirationDate = expirationDate.replace(/\D+/g, '');
-          return expirationDate.length >= 3 ? expirationDate.slice(0, 2) + '/' + expirationDate.slice(2, 4) : expirationDate;
-        },
         disabled: account.accountId,
         label: (0, _translate2.default)({ id: 'cashier.details.validThruDate' }, intl),
         required: !account.accountId,
@@ -135,16 +95,9 @@ var Creditcard = function Creditcard(_ref) {
         autocomplete: 'cc-exp',
         placeholder: 'MM/YY'
       }),
-      method === 'deposit' && _react2.default.createElement(_Input2.default, {
+      method === 'deposit' && _react2.default.createElement(_CardInput2.default, {
+        className: 'layout-item-6',
         name: 'cvv',
-        pattern: '\\d{3,4}',
-        value: values['cvv'],
-        onChange: function onChange(e, cvv) {
-          return change && change('cvv', cvv);
-        },
-        transform: function transform(cvv) {
-          return cvv.slice(0, 4);
-        },
         label: (0, _translate2.default)({ id: 'cashier.details.cvv' }, intl),
         required: true,
         type: 'cvv',
@@ -159,29 +112,19 @@ var Creditcard = function Creditcard(_ref) {
 var Neteller = function Neteller(_ref2) {
   var account = _ref2.account,
       intl = _ref2.intl,
-      method = _ref2.method,
-      change = _ref2.change,
-      values = _ref2.values;
+      method = _ref2.method;
 
   return _react2.default.createElement(
     'div',
-    null,
-    _react2.default.createElement(_Input2.default, {
+    { className: 'payment-account-info' },
+    _react2.default.createElement(_TextInput2.default, {
       disabled: account.accountId,
-      value: values['account'],
-      onChange: function onChange(e, account) {
-        return change('account', account);
-      },
       name: 'account',
       label: (0, _translate2.default)({ id: 'cashier.details.account' }, intl),
       required: true
     }),
-    method === 'deposit' && _react2.default.createElement(_Input2.default, {
+    method === 'deposit' && _react2.default.createElement(_TextInput2.default, {
       name: 'secureId',
-      value: values['secureId'],
-      onChange: function onChange(e, secureId) {
-        return change('secureId', secureId);
-      },
       label: (0, _translate2.default)({ id: 'cashier.details.secureId' }, intl),
       type: 'number',
       required: true
@@ -190,30 +133,21 @@ var Neteller = function Neteller(_ref2) {
 };
 
 var VenusPoint = function VenusPoint(_ref3) {
-  var _React$createElement;
-
   var account = _ref3.account,
-      intl = _ref3.intl,
-      change = _ref3.change,
-      values = _ref3.values;
+      intl = _ref3.intl;
 
   return _react2.default.createElement(
     'div',
-    null,
-    _react2.default.createElement(_Input2.default, (_React$createElement = {
+    { className: 'payment-account-info' },
+    _react2.default.createElement(_TextInput2.default, {
       disabled: account.accountId,
       name: 'username',
-      value: values['username'],
-      onChange: function onChange(e, username) {
-        return change('username', username);
-      }
-    }, _defineProperty(_React$createElement, 'value', account.maskedAccount), _defineProperty(_React$createElement, 'label', (0, _translate2.default)({ id: 'cashier.details.username' }, intl)), _React$createElement)),
-    _react2.default.createElement(_Input2.default, {
+      value: account.maskedAccount,
+      label: (0, _translate2.default)({ id: 'cashier.details.username' }, intl)
+    }),
+    _react2.default.createElement(_TextInput2.default, {
       type: 'password',
       name: 'password',
-      onChange: function onChange(e, password) {
-        return change('password', password);
-      },
       label: (0, _translate2.default)({ id: 'cashier.details.password' }, intl)
     })
   );
@@ -222,27 +156,21 @@ var VenusPoint = function VenusPoint(_ref3) {
 var PPro = function PPro() {
   return _react2.default.createElement(
     'div',
-    null,
-    _react2.default.createElement(_Input2.default, { type: 'hidden', name: 'service', value: 'GIROPAY' })
+    { className: 'payment-account-info' },
+    _react2.default.createElement(_TextInput2.default, { type: 'hidden', name: 'service', value: 'GIROPAY' })
   );
 };
 
 var PhoneNumber = function PhoneNumber(_ref4) {
   var account = _ref4.account,
-      intl = _ref4.intl,
-      change = _ref4.change,
-      values = _ref4.values;
+      intl = _ref4.intl;
 
   return _react2.default.createElement(
     'div',
-    null,
-    _react2.default.createElement(_Input2.default, {
+    { className: 'payment-account-info' },
+    _react2.default.createElement(_TextInput2.default, {
       disabled: account.accountId,
       name: 'phoneNumber',
-      value: values['phoneNumber'],
-      onChange: function onChange(e, phoneNumber) {
-        return change('phoneNumber', phoneNumber);
-      },
       label: (0, _translate2.default)({ id: 'cashier.details.phoneNumber' }, intl),
       required: true
     })
@@ -251,20 +179,14 @@ var PhoneNumber = function PhoneNumber(_ref4) {
 
 var Email = function Email(_ref5) {
   var account = _ref5.account,
-      intl = _ref5.intl,
-      change = _ref5.change,
-      values = _ref5.values;
+      intl = _ref5.intl;
 
   return _react2.default.createElement(
     'div',
-    null,
-    _react2.default.createElement(_Input2.default, {
+    { className: 'payment-account-info' },
+    _react2.default.createElement(_TextInput2.default, {
       disabled: account.accountId,
       name: 'email',
-      value: values['email'],
-      onChange: function onChange(e, email) {
-        return change('email', email);
-      },
       label: (0, _translate2.default)({ id: 'cashier.details.email' }, intl),
       required: true
     })
@@ -273,26 +195,19 @@ var Email = function Email(_ref5) {
 
 var Banklocal = function Banklocal(_ref6) {
   var account = _ref6.account,
-      intl = _ref6.intl,
-      change = _ref6.change;
+      intl = _ref6.intl;
 
   return _react2.default.createElement(
     'div',
-    null,
-    _react2.default.createElement(_Input2.default, {
+    { className: 'payment-account-info' },
+    _react2.default.createElement(_TextInput2.default, {
       value: account.accountId ? account.maskedAccount.replace(/-\d*/g, '') : undefined,
-      onChange: function onChange(e, clearingNumber) {
-        return change('clearingNumber', clearingNumber);
-      },
       name: 'clearingNumber',
       label: (0, _translate2.default)({ id: 'cashier.details.clearingNumber' }, intl),
       disabled: account.accountId
     }),
-    _react2.default.createElement(_Input2.default, {
+    _react2.default.createElement(_TextInput2.default, {
       value: account.accountId ? account.maskedAccount.replace(/\d*-/g, '') : undefined,
-      onChange: function onChange(e, accountNumber) {
-        return change('accountNumber', accountNumber);
-      },
       name: 'accountNumber',
       label: (0, _translate2.default)({ id: 'cashier.details.accountNumber' }, intl),
       disabled: account.accountId
@@ -302,48 +217,32 @@ var Banklocal = function Banklocal(_ref6) {
 
 var BankIBAN = function BankIBAN(_ref7) {
   var account = _ref7.account,
-      intl = _ref7.intl,
-      change = _ref7.change,
-      values = _ref7.values;
+      intl = _ref7.intl;
 
   return _react2.default.createElement(
     'div',
-    null,
-    _react2.default.createElement(_Input2.default, {
+    { className: 'payment-account-info' },
+    _react2.default.createElement(_TextInput2.default, {
       required: true,
       value: account.accountId ? account.maskedAccount.replace(/^\S* /g, '') : undefined,
-      onChange: function onChange(e, iban) {
-        return change('iban', iban);
-      },
       name: 'iban',
       label: (0, _translate2.default)({ id: 'cashier.details.iban' }, intl),
       disabled: account.accountId
     }),
-    _react2.default.createElement(_Input2.default, {
+    _react2.default.createElement(_TextInput2.default, {
       required: true,
       value: account.accountId ? account.maskedAccount.replace(/\s(.*)/g, '') : undefined,
-      onChange: function onChange(e, bic) {
-        return change('bic', bic);
-      },
       name: 'bic',
       label: (0, _translate2.default)({ id: 'cashier.details.bic' }, intl),
       disabled: account.accountId
     }),
-    _react2.default.createElement(_Input2.default, {
+    _react2.default.createElement(_TextInput2.default, {
       required: true,
-      value: values['beneficiaryName'],
-      onChange: function onChange(e, beneficiaryName) {
-        return change('beneficiaryName', beneficiaryName);
-      },
       name: 'beneficiaryName',
       label: (0, _translate2.default)({ id: 'cashier.details.beneficiaryName' }, intl)
     }),
-    _react2.default.createElement(_Input2.default, {
+    _react2.default.createElement(_TextInput2.default, {
       required: true,
-      value: values['bankName'],
-      onChange: function onChange(e, bankName) {
-        return change('bankName', bankName);
-      },
       name: 'bankName',
       label: (0, _translate2.default)({ id: 'cashier.details.bankName' }, intl)
     })
@@ -355,9 +254,7 @@ var AstroPayBank = function AstroPayBank(_ref8) {
       intl = _ref8.intl,
       country = _ref8.country,
       method = _ref8.method,
-      detail = _ref8.detail,
-      change = _ref8.change,
-      values = _ref8.values;
+      detail = _ref8.detail;
 
   var translateMap = function translateMap(category) {
     return function (value) {
@@ -378,188 +275,104 @@ var AstroPayBank = function AstroPayBank(_ref8) {
 
   return _react2.default.createElement(
     'div',
-    null,
-    method === 'withdraw' && methodDetails.idTypes && methodDetails.idTypes.length > 1 && _react2.default.createElement(
-      _Select2.default,
-      {
-        required: true,
-        name: 'nationalIdType',
-        value: values['nationalIdType'],
-        onChange: function onChange(e, nationalIdType) {
-          return change('nationalIdType', nationalIdType);
-        },
-        label: (0, _translate2.default)({
-          id: 'cashier.details.idType',
-          defaultMessage: 'nationalIdType'
-        }, intl) },
-      !values['nationalIdType'] && _react2.default.createElement(
-        _Select2.default.Option,
-        { value: '', selected: true, disabled: true },
-        (0, _translate2.default)({
-          id: 'cashier.details.idType',
-          defaultMessage: 'nationalIdType'
-        }, intl)
-      ),
-      methodDetails.idTypes.map(translateMap('idTypes')).map(function (s) {
-        return _react2.default.createElement(
-          _Select2.default.Option,
-          { value: s.value },
-          s.label
-        );
-      })
-    ),
-    _react2.default.createElement(_Input2.default, {
+    { className: 'payment-account-info' },
+    method === 'withdraw' && methodDetails.idTypes && methodDetails.idTypes.length > 1 && _react2.default.createElement(_Select2.default, {
+      required: true,
+      name: 'nationalIdType',
+      label: (0, _translate2.default)({
+        id: 'cashier.details.idType',
+        defaultMessage: 'nationalIdType'
+      }, intl),
+      defaultOptionLabel: (0, _translate2.default)({
+        id: 'cashier.details.select-nationalIdType',
+        defaultMessage: 'select nationalIdType'
+      }, intl),
+      options: methodDetails.idTypes.map(translateMap('idTypes'))
+    }),
+    _react2.default.createElement(_TextInput2.default, {
       required: true,
       name: 'nationalId',
-      value: values['nationalId'],
-      onChange: function onChange(e, nationalId) {
-        return change('nationalId', nationalId);
-      },
       label: (0, _translate2.default)({
         id: 'cashier.details.nationalId',
         defaultMessage: 'nationalId'
       }, intl)
     }),
-    method === 'withdraw' && methodDetails.banks && methodDetails.banks.length > 1 && _react2.default.createElement(
-      _Select2.default,
-      {
-        required: true,
-        name: 'bankCode',
-        value: values['bankCode'],
-        onChange: function onChange(e, bankCode) {
-          return change('bankCode', bankCode);
-        },
-        label: (0, _translate2.default)({
-          id: 'cashier.details.bankCode',
-          defaultMessage: 'bankCode'
-        }, intl) },
-      !values['bankCode'] && _react2.default.createElement(
-        _Select2.default.Option,
-        { value: '', selected: true, disabled: true },
-        (0, _translate2.default)({
-          id: 'cashier.details.bankCode',
-          defaultMessage: 'bankCode'
-        }, intl)
-      ),
-      methodDetails.banks.map(translateMap('banks' + country)).map(function (s) {
-        return _react2.default.createElement(
-          _Select2.default.Option,
-          { value: s.value },
-          s.label
-        );
-      })
-    ),
-    method === 'withdraw' && ['BR', 'UY', 'IN'].includes(country) && _react2.default.createElement(_Input2.default, {
+    method === 'withdraw' && methodDetails.banks && methodDetails.banks.length > 1 && _react2.default.createElement(_Select2.default, {
+      required: true,
+      name: 'bankCode',
+      label: (0, _translate2.default)({
+        id: 'cashier.details.bankCode',
+        defaultMessage: 'bankCode'
+      }, intl),
+      defaultOptionLabel: (0, _translate2.default)({
+        id: 'cashier.details.select-bankCode',
+        defaultMessage: 'select bankCode'
+      }, intl),
+      options: methodDetails.banks.map(translateMap('banks' + country))
+    }),
+    method === 'withdraw' && ['BR', 'UY', 'IN'].includes(country) && _react2.default.createElement(_TextInput2.default, {
       required: true,
       name: 'bankBranch',
-      value: values['bankBranch'],
-      onChange: function onChange(e, bankBranch) {
-        return change('bankBranch', bankBranch);
-      },
       label: (0, _translate2.default)({
         id: 'cashier.details.bankBranch',
         defaultMessage: 'bankBranch'
       }, intl)
     }),
-    method === 'withdraw' && methodDetails.accountTypes && methodDetails.accountTypes.length > 1 && _react2.default.createElement(
-      _Select2.default,
-      {
-        required: true,
-        name: 'accountType',
-        value: values['accountType'],
-        onChange: function onChange(e, accountType) {
-          return change('accountType', accountType);
-        },
-        label: (0, _translate2.default)({
-          id: 'cashier.details.accountType',
-          defaultMessage: 'account type'
-        }, intl) },
-      !values['accountType'] && _react2.default.createElement(
-        _Select2.default.Option,
-        { value: '', selected: true, disabled: true },
-        (0, _translate2.default)({
-          id: 'cashier.details.accountType',
-          defaultMessage: 'account type'
-        }, intl)
-      ),
-      methodDetails.accountTypes.map(translateMap('accountTypes')).map(function (s) {
-        return _react2.default.createElement(
-          _Select2.default.Option,
-          { value: s.value },
-          s.label
-        );
-      })
-    ),
-    method === 'withdraw' && _react2.default.createElement(_Input2.default, {
+    method === 'withdraw' && methodDetails.accountTypes && methodDetails.accountTypes.length > 1 && _react2.default.createElement(_Select2.default, {
+      required: true,
+      name: 'accountType',
+      label: (0, _translate2.default)({
+        id: 'cashier.details.accountType',
+        defaultMessage: 'account type'
+      }, intl),
+      defaultOptionLabel: (0, _translate2.default)({
+        id: 'cashier.details.select-account-type',
+        defaultMessage: 'select account type'
+      }, intl),
+      options: methodDetails.accountTypes.map(translateMap('accountTypes'))
+    }),
+    method === 'withdraw' && _react2.default.createElement(_TextInput2.default, {
       required: true,
       name: 'bankAccount',
-      value: values['bankAccount'],
-      onChange: function onChange(e, bankAccount) {
-        return change('bankAccount', bankAccount);
-      },
       label: (0, _translate2.default)({
         id: 'cashier.details.bankAccount',
         defaultMessage: 'bankAccount'
       }, intl)
     }),
-    method === 'deposit' && methodDetails.services && methodDetails.services.length > 1 && _react2.default.createElement(
-      _Select2.default,
-      {
-        required: true,
-        name: 'service',
-        value: values['service'],
-        onChange: function onChange(e, service) {
-          return change('service', service);
-        },
-        label: (0, _translate2.default)({
-          id: 'cashier.details.service',
-          defaultMessage: 'service'
-        }, intl) },
-      !values['service'] && _react2.default.createElement(
-        _Select2.default.Option,
-        { value: '', selected: true, disabled: true },
-        (0, _translate2.default)({
-          id: 'cashier.details.service',
-          defaultMessage: 'service'
-        }, intl)
-      ),
-      methodDetails.services.map(translateMap('services')).map(function (s) {
-        return _react2.default.createElement(
-          _Select2.default.Option,
-          { value: s.value },
-          s.label
-        );
-      })
-    )
+    method === 'deposit' && methodDetails.services && methodDetails.services.length > 1 && _react2.default.createElement(_Select2.default, {
+      required: true,
+      name: 'service',
+      label: (0, _translate2.default)({
+        id: 'cashier.details.service',
+        defaultMessage: 'service'
+      }, intl),
+      defaultOptionLabel: (0, _translate2.default)({
+        id: 'cashier.details.select-service',
+        defaultMessage: 'select service'
+      }, intl),
+      options: methodDetails.services.map(translateMap('services'))
+    })
   );
 };
 
 var BankIntl = function BankIntl(_ref9) {
   var account = _ref9.account,
-      intl = _ref9.intl,
-      values = _ref9.values,
-      change = _ref9.change;
+      intl = _ref9.intl;
 
   return _react2.default.createElement(
     'div',
     { className: 'payment-account-info' },
-    _react2.default.createElement(_Input2.default, {
-      required: true,
+    _react2.default.createElement(_TextInput2.default, {
+      value: account.accountId ? account.maskedAccount.replace(/\d*-/g, '') : undefined,
       name: 'accountNumber',
-      value: account.accountId ? account.maskedAccount.replace(/\d*-/g, '') : values['accountNumber'],
-      onChange: function onChange(e, accountNumber) {
-        return change('accountNumber', accountNumber);
-      },
       label: (0, _translate2.default)({ id: 'cashier.details.accountNumber' }, intl),
-      disabled: account.accountId
+      disabled: account.accountId,
+      required: true
     }),
-    _react2.default.createElement(_Input2.default, {
+    _react2.default.createElement(_TextInput2.default, {
       required: true,
+      value: account.accountId ? account.maskedAccount.replace(/\s(.*)/g, '') : undefined,
       name: 'bic',
-      value: account.accountId ? account.maskedAccount.replace(/\s(.*)/g, '') : values['bic'],
-      onChange: function onChange(e, bic) {
-        return change('bic', bic);
-      },
       label: (0, _translate2.default)({ id: 'cashier.details.bic' }, intl),
       disabled: account.accountId
     })
@@ -569,9 +382,7 @@ var BankIntl = function BankIntl(_ref9) {
 var CryptoCurrency = function CryptoCurrency(_ref10) {
   var intl = _ref10.intl,
       detail = _ref10.detail,
-      method = _ref10.method,
-      values = _ref10.values,
-      change = _ref10.change;
+      method = _ref10.method;
 
   var methodDetails = {
     cryptoCurrencies: (0, _get2.default)(detail, 'config.cryptoCurrencies', [])
@@ -580,42 +391,27 @@ var CryptoCurrency = function CryptoCurrency(_ref10) {
   return _react2.default.createElement(
     'div',
     { className: 'payment-account-info' },
-    methodDetails.cryptoCurrencies.length > 0 && _react2.default.createElement(
-      _Select2.default,
-      {
-        required: true,
-        name: 'cryptoCurrency',
-        value: values['cryptoCurrency'],
-        onChange: function onChange(e, cryptoCurrency) {
-          return change('cryptoCurrency', cryptoCurrency);
-        },
-        label: (0, _translate2.default)({
-          id: 'cashier.details.cryptoCurrency',
-          defaultMessage: 'Crypto currency'
-        }, intl) },
-      !values['cryptoCurrency'] && _react2.default.createElement(
-        _Select2.default.Option,
-        { value: '', selected: true, disabled: true },
-        (0, _translate2.default)({
-          id: 'cashier.details.select-cryptoCurrency',
-          defaultMessage: 'Select crypto currency'
-        }, intl)
-      ),
-      methodDetails.cryptoCurrencies.map(function (cryptoCurrency) {
-        return _react2.default.createElement(
-          _Select2.default.Option,
-          { value: cryptoCurrency },
-          cryptoCurrency
-        );
+    methodDetails.cryptoCurrencies.length > 0 && _react2.default.createElement(_Select2.default, {
+      required: true,
+      name: 'cryptoCurrency',
+      label: (0, _translate2.default)({
+        id: 'cashier.details.cryptoCurrency',
+        defaultMessage: 'Crypto currency'
+      }, intl),
+      defaultOptionLabel: (0, _translate2.default)({
+        id: 'cashier.details.select-cryptoCurrency',
+        defaultMessage: 'Select crypto currency'
+      }, intl),
+      options: methodDetails.cryptoCurrencies.map(function (cryptoCurrency) {
+        return {
+          label: cryptoCurrency,
+          value: cryptoCurrency
+        };
       })
-    ),
-    method === 'withdraw' && _react2.default.createElement(_Input2.default, {
+    }),
+    method === 'withdraw' && _react2.default.createElement(_TextInput2.default, {
       required: true,
       name: 'walletAddress',
-      value: values['walletAddress'],
-      onChange: function onChange(e, walletAddress) {
-        return change('walletAddress', walletAddress);
-      },
       label: (0, _translate2.default)({
         id: 'cashier.details.walletAddress',
         defaultMessage: 'Wallet address'
@@ -626,74 +422,85 @@ var CryptoCurrency = function CryptoCurrency(_ref10) {
 
 var Jeton = function Jeton(_ref11) {
   var account = _ref11.account,
-      intl = _ref11.intl,
-      values = _ref11.values,
-      change = _ref11.change;
+      intl = _ref11.intl;
 
   return _react2.default.createElement(
     'div',
     { className: 'payment-account-info' },
-    _react2.default.createElement(_Input2.default, {
-      required: true,
+    _react2.default.createElement(_TextInput2.default, {
+      value: account.maskedAccount,
       name: 'customerNumber',
-      value: account.maskedAccount || values['customerNumber'],
-      onChange: function onChange(e, customerNumber) {
-        return change('customerNumber', customerNumber);
-      },
       label: (0, _translate2.default)({ id: 'cashier.details.customerNumber' }, intl),
-      disabled: account.accountId
+      disabled: account.accountId,
+      required: true
     })
   );
 };
 
 var BestPay = function BestPay(_ref12) {
   var account = _ref12.account,
-      intl = _ref12.intl,
-      values = _ref12.values,
-      change = _ref12.change;
+      intl = _ref12.intl;
 
   return _react2.default.createElement(
     'div',
     { className: 'payment-account-info' },
-    _react2.default.createElement(_Input2.default, {
-      required: true,
+    _react2.default.createElement(_TextInput2.default, {
+      value: account.accountId ? account.maskedAccount.replace(/\d*-/g, '') : undefined,
       name: 'accountNumber',
-      value: account.accountId ? account.maskedAccount.replace(/\d*-/g, '') : values['accountNumber'],
-      onChange: function onChange(e, accountNumber) {
-        return change('accountNumber', accountNumber);
-      },
       label: (0, _translate2.default)({ id: 'cashier.details.accountNumber' }, intl),
-      disabled: account.accountId
+      disabled: account.accountId,
+      required: true
     }),
-    _react2.default.createElement(_Input2.default, {
-      required: true,
+    _react2.default.createElement(_TextInput2.default, {
       name: 'swiftCode',
-      value: values['swiftCode'],
-      onChange: function onChange(e, swiftCode) {
-        return change('swiftCode', swiftCode);
-      },
-      label: (0, _translate2.default)({ id: 'cashier.details.swiftCode' }, intl)
+      label: (0, _translate2.default)({ id: 'cashier.details.swiftCode' }, intl),
+      required: true
     })
   );
 };
 
-var Mifinity = function Mifinity(_ref13) {
+var EzeeWallet = function EzeeWallet(_ref13) {
   var account = _ref13.account,
       intl = _ref13.intl,
-      change = _ref13.change,
-      values = _ref13.values;
+      method = _ref13.method;
 
   return _react2.default.createElement(
     'div',
-    null,
-    _react2.default.createElement(_Input2.default, {
+    { className: 'payment-account-info' },
+    _react2.default.createElement(_TextInput2.default, {
+      required: true,
+      name: 'walletId',
+      label: (0, _translate2.default)({
+        id: 'cashier.details.walletId',
+        defaultMessage: 'Wallet ID'
+      }, intl),
       disabled: account.accountId,
-      value: values['destinationAccount'],
-      onChange: function onChange(e, account) {
-        return change('destinationAccount', account);
-      },
+      value: account.maskedAccount
+    }),
+    method === 'deposit' && _react2.default.createElement(_TextInput2.default, {
+      required: true,
+      type: 'password',
+      name: 'walletPassword',
+      label: (0, _translate2.default)({
+        id: 'cashier.details.walletPassword',
+        defaultMessage: 'Wallet password'
+      }, intl)
+    })
+  );
+};
+
+var Mifinity = function Mifinity(_ref14) {
+  var account = _ref14.account,
+      intl = _ref14.intl;
+
+  return _react2.default.createElement(
+    'div',
+    null,
+    _react2.default.createElement(_TextInput2.default, {
+      value: account.maskedAccount,
       name: 'destinationAccount',
-      label: (0, _translate2.default)({ id: 'cashier.details.account' }, intl),
+      label: (0, _translate2.default)({ id: 'cashier.details.accountNumber' }, intl),
+      disabled: account.accountId,
       required: true
     })
   );
@@ -762,6 +569,11 @@ var CryptoCurrencyDeposit = exports.CryptoCurrencyDeposit = {
   parser: _identity2.default
 };
 
+var EzeeWalletDeposit = exports.EzeeWalletDeposit = {
+  component: injectMethod({ method: 'deposit' }, (0, _reactIntl.injectIntl)(EzeeWallet)),
+  parser: _identity2.default
+};
+
 var ZimplerDeposit = exports.ZimplerDeposit = null;
 var BankDeposit = exports.BankDeposit = null;
 var TrustlyDeposit = exports.TrustlyDeposit = null;
@@ -850,9 +662,14 @@ var AstroPayBankWithdrawal = exports.AstroPayBankWithdrawal = {
   parser: _identity2.default
 };
 
+var EzeeWalletWithdrawal = exports.EzeeWalletWithdrawal = {
+  component: injectMethod({ method: 'withdraw' }, (0, _reactIntl.injectIntl)(EzeeWallet)),
+  parser: _identity2.default
+};
+
 var MiFinityEWalletWithdrawal = exports.MiFinityEWalletWithdrawal = {
-  component: injectMethod({ method: 'withdraw' }, (0, _reactIntl.injectIntl)(Mifinity)),
-  parser: Parser.parseMifinity
+  component: (0, _reactIntl.injectIntl)(Mifinity),
+  parser: _identity2.default
 };
 
 var ZimplerWithdrawal = exports.ZimplerWithdrawal = null;