@stokr/components-library 2.3.65-beta.1 → 2.3.65-beta.11

package/dist/components/KYCFlow/BasicInfo.js

@@ -1,448 +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 _Form = require("../Form/Form");
-var _Input = _interopRequireDefault(require("../Input/Input"));
-var _Select = _interopRequireDefault(require("../Input/Select"));
-var _Button = _interopRequireDefault(require("../Button/Button.styles"));
-var _Grid = require("../Grid/Grid.styles");
-var _ComponentWrapper = _interopRequireDefault(require("../ComponentWrapper/ComponentWrapper.styles"));
-var _SectionTitle = _interopRequireDefault(require("../SectionTitle/SectionTitle.styles"));
-var _Checkbox = _interopRequireDefault(require("../Checkbox/Checkbox"));
-var _styles = require("./_styles");
-var _countriesList = _interopRequireDefault(require("../../utils/countries-list"));
-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 _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-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 countriesList from '../../utils/countries-list'
-class BasicInfo extends _react.PureComponent {
-  constructor() {
-    super(...arguments);
-    _defineProperty(this, "state", {
-      popupOpen: false,
-      hasErrors: true
-    });
-    _defineProperty(this, "fields", ['firstName', 'middleName', 'lastName', 'phonePrefix', 'phone', 'postalCode', 'city', 'street', 'country', 'occupation', 'occupationDetails', 'dataConfirmation']);
-    _defineProperty(this, "handlePopup", async isOpen => {
-      const {
-        formik
-      } = this.props;
-      const {
-        validateForm,
-        errors,
-        setFieldTouched
-      } = formik;
-      this.fields.forEach(field => setFieldTouched(field));
-      await validateForm();
-      this.setState({
-        popupOpen: Object.keys(errors).length ? isOpen : false,
-        hasErrors: !!Object.keys(errors).length
-      });
-    });
-  }
-  componentDidMount() {
-    const {
-      setPrevStep
-    } = this.props;
-    setPrevStep('kycFaceScanSuccess', 2);
-  }
-  render() {
-    const {
-      changeStep,
-      formik
-    } = this.props;
-    const {
-      errors,
-      setFieldValue,
-      setFieldTouched,
-      touched
-    } = formik;
-    const {
-      popupOpen,
-      hasErrors
-    } = this.state;
-    const handleChangeSelect = field => {
-      setFieldValue(field.name, field.value, false);
-      setFieldTouched(field.name);
-    };
-    const handleBlurSelect = field => {
-      setFieldTouched(field.name);
-    };
-    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
-    }, "Basic info"))), /*#__PURE__*/_react.default.createElement(_styles.Body, {
-      form: true
-    }, /*#__PURE__*/_react.default.createElement(_Grid.Row, null, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 1,
-      full: 2
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      formInner: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      fluid: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "firstName",
-      validation: () => (0, _Form.validate)('firstName', formik)
-    }, _ref => {
-      let {
-        field
-      } = _ref;
-      return /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_Input.default, _extends({
-        label: "First Name",
-        id: field.name,
-        error: !!errors[field.name],
-        touched: !!touched[field.name]
-      }, field)), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
-        show: touched[field.name] && errors[field.name]
-      }, errors[field.name]));
-    })))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 1,
-      full: 2
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      formInner: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      fluid: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "middleName",
-      validation: () => (0, _Form.validate)('middleName', formik)
-    }, _ref2 => {
-      let {
-        field
-      } = _ref2;
-      return /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_Input.default, _extends({
-        label: "Middle Name",
-        id: field.name,
-        error: !!errors[field.name],
-        touched: !!touched[field.name]
-      }, field)), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
-        show: touched[field.name] && errors[field.name]
-      }, errors[field.name]));
-    }))))), /*#__PURE__*/_react.default.createElement(_Grid.Row, null, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 1,
-      full: 2
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      formInner: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      fluid: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "lastName",
-      validation: () => (0, _Form.validate)('lastName', formik)
-    }, _ref3 => {
-      let {
-        field
-      } = _ref3;
-      return /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_Input.default, _extends({
-        label: "Last Name",
-        id: field.name,
-        error: !!errors[field.name],
-        touched: !!touched[field.name]
-      }, field)), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
-        show: touched[field.name] && errors[field.name]
-      }, errors[field.name]));
-    })))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 1,
-      full: 2
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      formInner: true
-    }, /*#__PURE__*/_react.default.createElement(_Grid.Row, null, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 1,
-      full: 2
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      fluid: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "phonePrefix",
-      validation: () => (0, _Form.validate)('phonePrefix', formik)
-    }, _ref4 => {
-      let {
-        field
-      } = _ref4;
-      return /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_Select.default, {
-        options: [{
-          key: 1,
-          value: '+01',
-          label: '+01'
-        }, {
-          key: 2,
-          value: '+02',
-          label: '+02'
-        }, {
-          key: 3,
-          value: '+03',
-          label: '+03'
-        }, {
-          key: 4,
-          value: '+04',
-          label: '+04'
-        }, {
-          key: 5,
-          value: '+05',
-          label: '+05'
-        }, {
-          key: 6,
-          value: '+06',
-          label: '+06'
-        }],
-        label: "Prefix",
-        id: field.name,
-        name: field.name,
-        value: field.value,
-        error: !!errors[field.name],
-        touched: !!touched[field.name],
-        onChange: handleChangeSelect,
-        onBlur: handleBlurSelect
-      }), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
-        show: touched[field.name] && errors[field.name]
-      }, errors[field.name]));
-    }))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 1,
-      full: 2
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      fluid: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "phone",
-      validation: () => (0, _Form.validate)('phone', formik)
-    }, _ref5 => {
-      let {
-        field
-      } = _ref5;
-      return /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_Input.default, _extends({
-        label: "Mobile phone",
-        id: field.name,
-        error: !!errors[field.name],
-        touched: !!touched[field.name]
-      }, field)), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
-        show: touched[field.name] && errors[field.name]
-      }, errors[field.name]));
-    }))))))), /*#__PURE__*/_react.default.createElement(_Grid.Row, null, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 1,
-      full: 2
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      formInner: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      fluid: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "country",
-      validation: () => (0, _Form.validate)('country', formik)
-    }, _ref6 => {
-      let {
-        field
-      } = _ref6;
-      return /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_Select.default, {
-        options: _countriesList.default.map(_ref7 => {
-          let {
-            name
-          } = _ref7;
-          return {
-            key: name,
-            value: name,
-            label: name
-          };
-        }),
-        label: "Country",
-        id: field.name,
-        name: field.name,
-        value: field.value,
-        error: !!errors[field.name],
-        touched: !!touched[field.name],
-        onChange: handleChangeSelect,
-        onBlur: handleBlurSelect,
-        search: true
-      }), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
-        show: touched[field.name] && errors[field.name]
-      }, errors[field.name]));
-    })))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 1,
-      full: 2
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      formInner: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      fluid: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "postalCode",
-      validation: () => (0, _Form.validate)('postalCode', formik)
-    }, _ref8 => {
-      let {
-        field
-      } = _ref8;
-      return /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_Input.default, _extends({
-        label: "Postal Code",
-        id: field.name,
-        error: !!errors[field.name],
-        touched: !!touched[field.name]
-      }, field)), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
-        show: touched[field.name] && errors[field.name]
-      }, errors[field.name]));
-    }))))), /*#__PURE__*/_react.default.createElement(_Grid.Row, null, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 1,
-      full: 2
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      formInner: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      fluid: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "city",
-      validation: () => (0, _Form.validate)('city', formik)
-    }, _ref9 => {
-      let {
-        field
-      } = _ref9;
-      return /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_Input.default, _extends({
-        label: "City",
-        id: field.name,
-        error: !!errors[field.name],
-        touched: !!touched[field.name]
-      }, field)), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
-        show: touched[field.name] && errors[field.name]
-      }, errors[field.name]));
-    })))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 1,
-      full: 2
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      formInner: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      fluid: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "street",
-      validation: () => (0, _Form.validate)('street', formik)
-    }, _ref0 => {
-      let {
-        field
-      } = _ref0;
-      return /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_Input.default, _extends({
-        label: "Street",
-        id: field.name,
-        error: !!errors[field.name],
-        touched: !!touched[field.name]
-      }, field)), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
-        show: touched[field.name] && errors[field.name]
-      }, errors[field.name]));
-    }))))), /*#__PURE__*/_react.default.createElement(_Grid.Row, null, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 1,
-      full: 2
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      formInner: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      fluid: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "occupation",
-      validation: () => (0, _Form.validate)('occupation', formik)
-    }, _ref1 => {
-      let {
-        field
-      } = _ref1;
-      return /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_Select.default, {
-        options: [{
-          key: 1,
-          value: 'student',
-          label: 'Student'
-        }, {
-          key: 2,
-          value: 'worker',
-          label: 'Worker'
-        }, {
-          key: 3,
-          value: 'other',
-          label: 'Other, precise:'
-        }],
-        label: "Occupation",
-        id: field.name,
-        name: field.name,
-        value: field.value,
-        error: !!errors[field.name],
-        touched: !!touched[field.name],
-        onChange: handleChangeSelect,
-        onBlur: handleBlurSelect
-      }), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
-        show: touched[field.name] && errors[field.name]
-      }, errors[field.name]));
-    })))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-      part: 1,
-      full: 2
-    }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-      formInner: true
-    }, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
-      noPaddingTop: true,
-      noPaddingHorizontal: true,
-      fluid: true
-    }, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "occupationDetails",
-      validation: () => (0, _Form.validate)('occupationDetails', formik)
-    }, _ref10 => {
-      let {
-        field
-      } = _ref10;
-      return /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_Input.default, _extends({
-        label: "",
-        id: field.name,
-        error: !!errors[field.name],
-        touched: !!touched[field.name]
-      }, field)), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
-        show: touched[field.name] && errors[field.name]
-      }, errors[field.name]));
-    }))))), /*#__PURE__*/_react.default.createElement(_styles.FormBottomRow, null, /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_formik.Field, {
-      name: "dataConfirmation",
-      validate: () => (0, _Form.validate)('dataConfirmation', formik)
-    }, _ref11 => {
-      let {
-        field
-      } = _ref11;
-      return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_Checkbox.default, _extends({
-        id: "data-confirmation",
-        text: "I confirm that all information is correct",
-        checked: field.value,
-        error: !!errors[field.name]
-      }, field, {
-        value: "yes"
-      })), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
-        show: errors[field.name]
-      }, errors[field.name]));
-    })), /*#__PURE__*/_react.default.createElement(_styles.FormBottomButtonWrap, null, /*#__PURE__*/_react.default.createElement(_reactTippy.Tooltip, {
-      open: popupOpen,
-      position: "bottom",
-      title: "Please fill all required fields",
-      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('kycConfirmation', 5, 3),
-      disabled: hasErrors
-    }, "Continue")))))));
-  }
-}
-BasicInfo.propTypes = {
-  changeStep: _propTypes.default.func.isRequired,
-  setPrevStep: _propTypes.default.func.isRequired,
-  formik: _propTypes.default.instanceOf(Object).isRequired
-};
-var _default = exports.default = (0, _formik.connect)(BasicInfo);

package/dist/components/KYCFlow/Confirmation.js

@@ -1,46 +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 _Button = _interopRequireDefault(require("../Button/Button.styles"));
-var _Grid = require("../Grid/Grid.styles");
-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 Confirmation = _ref => {
-  let {
-    changeStep,
-    setPrevStep,
-    formik
-  } = _ref;
-  (0, _react.useEffect)(() => {
-    setPrevStep('kycBasicInfo', 3);
-  }, []);
-  return /*#__PURE__*/_react.default.createElement(_styles.Wrapper, null, /*#__PURE__*/_react.default.createElement(_styles.Header, null, /*#__PURE__*/_react.default.createElement(_styles.HeaderTitle, null, "Confirmation"), /*#__PURE__*/_react.default.createElement(_styles.HeaderButtonWrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    secondary: true,
-    onClick: () => changeStep('kycBasicInfo', 3)
-  }, "Previous"), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    onClick: () => formik.submitForm()
-  }, "Confirm"))), /*#__PURE__*/_react.default.createElement(_styles.Body, null, /*#__PURE__*/_react.default.createElement(_Grid.Row, {
-    stretch: true
-  }, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-    part: 4
-  }), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-    part: 8
-  }, /*#__PURE__*/_react.default.createElement(_styles.ColumnInner, {
-    verticalPadding: true
-  }, /*#__PURE__*/_react.default.createElement(_styles.BodyTitle, null, "THANK YOU FOR REGISTERING"))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
-    part: 4
-  }))));
-};
-Confirmation.propTypes = {
-  changeStep: _propTypes.default.func.isRequired,
-  setPrevStep: _propTypes.default.func.isRequired,
-  formik: _propTypes.default.instanceOf(Object).isRequired
-};
-var _default = exports.default = (0, _formik.connect)(Confirmation);