@stokr/components-library 2.3.65-beta.8 → 2.3.65

package/dist/components/KYCFlow/DocumentFileUpload.js

@@ -1,263 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _formik = require("formik");
-var _reactTippy = require("react-tippy");
-var _Text = _interopRequireDefault(require("../Text/Text.styles"));
-var _Button = _interopRequireDefault(require("../Button/Button.styles"));
-var _Grid = require("../Grid/Grid.styles");
-var _SvgIcons = require("../SvgIcons");
-var _ComponentWrapper = _interopRequireDefault(require("../ComponentWrapper/ComponentWrapper.styles"));
-var _ComponentScroll = _interopRequireDefault(require("../ComponentScroll/ComponentScroll"));
-var _SectionTitle = _interopRequireDefault(require("../SectionTitle/SectionTitle.styles"));
-var _styles = require("./_styles");
-var _DocumentSelect = require("./DocumentSelect");
-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 _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); }
-class DocumentFileUpload extends _react.PureComponent {
-  constructor() {
-    super(...arguments);
-    _defineProperty(this, "state", {
-      popupOpen: false
-    });
-    _defineProperty(this, "handlePopup", isOpen => {
-      const {
-        formik
-      } = this.props;
-      const {
-        values
-      } = formik;
-      const canGoNext = values.documentType === _DocumentSelect.DocumentSelectEnum.PASSPORT ? !!values.passportPicture : !!values.cardFrontPicture && !!values.cardBackPicture;
-      this.validate();
-      this.setState({
-        popupOpen: !canGoNext ? isOpen : false
-      });
-    });
-    _defineProperty(this, "handleFileUpload", (e, fieldName) => {
-      const {
-        formik
-      } = this.props;
-      const {
-        setFieldValue
-      } = formik;
-      if (!e.target.files) {
-        return;
-      }
-      setFieldValue(fieldName, e.target.files[0]);
-    });
-    _defineProperty(this, "removeFile", fieldName => {
-      const {
-        formik
-      } = this.props;
-      const {
-        setFieldValue
-      } = formik;
-      setFieldValue(fieldName, '');
-    });
-    _defineProperty(this, "validate", () => {
-      const {
-        formik
-      } = this.props;
-      const {
-        validationSchema,
-        values,
-        setFieldError
-      } = formik;
-      const fieldNames = ['passportPicture', 'cardFrontPicture', 'cardBackPicture'];
-      try {
-        validationSchema.validateSync(values, {
-          abortEarly: false
-        });
-      } catch (validateError) {
-        const errors = validateError.inner.filter(error => fieldNames.includes(error.path));
-        errors.forEach(error => {
-          setFieldError(error.path, error.errors[0]);
-        });
-      }
-    });
-  }
-  componentDidMount() {
-    const {
-      setPrevStep
-    } = this.props;
-    setPrevStep('kycDocumentVerificationType');
-  }
-  render() {
-    const {
-      changeStep,
-      formik
-    } = this.props;
-    const {
-      values,
-      errors
-    } = formik;
-    const {
-      popupOpen
-    } = this.state;
-    const canGoNext = values.documentType === _DocumentSelect.DocumentSelectEnum.PASSPORT ? !!values.passportPicture : !!values.cardFrontPicture && !!values.cardBackPicture;
-    return /*#__PURE__*/_react.default.createElement(_styles.Wrapper, null, /*#__PURE__*/_react.default.createElement(_styles.Header, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_SectionTitle.default, null, "Verify your identity"), /*#__PURE__*/_react.default.createElement(_styles.HeaderTitle, {
-      withMargin: true
-    }, "Upload Picture")), /*#__PURE__*/_react.default.createElement(_styles.HeaderButtonWrapper, null, /*#__PURE__*/_react.default.createElement(_reactTippy.Tooltip, {
-      open: popupOpen,
-      position: "bottom",
-      title: values.documentType === _DocumentSelect.DocumentSelectEnum.PASSPORT ? errors.passportPicture : errors.cardFrontPicture || errors.cardBackPicture,
-      theme: "light",
-      arrow: true,
-      duration: 200
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      onMouseEnter: () => this.handlePopup(true),
-      onMouseLeave: () => this.handlePopup(false)
-    }, /*#__PURE__*/_react.default.createElement(_Button.default, {
-      onClick: () => changeStep('kycDocumentSuccess'),
-      disabled: !canGoNext
-    }, "Next"))))), /*#__PURE__*/_react.default.createElement(_styles.Body, {
-      noVerticalPadding: true
-    }, values.documentType === _DocumentSelect.DocumentSelectEnum.PASSPORT && /*#__PURE__*/_react.default.createElement(_Grid.Row, {
-      stretch: true
-    }, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 8
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      verticalPadding: true,
-      verticalCenter: true
-    }, /*#__PURE__*/_react.default.createElement(_styles.BodyTitle, null, "PASSPORT"), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_SvgIcons.PassportSvg, null)), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_Text.default, {
-      center: true
-    }, /*#__PURE__*/_react.default.createElement("p", null, "Please use a JPG, PNG or PDF image below 2MB (we recommend a 2MP photo or 200-300 dpi scan)"))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "passportPicture",
-      validate: this.validate
-    }, _ref => {
-      let {
-        field
-      } = _ref;
-      return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, field.value ? /*#__PURE__*/_react.default.createElement(_styles.FileInputList, null, /*#__PURE__*/_react.default.createElement(_styles.FileInputItem, null, /*#__PURE__*/_react.default.createElement(_react.Fragment, null, field.value.name, /*#__PURE__*/_react.default.createElement(_styles.FileInputRemove, {
-        onClick: e => {
-          e.preventDefault();
-          e.stopPropagation();
-          this.removeFile(field.name);
-        }
-      })))) : /*#__PURE__*/_react.default.createElement(_styles.FileInputWrapper, {
-        center: true,
-        minWidth: "188px"
-      }, "Select Passport", /*#__PURE__*/_react.default.createElement(_styles.FileInput, {
-        name: field.name,
-        accept: "image/png,image/jpeg,application/pdf",
-        onChange: e => this.handleFileUpload(e, field.name)
-      })));
-    })))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 8
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      verticalPadding: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentScroll.default, {
-      noMobileScroll: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingVertical: true
-    }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("p", null, "Please select an image file showing the page of the document with your photo on it"), /*#__PURE__*/_react.default.createElement("p", null, "Make sure that your personal information is readable. Also, nothing on the document should be covered or censored"), /*#__PURE__*/_react.default.createElement("p", null, "Be careful that none of your fingers are covering the document, and that all of the document is visible and contrasted against the background."), /*#__PURE__*/_react.default.createElement("p", null, "Ensure that the document is in focus. Avoid bad lighting conditions which can lead to motion blur and image noise."), /*#__PURE__*/_react.default.createElement("p", null, "The surface of the background should be evenly lit. The ID document should not present perspective distortion."), /*#__PURE__*/_react.default.createElement("p", null, "If your photo or scan is not of high enough quality, we will request a better copy."))))))), values.documentType === _DocumentSelect.DocumentSelectEnum.TWO_SIDED_DOCUMENT && /*#__PURE__*/_react.default.createElement(_Grid.Row, {
-      stretch: true
-    }, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 8
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, null, /*#__PURE__*/_react.default.createElement(_Grid.Row, {
-      stretch: true
-    }, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 8
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      verticalPadding: true,
-      verticalCenter: true
-    }, /*#__PURE__*/_react.default.createElement(_styles.BodyTitle, null, "UPLOAD CARD FRONT"), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_SvgIcons.DocumentSmallSvg, null)), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_Text.default, {
-      center: true
-    }, /*#__PURE__*/_react.default.createElement("p", null, "With your picture"))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPadding: true,
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "cardFrontPicture",
-      validate: this.validate
-    }, _ref2 => {
-      let {
-        field
-      } = _ref2;
-      return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, field.value ? /*#__PURE__*/_react.default.createElement(_styles.FileInputList, null, /*#__PURE__*/_react.default.createElement(_styles.FileInputItem, null, /*#__PURE__*/_react.default.createElement(_react.Fragment, null, field.value.name, /*#__PURE__*/_react.default.createElement(_styles.FileInputRemove, {
-        onClick: e => {
-          e.preventDefault();
-          e.stopPropagation();
-          this.removeFile(field.name);
-        }
-      })))) : /*#__PURE__*/_react.default.createElement(_styles.FileInputWrapper, {
-        center: true
-      }, "Select", /*#__PURE__*/_react.default.createElement(_styles.FileInput, {
-        name: field.name,
-        accept: "image/png,image/jpeg,application/pdf",
-        onChange: e => this.handleFileUpload(e, field.name)
-      })));
-    })))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 8
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      verticalPadding: true,
-      verticalCenter: true
-    }, /*#__PURE__*/_react.default.createElement(_styles.BodyTitle, null, "UPLOAD CARD BACK"), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_SvgIcons.DocumentBackSvg, null)), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_Text.default, {
-      center: true
-    }, /*#__PURE__*/_react.default.createElement("p", null, "The other one"))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPadding: true,
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "cardBackPicture",
-      validate: this.validate
-    }, _ref3 => {
-      let {
-        field
-      } = _ref3;
-      return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, field.value ? /*#__PURE__*/_react.default.createElement(_styles.FileInputList, null, /*#__PURE__*/_react.default.createElement(_styles.FileInputItem, null, /*#__PURE__*/_react.default.createElement(_react.Fragment, null, field.value.name, /*#__PURE__*/_react.default.createElement(_styles.FileInputRemove, {
-        onClick: e => {
-          e.preventDefault();
-          e.stopPropagation();
-          this.removeFile(field.name);
-        }
-      })))) : /*#__PURE__*/_react.default.createElement(_styles.FileInputWrapper, {
-        center: true
-      }, "Select", /*#__PURE__*/_react.default.createElement(_styles.FileInput, {
-        name: field.name,
-        accept: "image/png,image/jpeg,application/pdf",
-        onChange: e => this.handleFileUpload(e, field.name)
-      })));
-    }))))))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 8
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      verticalPadding: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentScroll.default, {
-      noMobileScroll: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingVertical: true
-    }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("p", null, "Please use a JPG, PNG or PDF image below 2MB (we recommend a 2MP photo or 200-300 dpi scan)"), /*#__PURE__*/_react.default.createElement("p", null, "Make sure that your personal information is readable. Also, nothing on the document should be covered or censored"), /*#__PURE__*/_react.default.createElement("p", null, "Be careful that none of your fingers are covering the document, and that all of the document is visible and contrasted against the background."), /*#__PURE__*/_react.default.createElement("p", null, "Ensure that the document is in focus. Avoid bad lighting conditions which can lead to motion blur and image noise."), /*#__PURE__*/_react.default.createElement("p", null, "The surface of the background should be evenly lit. The ID document should not present perspective distortion."), /*#__PURE__*/_react.default.createElement("p", null, "If your photo or scan is not of high enough quality, we will request a better copy.")))))))));
-  }
-}
-DocumentFileUpload.propTypes = {
-  changeStep: _propTypes.default.func.isRequired,
-  setPrevStep: _propTypes.default.func.isRequired,
-  formik: _propTypes.default.instanceOf(Object).isRequired
-};
-var _default = exports.default = (0, _formik.connect)(DocumentFileUpload);

package/dist/components/KYCFlow/DocumentScan.js

@@ -1,75 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _formik = require("formik");
-var _Grid = require("../Grid/Grid.styles");
-var _SectionTitle = _interopRequireDefault(require("../SectionTitle/SectionTitle.styles"));
-var _SvgIcons = require("../SvgIcons");
-var _styles = require("./_styles");
-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); }
-const getSectionTitle = scanItem => {
-  switch (scanItem) {
-    case 'passportPicture':
-      return 'Scan identity page';
-    case 'cardFrontPicture':
-      return 'Scan front of ID card';
-    case 'cardBackPicture':
-      return 'Scan back of ID card';
-    default:
-      return '';
-  }
-};
-const DocumentScan = _ref => {
-  let {
-    changeStep,
-    setPrevStep,
-    scanItem,
-    formik
-  } = _ref;
-  (0, _react.useEffect)(() => {
-    setPrevStep('kycDocumentScan');
-  }, []);
-  const {
-    setFieldValue
-  } = formik;
-  return /*#__PURE__*/_react.default.createElement(_styles.Wrapper, null, /*#__PURE__*/_react.default.createElement(_styles.Header, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_SectionTitle.default, null, "DOCUMENT RECOGNITION"), /*#__PURE__*/_react.default.createElement(_styles.HeaderTitle, {
-    withMargin: true
-  }, getSectionTitle(scanItem)))), /*#__PURE__*/_react.default.createElement(_styles.Body, {
-    noHorizontalPadding: true
-  }, /*#__PURE__*/_react.default.createElement(_Grid.Row, {
-    center: true,
-    stretch: true
-  }, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-    part: 3
-  }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-    verticalCenter: true
-  }, /*#__PURE__*/_react.default.createElement(_styles.BodyTitle, {
-    faceScan: true
-  }, "RETAKE"), /*#__PURE__*/_react.default.createElement(_styles.RetakeButton, null, /*#__PURE__*/_react.default.createElement(_SvgIcons.RefreshSvg, null)))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-    part: 10
-  }, /*#__PURE__*/_react.default.createElement(_styles.Mask, null)), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-    part: 3
-  }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-    verticalCenter: true
-  }, /*#__PURE__*/_react.default.createElement(_styles.BodyTitle, {
-    faceScan: true
-  }, "DONE"), /*#__PURE__*/_react.default.createElement(_styles.DoneButton, {
-    onClick: () => {
-      setFieldValue(scanItem, 'TODO: GET PHOTO FROM CAMERA');
-      changeStep('kycDocumentScan');
-    }
-  }))))));
-};
-DocumentScan.propTypes = {
-  changeStep: _propTypes.default.func.isRequired,
-  setPrevStep: _propTypes.default.func.isRequired,
-  scanItem: _propTypes.default.string.isRequired,
-  formik: _propTypes.default.instanceOf(Object).isRequired
-};
-var _default = exports.default = (0, _formik.connect)(DocumentScan);

package/dist/components/KYCFlow/DocumentScanUpload.js

@@ -1,251 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _formik = require("formik");
-var _reactTippy = require("react-tippy");
-var _Text = _interopRequireDefault(require("../Text/Text.styles"));
-var _Button = _interopRequireDefault(require("../Button/Button.styles"));
-var _Grid = require("../Grid/Grid.styles");
-var _SvgIcons = require("../SvgIcons");
-var _ComponentWrapper = _interopRequireDefault(require("../ComponentWrapper/ComponentWrapper.styles"));
-var _ComponentScroll = _interopRequireDefault(require("../ComponentScroll/ComponentScroll"));
-var _SectionTitle = _interopRequireDefault(require("../SectionTitle/SectionTitle.styles"));
-var _styles = require("./_styles");
-var _DocumentSelect = require("./DocumentSelect");
-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 _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); }
-class DocumentScanUpload extends _react.PureComponent {
-  constructor() {
-    super(...arguments);
-    _defineProperty(this, "state", {
-      popupOpen: false
-    });
-    _defineProperty(this, "handlePopup", isOpen => {
-      const {
-        formik
-      } = this.props;
-      const {
-        values
-      } = formik;
-      const canGoNext = values.documentType === _DocumentSelect.DocumentSelectEnum.PASSPORT ? !!values.passportPicture : !!values.cardFrontPicture && !!values.cardBackPicture;
-      this.validate();
-      this.setState({
-        popupOpen: !canGoNext ? isOpen : false
-      });
-    });
-    _defineProperty(this, "handleFileUpload", (e, fieldName) => {
-      const {
-        formik
-      } = this.props;
-      const {
-        setFieldValue
-      } = formik;
-      if (!e.target.files) {
-        return;
-      }
-      setFieldValue(fieldName, e.target.files[0]);
-    });
-    _defineProperty(this, "removeFile", fieldName => {
-      const {
-        formik
-      } = this.props;
-      const {
-        setFieldValue
-      } = formik;
-      setFieldValue(fieldName, '');
-    });
-    _defineProperty(this, "validate", () => {
-      const {
-        formik
-      } = this.props;
-      const {
-        validationSchema,
-        values,
-        setFieldError
-      } = formik;
-      const fieldNames = ['passportPicture', 'cardFrontPicture', 'cardBackPicture'];
-      try {
-        validationSchema.validateSync(values, {
-          abortEarly: false
-        });
-      } catch (validateError) {
-        const errors = validateError.inner.filter(error => fieldNames.includes(error.path));
-        errors.forEach(error => {
-          setFieldError(error.path, error.errors[0]);
-        });
-      }
-    });
-  }
-  componentDidMount() {
-    const {
-      setPrevStep
-    } = this.props;
-    setPrevStep('kycDocumentVerificationType');
-  }
-  render() {
-    const {
-      changeStep,
-      formik,
-      setScanItem
-    } = this.props;
-    const {
-      values,
-      errors
-    } = formik;
-    const {
-      popupOpen
-    } = this.state;
-    const canGoNext = values.documentType === _DocumentSelect.DocumentSelectEnum.PASSPORT ? !!values.passportPicture : !!values.cardFrontPicture && !!values.cardBackPicture;
-    return /*#__PURE__*/_react.default.createElement(_styles.Wrapper, null, /*#__PURE__*/_react.default.createElement(_styles.Header, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_SectionTitle.default, null, "Verify your identity"), /*#__PURE__*/_react.default.createElement(_styles.HeaderTitle, {
-      withMargin: true
-    }, "Upload Picture")), /*#__PURE__*/_react.default.createElement(_styles.HeaderButtonWrapper, null, /*#__PURE__*/_react.default.createElement(_reactTippy.Tooltip, {
-      open: popupOpen,
-      position: "bottom",
-      title: values.documentType === _DocumentSelect.DocumentSelectEnum.PASSPORT ? errors.passportPicture : errors.cardFrontPicture || errors.cardBackPicture,
-      theme: "light",
-      arrow: true,
-      duration: 200
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      onMouseEnter: () => this.handlePopup(true),
-      onMouseLeave: () => this.handlePopup(false)
-    }, /*#__PURE__*/_react.default.createElement(_Button.default, {
-      onClick: () => changeStep('kycDocumentSuccess'),
-      disabled: !canGoNext
-    }, "Next"))))), /*#__PURE__*/_react.default.createElement(_styles.Body, {
-      noVerticalPadding: true
-    }, values.documentType === _DocumentSelect.DocumentSelectEnum.PASSPORT && /*#__PURE__*/_react.default.createElement(_Grid.Row, {
-      stretch: true
-    }, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 8
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      verticalPadding: true,
-      verticalCenter: true
-    }, /*#__PURE__*/_react.default.createElement(_styles.BodyTitle, null, "PASSPORT"), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_SvgIcons.PassportSvg, null)), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingVertical: true,
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_Text.default, {
-      center: true
-    }, /*#__PURE__*/_react.default.createElement("p", null, "Please scan the identity page with your photo on it"))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "passportPicture",
-      validate: this.validate
-    }, _ref => {
-      let {
-        field
-      } = _ref;
-      return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.SuccessMark, {
-        isHidden: !field.value
-      }), /*#__PURE__*/_react.default.createElement(_Button.default, {
-        center: true,
-        minWidth: "188px",
-        onClick: () => {
-          setScanItem(field.name);
-          changeStep('kycDocumentCameraScan');
-        }
-      }, "Scan Document"));
-    })))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 8
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      verticalPadding: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentScroll.default, {
-      noMobileScroll: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingVertical: true
-    }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("p", null, "Make sure that your personal information is readable. Also, nothing on the document should be covered or censored"), /*#__PURE__*/_react.default.createElement("p", null, "Be careful that none of your fingers are covering the document, and that all of the document is visible and contrasted against the background."), /*#__PURE__*/_react.default.createElement("p", null, "Ensure that the document is in focus. Avoid bad lighting conditions which can lead to motion blur and image noise."), /*#__PURE__*/_react.default.createElement("p", null, "The surface of the background should be evenly lit. The ID document should not present perspective distortion."), /*#__PURE__*/_react.default.createElement("p", null, "If your photo or scan is not of high enough quality, we will request a better copy."))))))), values.documentType === _DocumentSelect.DocumentSelectEnum.TWO_SIDED_DOCUMENT && /*#__PURE__*/_react.default.createElement(_Grid.Row, {
-      stretch: true
-    }, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 8
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, null, /*#__PURE__*/_react.default.createElement(_Grid.Row, {
-      stretch: true
-    }, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 8
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      verticalPadding: true,
-      verticalCenter: true
-    }, /*#__PURE__*/_react.default.createElement(_styles.BodyTitle, null, "UPLOAD CARD FRONT"), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_SvgIcons.DocumentSmallSvg, null)), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPadding: true,
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_Text.default, {
-      center: true
-    }, /*#__PURE__*/_react.default.createElement("p", null, "With your picture"))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPadding: true,
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "cardFrontPicture",
-      validate: this.validate
-    }, _ref2 => {
-      let {
-        field
-      } = _ref2;
-      return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.SuccessMark, {
-        isHidden: !field.value
-      }), /*#__PURE__*/_react.default.createElement(_Button.default, {
-        center: true,
-        onClick: () => {
-          setScanItem(field.name);
-          changeStep('kycDocumentCameraScan');
-        }
-      }, "Scan"));
-    })))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 8
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      verticalPadding: true,
-      verticalCenter: true
-    }, /*#__PURE__*/_react.default.createElement(_styles.BodyTitle, null, "UPLOAD CARD BACK"), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_SvgIcons.DocumentBackSvg, null)), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPadding: true,
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_Text.default, {
-      center: true
-    }, /*#__PURE__*/_react.default.createElement("p", null, "The other one"))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPadding: true,
-      center: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "cardBackPicture",
-      validate: this.validate
-    }, _ref3 => {
-      let {
-        field
-      } = _ref3;
-      return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.SuccessMark, {
-        isHidden: !field.value
-      }), /*#__PURE__*/_react.default.createElement(_Button.default, {
-        center: true,
-        onClick: () => {
-          setScanItem(field.name);
-          changeStep('kycDocumentCameraScan');
-        }
-      }, "Scan"));
-    }))))))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 8
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      verticalPadding: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentScroll.default, {
-      noMobileScroll: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingVertical: true
-    }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("p", null, "Please use a JPG, PNG or PDF image below 2MB (we recommend a 2MP photo or 200-300 dpi scan)"), /*#__PURE__*/_react.default.createElement("p", null, "Make sure that your personal information is readable. Also, nothing on the document should be covered or censored"), /*#__PURE__*/_react.default.createElement("p", null, "Be careful that none of your fingers are covering the document, and that all of the document is visible and contrasted against the background."), /*#__PURE__*/_react.default.createElement("p", null, "Ensure that the document is in focus. Avoid bad lighting conditions which can lead to motion blur and image noise."), /*#__PURE__*/_react.default.createElement("p", null, "The surface of the background should be evenly lit. The ID document should not present perspective distortion."), /*#__PURE__*/_react.default.createElement("p", null, "If your photo or scan is not of high enough quality, we will request a better copy.")))))))));
-  }
-}
-DocumentScanUpload.propTypes = {
-  changeStep: _propTypes.default.func.isRequired,
-  setPrevStep: _propTypes.default.func.isRequired,
-  setScanItem: _propTypes.default.func.isRequired,
-  formik: _propTypes.default.instanceOf(Object).isRequired
-};
-var _default = exports.default = (0, _formik.connect)(DocumentScanUpload);