@authing/react-ui-components 3.0.1-beta.4 → 3.0.1-rc.3

package/lib/MFA/VerifyCodeInput/VerifyCodeFormItem.js

@@ -1,53 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.VerifyCodeFormItem = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
-var _form = _interopRequireDefault(require("antd/lib/form"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _reactI18next = require("react-i18next");
-
-var _excluded = ["codeLength", "ruleKeyword"];
-
-var VerifyCodeFormItem = function VerifyCodeFormItem(props) {
-  var _useTranslation = (0, _reactI18next.useTranslation)(),
-      t = _useTranslation.t;
-
-  var codeLength = props.codeLength,
-      _props$ruleKeyword = props.ruleKeyword,
-      ruleKeyword = _props$ruleKeyword === void 0 ? t('common.captchaCode') : _props$ruleKeyword,
-      formItemProps = (0, _objectWithoutProperties2.default)(props, _excluded);
-  return /*#__PURE__*/_react.default.createElement(_form.default.Item, (0, _extends2.default)({
-    validateTrigger: ['onChange'],
-    name: "mfaCode",
-    className: "g2-mfa-totp-verify-input",
-    validateFirst: true,
-    rules: [{
-      type: 'array',
-      validateTrigger: ['onChange'],
-      message: t('common.isMissing', {
-        name: ruleKeyword
-      }),
-      required: true
-    }, {
-      type: 'array',
-      validateTrigger: [''],
-      message: t('common.fullCaptchaCode', {
-        name: ruleKeyword
-      }),
-      min: codeLength
-    }]
-  }, formItemProps));
-};
-
-exports.VerifyCodeFormItem = VerifyCodeFormItem;

package/lib/MFA/VerifyCodeInput/index.d.ts

@@ -1,13 +0,0 @@
-import React, { FC } from 'react';
-interface VerifyCodeInputProps extends React.HTMLAttributes<HTMLDivElement> {
-    length?: number;
-    size?: string;
-    gutter?: string;
-    onEenter?: Function;
-    showDivider?: boolean;
-    onChange?: any;
-    value?: Array<number | string>;
-    onFinish?: any;
-}
-export declare const VerifyCodeInput: FC<VerifyCodeInputProps>;
-export {};

package/lib/MFA/VerifyCodeInput/index.js

@@ -1,181 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.VerifyCodeInput = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
-var _antd = require("antd");
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _InputNumber = require("../../InputNumber");
-
-var _excluded = ["length", "size", "gutter", "className", "onEenter", "showDivider", "onChange", "value", "onFinish"];
-
-var VerifyCodeInput = function VerifyCodeInput(_ref) {
-  var _ref$length = _ref.length,
-      length = _ref$length === void 0 ? 4 : _ref$length,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? '46px' : _ref$size,
-      _ref$gutter = _ref.gutter,
-      gutter = _ref$gutter === void 0 ? length > 4 ? '14px' : '24px' : _ref$gutter,
-      className = _ref.className,
-      onEenter = _ref.onEenter,
-      showDivider = _ref.showDivider,
-      onChangeProps = _ref.onChange,
-      value = _ref.value,
-      onFinish = _ref.onFinish,
-      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var inputRef = (0, _react.useRef)([]);
-  var codeInputRef = (0, _react.useRef)(null);
-
-  var _useState = (0, _react.useState)(value !== null && value !== void 0 ? value : []),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      verifyCode = _useState2[0],
-      setVerifyCode = _useState2[1];
-
-  var onChange = (0, _react.useCallback)(function (codes) {
-    var filteredCodes = codes.filter(function (code) {
-      return !!code;
-    });
-    setVerifyCode(filteredCodes);
-    onChangeProps === null || onChangeProps === void 0 ? void 0 : onChangeProps(filteredCodes);
-  }, [onChangeProps]);
-  var handleChange = (0, _react.useCallback)(function () {
-    var val = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-    var index = arguments.length > 1 ? arguments[1] : undefined;
-    var num = parseInt(val);
-
-    if (isNaN(num)) {
-      val = '';
-    } else {
-      val = String(num);
-    }
-
-    var codes = (0, _toConsumableArray2.default)(verifyCode);
-    codes[index] = val.split('').slice(-1)[0] || '';
-    onChange(codes);
-
-    if (!!val && inputRef.current[index + 1]) {
-      inputRef.current[index + 1].focus();
-    } // 输入完验证码 直接 finish 提交
-
-
-    if (codes.filter(function (code) {
-      return code;
-    }).length >= length) {
-      onFinish === null || onFinish === void 0 ? void 0 : onFinish();
-    }
-  }, [verifyCode, onChange, length, onFinish]);
-
-  var handleKeyDown = function handleKeyDown(evt, index) {
-    var currentVal = verifyCode[index];
-
-    switch (evt.key) {
-      case 'Backspace':
-        if (!currentVal && inputRef.current[index - 1]) {
-          handleChange('', index - 1);
-          inputRef.current[index - 1].focus();
-        }
-
-        break;
-
-      case 'Enter':
-        onEenter === null || onEenter === void 0 ? void 0 : onEenter();
-        break;
-
-      default:
-        break;
-    }
-  };
-
-  (0, _react.useEffect)(function () {
-    var el = codeInputRef.current;
-
-    var pasteEvent = function pasteEvent(e) {
-      var _e$clipboardData;
-
-      e.preventDefault();
-      e.stopPropagation();
-      var paste = (_e$clipboardData = e.clipboardData) === null || _e$clipboardData === void 0 ? void 0 : _e$clipboardData.getData('text');
-
-      if (paste && !isNaN(parseInt(paste))) {
-        if (paste.length < length) {
-          var data = verifyCode.map(function (_i, index) {
-            var _paste$index;
-
-            return (_paste$index = paste === null || paste === void 0 ? void 0 : paste[index]) !== null && _paste$index !== void 0 ? _paste$index : '';
-          });
-          onChange(data);
-          inputRef.current[paste.length].focus();
-        } else {
-          var _data = paste.slice(0, length).split('');
-
-          onChange(_data);
-          inputRef.current[length - 1].focus();
-        }
-      }
-    };
-
-    el === null || el === void 0 ? void 0 : el.addEventListener('paste', pasteEvent);
-    return function () {
-      el === null || el === void 0 ? void 0 : el.removeEventListener('paste', pasteEvent);
-    };
-  }, [length, onChange, setVerifyCode, verifyCode]);
-  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
-    ref: codeInputRef,
-    className: "authing-g2-code-input"
-  }, rest), new Array(length).fill(0).map(function (_, index) {
-    return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
-      key: index
-    }, /*#__PURE__*/_react.default.createElement(_InputNumber.InputNumber, {
-      ref: function ref(el) {
-        return inputRef.current[index] = el;
-      },
-      style: {
-        width: size,
-        minWidth: size,
-        minHeight: size,
-        height: size,
-        lineHeight: size,
-        marginLeft: index === 0 ? 0 : gutter
-      },
-      className: "authing-g2-code-input-item",
-      size: "large",
-      autoFocus: index === 0,
-      onKeyDown: function onKeyDown(evt) {
-        return handleKeyDown(evt, index);
-      },
-      value: verifyCode[index],
-      maxLength: 1,
-      onChange: function onChange(evt) {
-        evt.persist(); // @ts-ignore
-
-        if (evt.nativeEvent.isComposing) {
-          return;
-        }
-
-        handleChange(evt.target.value, index);
-      },
-      pattern: "[0-9]*",
-      type: "tel"
-    }), showDivider && index === Math.floor(length / 2 - 1) && /*#__PURE__*/_react.default.createElement(_antd.Divider, {
-      className: "authing-g2-code-input-divider"
-    }));
-  }));
-};
-
-exports.VerifyCodeInput = VerifyCodeInput;

package/lib/MFA/codemap.d.ts

@@ -1,2 +0,0 @@
-import { GuardModuleAction } from '../Guard/module';
-export declare const codeMap: Record<number, GuardModuleAction>;

package/lib/MFA/codemap.js

@@ -1,35 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.codeMap = void 0;
-
-var _module = require("../Guard/module");
-
-var codeMap = {
-  // 待添加
-  2021: {
-    action: 'changeModule',
-    module: _module.GuardModuleType.LOGIN
-  },
-  1700: {
-    action: 'insideFix',
-    message: 'verification failed, let components inside fix is fine.'
-  },
-  1701: {
-    action: 'insideFix',
-    message: 'verification failed, let components inside fix is fine.'
-  },
-  1702: {
-    action: 'insideFix',
-    message: 'verification failed, let components inside fix is fine.'
-  },
-  500: {
-    action: 'message'
-  },
-  6001: {
-    action: 'message'
-  }
-};
-exports.codeMap = codeMap;

package/lib/MFA/core/email.d.ts

@@ -1,23 +0,0 @@
-import React from 'react';
-import { MFAConfig } from '../interface';
-interface BindMFAEmailProps {
-    mfaToken: string;
-    onBind: (email: string) => void;
-    config: any;
-}
-export declare const BindMFAEmail: React.FC<BindMFAEmailProps>;
-interface VerifyMFAEmailProps {
-    email: string;
-    mfaToken: string;
-    onVerify: (code: number, data: any) => void;
-    sendCodeRef: React.RefObject<HTMLButtonElement>;
-    codeLength: number;
-}
-export declare const VerifyMFAEmail: React.FC<VerifyMFAEmailProps>;
-export declare const MFAEmail: React.FC<{
-    mfaToken: string;
-    email?: string;
-    mfaLogin: any;
-    config: MFAConfig;
-}>;
-export {};

package/lib/MFA/core/email.js

@@ -1,328 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.VerifyMFAEmail = exports.MFAEmail = exports.BindMFAEmail = void 0;
-
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _antd = require("antd");
-
-var _authingJsSdk = require("authing-js-sdk");
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _reactI18next = require("react-i18next");
-
-var _VerifyCodeInput = require("../VerifyCodeInput");
-
-var _authClient = require("../../Guard/authClient");
-
-var _SendCodeBtn = require("../../SendCode/SendCodeBtn");
-
-var _SubmitButton = _interopRequireDefault(require("../../SubmitButton"));
-
-var _ValidatorRules = _interopRequireDefault(require("../../ValidatorRules"));
-
-var _VerifyCodeFormItem = require("../VerifyCodeInput/VerifyCodeFormItem");
-
-var _IconFont = require("../../IconFont");
-
-var _utils = require("../../_utils");
-
-var BindMFAEmail = function BindMFAEmail(_ref) {
-  var mfaToken = _ref.mfaToken,
-      onBind = _ref.onBind,
-      config = _ref.config;
-  var submitButtonRef = (0, _react.useRef)(null);
-
-  var _useTranslation = (0, _reactI18next.useTranslation)(),
-      t = _useTranslation.t;
-
-  var _Form$useForm = _antd.Form.useForm(),
-      _Form$useForm2 = (0, _slicedToArray2.default)(_Form$useForm, 1),
-      form = _Form$useForm2[0];
-
-  var ref = (0, _react.useRef)(null);
-
-  var onFinish = /*#__PURE__*/function () {
-    var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(_ref2) {
-      var _submitButtonRef$curr;
-
-      var email, error, _submitButtonRef$curr2;
-
-      return _regenerator.default.wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              email = _ref2.email;
-              (_submitButtonRef$curr = submitButtonRef.current) === null || _submitButtonRef$curr === void 0 ? void 0 : _submitButtonRef$curr.onSpin(true);
-              _context.next = 4;
-              return form.validateFields();
-
-            case 4:
-              try {
-                onBind(email);
-              } catch (e) {
-                error = JSON.parse(e === null || e === void 0 ? void 0 : e.message);
-                submitButtonRef.current.onError();
-
-                _antd.message.error(error.message);
-              } finally {
-                (_submitButtonRef$curr2 = submitButtonRef.current) === null || _submitButtonRef$curr2 === void 0 ? void 0 : _submitButtonRef$curr2.onSpin(false);
-              }
-
-            case 5:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee);
-    }));
-
-    return function onFinish(_x) {
-      return _ref3.apply(this, arguments);
-    };
-  }();
-
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", {
-    className: "authing-g2-mfa-title"
-  }, t('common.bindEmail')), /*#__PURE__*/_react.default.createElement("p", {
-    className: "authing-g2-mfa-tips"
-  }, t('common.bindEmailDoc')), /*#__PURE__*/_react.default.createElement(_antd.Form, {
-    form: form,
-    onFinish: onFinish,
-    onFinishFailed: function onFinishFailed() {
-      return submitButtonRef.current.onError();
-    },
-    onValuesChange: function onValuesChange(value) {
-      var _ref$current;
-
-      (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.check(value);
-    }
-  }, /*#__PURE__*/_react.default.createElement(_ValidatorRules.default.Email, {
-    className: "authing-g2-input-form",
-    name: "email",
-    form: form,
-    ref: ref,
-    checkRepeat: true,
-    required: true
-  }, /*#__PURE__*/_react.default.createElement(_antd.Input, {
-    className: "authing-g2-input",
-    autoComplete: "email",
-    size: "large",
-    placeholder: t('login.inputEmail'),
-    prefix: /*#__PURE__*/_react.default.createElement(_IconFont.IconFont, {
-      type: "authing-a-mail-line3",
-      style: {
-        color: '#878A95'
-      }
-    })
-  })), /*#__PURE__*/_react.default.createElement(_SubmitButton.default, {
-    text: t('common.sure'),
-    ref: submitButtonRef
-  })));
-};
-
-exports.BindMFAEmail = BindMFAEmail;
-
-var VerifyMFAEmail = function VerifyMFAEmail(_ref4) {
-  var email = _ref4.email,
-      mfaToken = _ref4.mfaToken,
-      onVerify = _ref4.onVerify,
-      sendCodeRef = _ref4.sendCodeRef,
-      codeLength = _ref4.codeLength;
-  var authClient = (0, _authClient.useGuardAuthClient)();
-  var submitButtonRef = (0, _react.useRef)(null);
-
-  var _useTranslation2 = (0, _reactI18next.useTranslation)(),
-      t = _useTranslation2.t;
-
-  var _Form$useForm3 = _antd.Form.useForm(),
-      _Form$useForm4 = (0, _slicedToArray2.default)(_Form$useForm3, 1),
-      form = _Form$useForm4[0];
-
-  var _useState = (0, _react.useState)(false),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      sent = _useState2[0],
-      setSent = _useState2[1];
-
-  var sendVerifyCode = /*#__PURE__*/function () {
-    var _ref5 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
-      var errorMessage;
-      return _regenerator.default.wrap(function _callee2$(_context2) {
-        while (1) {
-          switch (_context2.prev = _context2.next) {
-            case 0:
-              _context2.prev = 0;
-              _context2.next = 3;
-              return authClient.sendEmail(email, _authingJsSdk.EmailScene.MfaVerify);
-
-            case 3:
-              setSent(true);
-              return _context2.abrupt("return", true);
-
-            case 7:
-              _context2.prev = 7;
-              _context2.t0 = _context2["catch"](0);
-
-              if (!(_context2.t0.code === 'ECONNABORTED')) {
-                _context2.next = 12;
-                break;
-              }
-
-              _antd.message.error(t('login.sendCodeTimeout'));
-
-              return _context2.abrupt("return", false);
-
-            case 12:
-              errorMessage = JSON.parse(_context2.t0.message);
-
-              _antd.message.error(errorMessage.message);
-
-              return _context2.abrupt("return", false);
-
-            case 15:
-            case "end":
-              return _context2.stop();
-          }
-        }
-      }, _callee2, null, [[0, 7]]);
-    }));
-
-    return function sendVerifyCode() {
-      return _ref5.apply(this, arguments);
-    };
-  }();
-
-  var onFinish = /*#__PURE__*/function () {
-    var _ref6 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(values) {
-      var _submitButtonRef$curr3;
-
-      var mfaCode, user, _submitButtonRef$curr4, error, _submitButtonRef$curr5;
-
-      return _regenerator.default.wrap(function _callee3$(_context3) {
-        while (1) {
-          switch (_context3.prev = _context3.next) {
-            case 0:
-              (_submitButtonRef$curr3 = submitButtonRef.current) === null || _submitButtonRef$curr3 === void 0 ? void 0 : _submitButtonRef$curr3.onSpin(true);
-              mfaCode = form.getFieldValue('mfaCode');
-              _context3.prev = 2;
-              _context3.next = 5;
-              return authClient.mfa.verifyAppEmailMfa({
-                mfaToken: mfaToken,
-                email: email,
-                code: mfaCode.join('')
-              });
-
-            case 5:
-              user = _context3.sent;
-              onVerify(200, user);
-              _context3.next = 14;
-              break;
-
-            case 9:
-              _context3.prev = 9;
-              _context3.t0 = _context3["catch"](2);
-              error = JSON.parse(_context3.t0 === null || _context3.t0 === void 0 ? void 0 : _context3.t0.message);
-              (_submitButtonRef$curr4 = submitButtonRef.current) === null || _submitButtonRef$curr4 === void 0 ? void 0 : _submitButtonRef$curr4.onError();
-              onVerify(error.code, error);
-
-            case 14:
-              _context3.prev = 14;
-              (_submitButtonRef$curr5 = submitButtonRef.current) === null || _submitButtonRef$curr5 === void 0 ? void 0 : _submitButtonRef$curr5.onSpin(false);
-              return _context3.finish(14);
-
-            case 17:
-            case "end":
-              return _context3.stop();
-          }
-        }
-      }, _callee3, null, [[2, 9, 14, 17]]);
-    }));
-
-    return function onFinish(_x2) {
-      return _ref6.apply(this, arguments);
-    };
-  }();
-
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", {
-    className: "authing-g2-mfa-title"
-  }, t('login.inputEmailCode')), /*#__PURE__*/_react.default.createElement("p", {
-    className: "authing-g2-mfa-tips"
-  }, sent ? "".concat(t('login.verifyCodeSended'), " ").concat((0, _utils.mailDesensitization)(email)) : ''), /*#__PURE__*/_react.default.createElement(_antd.Form, {
-    form: form,
-    onFinish: onFinish,
-    onFinishFailed: function onFinishFailed() {
-      var _submitButtonRef$curr6;
-
-      return (_submitButtonRef$curr6 = submitButtonRef.current) === null || _submitButtonRef$curr6 === void 0 ? void 0 : _submitButtonRef$curr6.onError();
-    }
-  }, /*#__PURE__*/_react.default.createElement(_VerifyCodeFormItem.VerifyCodeFormItem, {
-    codeLength: codeLength,
-    ruleKeyword: t('common.captchaCode')
-  }, /*#__PURE__*/_react.default.createElement(_VerifyCodeInput.VerifyCodeInput, {
-    length: codeLength,
-    onFinish: onFinish
-  })), /*#__PURE__*/_react.default.createElement(_SendCodeBtn.SendCodeBtn, {
-    btnRef: sendCodeRef,
-    setSent: setSent,
-    beforeSend: function beforeSend() {
-      return sendVerifyCode();
-    },
-    type: "link"
-  }), /*#__PURE__*/_react.default.createElement(_SubmitButton.default, {
-    text: t('common.sure'),
-    ref: submitButtonRef,
-    className: "g2-mfa-submit-button"
-  })));
-};
-
-exports.VerifyMFAEmail = VerifyMFAEmail;
-
-var MFAEmail = function MFAEmail(_ref7) {
-  var _config$__publicConfi;
-
-  var userEmail = _ref7.email,
-      mfaToken = _ref7.mfaToken,
-      mfaLogin = _ref7.mfaLogin,
-      config = _ref7.config;
-
-  var _useState3 = (0, _react.useState)(userEmail),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      email = _useState4[0],
-      setEmail = _useState4[1];
-
-  var sendCodeRef = (0, _react.useRef)(null);
-  var codeLength = (_config$__publicConfi = config.__publicConfig__) === null || _config$__publicConfi === void 0 ? void 0 : _config$__publicConfi.verifyCodeLength;
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, email ? /*#__PURE__*/_react.default.createElement(VerifyMFAEmail, {
-    mfaToken: mfaToken,
-    email: email,
-    onVerify: function onVerify(code, data) {
-      mfaLogin(code, data);
-    },
-    sendCodeRef: sendCodeRef,
-    codeLength: codeLength !== null && codeLength !== void 0 ? codeLength : 4
-  }) : /*#__PURE__*/_react.default.createElement(BindMFAEmail, {
-    config: config,
-    mfaToken: mfaToken,
-    onBind: function onBind(email) {
-      var _sendCodeRef$current;
-
-      console.log('email', email);
-      setEmail(email);
-      (_sendCodeRef$current = sendCodeRef.current) === null || _sendCodeRef$current === void 0 ? void 0 : _sendCodeRef$current.click();
-    }
-  }));
-};
-
-exports.MFAEmail = MFAEmail;

package/lib/MFA/core/face.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const MFAFace: (props: any) => JSX.Element;