@authing/react-ui-components 3.0.1-beta.1 → 3.0.1-beta.2

package/lib/AuthingGuard/Forms/RegisterFormFooter/index.js

@@ -13,7 +13,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _context = require("../../../context/global/context");
 
-var _types = require("../../../../components/AuthingGuard/types");
+var _types = require("../../types");
 
 var _reactI18next = require("react-i18next");
 

package/lib/AuthingGuard/Forms/ResetPwdForm/Footer.js

@@ -13,7 +13,7 @@ var _antd = require("antd");
 
 var _context = require("../../../context/global/context");
 
-var _types = require("../../../../components/AuthingGuard/types");
+var _types = require("../../types");
 
 var _reactI18next = require("react-i18next");
 

package/lib/AuthingGuard/Forms/ResetPwdForm/Step1.d.ts

@@ -1,3 +1,3 @@
 import { FC } from 'react';
-import { ResetPasswordStep1Props } from '../../../../components/AuthingGuard/types';
+import { ResetPasswordStep1Props } from '../../types';
 export declare const ResetPasswordStep1: FC<ResetPasswordStep1Props>;

package/lib/AuthingGuard/Forms/ResetPwdForm/Step1.js

@@ -21,7 +21,7 @@ var _antd = require("antd");
 
 var _utils = require("../../../_utils");
 
-var _types = require("../../../../components/AuthingGuard/types");
+var _types = require("../../types");
 
 var _context2 = require("../../../context/global/context");
 

package/lib/AuthingGuard/Forms/ResetPwdForm/Step2.d.ts

@@ -1,3 +1,3 @@
 import { FC } from 'react';
-import { ResetPasswordStep2Props } from '../../../../components/AuthingGuard/types';
+import { ResetPasswordStep2Props } from '../../types';
 export declare const ResetPasswordStep2: FC<ResetPasswordStep2Props>;

package/lib/AuthingGuard/Forms/ResetPwdForm/Step2.js

@@ -25,7 +25,7 @@ var _utils = require("../../../_utils");
 
 var _context3 = require("../../../context/global/context");
 
-var _SendPhoneCode = require("../../../../components/AuthingGuard/Forms/SendPhoneCode");
+var _SendPhoneCode = require("../SendPhoneCode");
 
 var _reactI18next = require("react-i18next");
 

package/lib/AuthingGuard/Forms/ResetPwdForm/Step3.d.ts

@@ -1,3 +1,3 @@
 import { FC } from 'react';
-import { ResetPasswordStep3Props } from '../../../../components/AuthingGuard/types';
+import { ResetPasswordStep3Props } from '../../types';
 export declare const ResetPasswordStep3: FC<ResetPasswordStep3Props>;

package/lib/AuthingGuard/Forms/ResetPwdForm/Step4.js

@@ -15,7 +15,7 @@ var _context = require("../../../context/global/context");
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _types = require("../../../../components/AuthingGuard/types");
+var _types = require("../../types");
 
 var _reactI18next = require("react-i18next");
 

package/lib/AuthingGuard/Forms/ResetPwdForm/index.d.ts

@@ -1,3 +1,3 @@
 import { FC } from 'react';
-import { ResetPasswordFormProps } from '../../../../components/AuthingGuard/types';
+import { ResetPasswordFormProps } from '../../types';
 export declare const ResetPasswordForm: FC<ResetPasswordFormProps>;

package/lib/AuthingGuard/Forms/SmsMfaVerifyForm/VerifyCodeForm.d.ts

@@ -1,3 +1,3 @@
 import { FC } from 'react';
-import { SmsMFAVerifyFormProps } from '../../../../components/AuthingGuard/types';
+import { SmsMFAVerifyFormProps } from '../../types';
 export declare const VerifyCodeForm: FC<SmsMFAVerifyFormProps>;

package/lib/AuthingGuard/Forms/SocialAndIdpLogin/index.d.ts

@@ -1,3 +1,3 @@
 import { FC } from 'react';
-import { SocialAndIdpLoginProps } from '../../../../components/AuthingGuard/types';
+import { SocialAndIdpLoginProps } from '../../types';
 export declare const SocialAndIdpLogin: FC<SocialAndIdpLoginProps>;

package/lib/AuthingGuard/Forms/SocialAndIdpLogin/index.js

@@ -27,9 +27,9 @@ var _utils = require("../../../_utils");
 
 var _context6 = require("../../../context/global/context");
 
-var _constants = require("../../../../components/AuthingGuard/constants");
+var _constants = require("../../constants");
 
-var _types = require("../../../../components/AuthingGuard/types");
+var _types = require("../../types");
 
 var _http = require("../../../_utils/http");
 

package/lib/AuthingGuard/GuardLayout/index.d.ts

@@ -1,5 +1,5 @@
 import React, { FC } from 'react';
-import { UserConfig, Lang } from '../../../components/AuthingGuard/types';
+import { UserConfig, Lang } from '../types';
 export declare const GuardLayout: FC<{
     visible?: boolean;
     className?: string;

package/lib/AuthingGuard/GuardLayout/index.js

@@ -23,21 +23,21 @@ var _utils = require("../../_utils");
 
 var _context = require("../../context/global/context");
 
-var _Header = require("../../../components/AuthingGuard/Header");
+var _Header = require("../Header");
 
-var _MfaLayout = require("../../../components/AuthingGuard/MfaLayout");
+var _MfaLayout = require("../MfaLayout");
 
-var _LoginLayout = require("../../../components/AuthingGuard/LoginLayout");
+var _LoginLayout = require("../LoginLayout");
 
-var _constants = require("../../../components/AuthingGuard/constants");
+var _constants = require("../constants");
 
-var _RegisterLayout = require("../../../components/AuthingGuard/RegisterLayout");
+var _RegisterLayout = require("../RegisterLayout");
 
-var _ResetPwdLayout = require("../../../components/AuthingGuard/ResetPwdLayout");
+var _ResetPwdLayout = require("../ResetPwdLayout");
 
-var _api = require("../../../components/AuthingGuard/api");
+var _api = require("../api");
 
-var _types = require("../../../components/AuthingGuard/types");
+var _types = require("../types");
 
 var _CompleteUserInfoLayout = require("../CompleteUserInfoLayout");
 

package/lib/AuthingGuard/LoginLayout/index.js

@@ -21,13 +21,13 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _context = require("../../context/global/context");
 
-var _Forms = require("../../../components/AuthingGuard/Forms");
+var _Forms = require("../Forms");
 
-var _constants = require("../../../components/AuthingGuard/constants");
+var _constants = require("../constants");
 
 var _AuthingTabs = require("../../AuthingTabs");
 
-var _types = require("../../../components/AuthingGuard/types");
+var _types = require("../types");
 
 var _reactI18next = require("react-i18next");
 

package/lib/AuthingGuard/MfaLayout/index.js

@@ -21,7 +21,7 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _Steps = require("./Steps");
 
-var _Forms = require("../../../components/AuthingGuard/Forms");
+var _Forms = require("../Forms");
 
 var _context = require("../../context/global/context");
 

package/lib/AuthingGuard/RegisterLayout/index.js

@@ -15,13 +15,13 @@ var _react = _interopRequireDefault(require("react"));
 
 var _context = require("../../context/global/context");
 
-var _types = require("../../../components/AuthingGuard/types");
+var _types = require("../types");
 
 var _AuthingTabs = require("../../AuthingTabs");
 
-var _constants = require("../../../components/AuthingGuard/constants");
+var _constants = require("../constants");
 
-var _Forms = require("../../../components/AuthingGuard/Forms");
+var _Forms = require("../Forms");
 
 var _reactI18next = require("react-i18next");
 

package/lib/AuthingGuard/ResetPwdLayout/index.js

@@ -11,7 +11,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _context = require("../../context/global/context");
 
-var _Forms = require("../../../components/AuthingGuard/Forms");
+var _Forms = require("../Forms");
 
 var ResetPwdLayout = function ResetPwdLayout() {
   var _useGuardContext = (0, _context.useGuardContext)(),

package/lib/AuthingGuard/api/appConfig.d.ts

@@ -1,4 +1,4 @@
-import { Lang, LoginMethods, Protocol } from '../../../components/AuthingGuard/types';
+import { Lang, LoginMethods, Protocol } from '../types';
 import { IAzureAdConnectionConfig, ICasConnectionConfig, IOAuthConnectionConfig, ISamlConnectionConfig, OIDCConnectionConfig, SocialConnectionItem } from './userPoolConfig';
 import { PasswordStrength } from '../../_utils';
 export declare enum ApplicationMfaType {

package/lib/AuthingGuard/constants.d.ts

@@ -1,4 +1,4 @@
-import { UserConfig, LoginMethods, RegisterMethods, LocalesConfig } from '../../components/AuthingGuard/types';
+import { UserConfig, LoginMethods, RegisterMethods, LocalesConfig } from './types';
 export declare const OTP_MFA_CODE = 1635;
 export declare const APP_MFA_CODE = 1636;
 export declare const NEED_CAPTCHA = 2000;

package/lib/AuthingGuard/constants.js

@@ -9,7 +9,7 @@ exports.defaultLocalesConfig = exports.defaultHeaders = exports.defaultGuardConf
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-var _types = require("../../components/AuthingGuard/types");
+var _types = require("./types");
 
 var _locales = require("../_utils/locales");
 

package/lib/AuthingGuard/types/GuardConfig.d.ts

@@ -1,6 +1,6 @@
 import { AuthenticationClient, AuthenticationClientOptions, CommonMessage, SocialConnectionProvider, User } from 'authing-js-sdk';
 import { QrCodeAuthenticationClient } from 'authing-js-sdk/build/main/lib/authentication/QrCodeAuthenticationClient';
-import { SocialConnectionItem, EnterpriseConnectionItem, ApplicationConfig, PasswordLoginMethods, Agreement, QrcodeTabsSettings } from '../../../components/AuthingGuard/api';
+import { SocialConnectionItem, EnterpriseConnectionItem, ApplicationConfig, PasswordLoginMethods, Agreement, QrcodeTabsSettings } from '../api';
 import { Lang } from './Locales';
 export type { AuthenticationClient, CommonMessage, User } from 'authing-js-sdk';
 export declare enum GuardMode {

package/lib/index.css

@@ -36,187 +36,6 @@
   margin-left: 8px;
 }
 
-.authing-tabs {
-  display: flex;
-  margin-bottom: 36px;
-  align-items: center;
-}
-.authing-tabs-inner {
-  display: flex;
-  justify-content: space-around;
-  align-items: center;
-  flex: 1;
-}
-.authing-tabs-inner--more {
-  box-shadow: inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);
-}
-.authing-tab-item {
-  color: #aeb9d4;
-  font-size: 16px;
-  transition: all 0.3s ease-out;
-  white-space: nowrap;
-  cursor: pointer;
-  position: relative;
-  height: 28px;
-  margin-right: 32px;
-}
-.authing-tab-item:last-child {
-  margin-right: 12px;
-}
-.authing-tab-item:only-child {
-  margin-right: 0;
-}
-.authing-tab-item::after {
-  content: '';
-  width: 0;
-  height: 2px;
-  display: block;
-  position: absolute;
-  left: 50%;
-  bottom: -4px;
-  -webkit-transform: translateX(-50%);
-          transform: translateX(-50%);
-  background-color: transparent;
-  transition: all 0.3s ease-out;
-}
-.authing-tab-item__active {
-  color: #396aff;
-  font-size: 18px;
-}
-.authing-tab-item__active::after {
-  width: 26px;
-  background-color: #396aff;
-}
-.authing-tabs-show-more {
-  position: relative;
-  z-index: 2;
-}
-.authing-tabs-show-more.ant-btn {
-  padding: 0 12px;
-}
-.authing-tabs-show-more:hover,
-.authing-tabs-show-more:focus,
-.authing-tabs-show-more:active {
-  background-color: #fff;
-}
-.authing-tabs-show-more:hover .authing-tabs-more-panel {
-  height: auto;
-  opacity: 1;
-  padding: 4px 0;
-}
-.authing-tabs-show-more:after {
-  content: '';
-  display: block;
-  width: 100%;
-  height: 6px;
-  top: 100%;
-  left: 0;
-  position: absolute;
-}
-.authing-tabs-more-panel {
-  position: absolute;
-  box-sizing: border-box;
-  transition: all 0.3s;
-  height: 0;
-  opacity: 0;
-  right: 0;
-  top: 100%;
-  -webkit-transform: translateY(6px);
-          transform: translateY(6px);
-  background-color: #fff;
-  max-height: 200px;
-  margin: 0;
-  padding: 0;
-  overflow-x: hidden;
-  overflow-y: auto;
-  text-align: left;
-  list-style-type: none;
-  background-clip: padding-box;
-  border-radius: 2px;
-  outline: none;
-  box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
-}
-.authing-tabs-more-panel-item {
-  min-width: 120px;
-  margin: 0;
-  padding: 5px 12px;
-  overflow: hidden;
-  color: rgba(0, 0, 0, 0.85);
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 22px;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  cursor: pointer;
-  transition: all 0.3s;
-}
-.authing-tabs-more-panel-item:hover {
-  background-color: #f5f5f5;
-}
-@media only screen and (max-width: 719px) {
-  .authing-tabs-inner {
-    justify-content: flex-start;
-  }
-  .authing-tab-item {
-    margin-right: 40px;
-    font-size: 14px;
-  }
-  .authing-tab-item__active {
-    font-size: 16px;
-  }
-  .authing-tab-pane {
-    padding-bottom: 70px;
-  }
-}
-
-.g2-mfa-bindTotp {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  height: 100%;
-}
-.g2-mfa-bindTotp .g2-mfa-bindTotp-copySecret {
-  width: 100%;
-  height: 48px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  background: #f5f6f7;
-  border-radius: 4px;
-}
-.g2-mfa-bindTotp .g2-mfa-bindTotp-copySecret .authing-ant-typography {
-  margin: 0;
-}
-.g2-mfa-bindTotp .g2-mfa-bindTotp-copySecret .authing-ant-typography svg {
-  color: #878a95 !important;
-  margin-left: 30px;
-}
-.g2-mfa-bindTotp .g2-mfa-bindTotp-secretSave {
-  margin-top: 16px;
-}
-.g2-mfa-bindTotp .g2-mfa-submit-button {
-  margin-top: 80px !important;
-}
-.g2-mfa-bindTotp .g2-mfa-bindTotp-qrcode {
-  box-shadow: 0px 0px 30px rgba(84, 89, 104, 0.15);
-  border-radius: 4px;
-}
-.g2-mfa-bindTotp .g2-mfa-bindTotp-securityCode-form {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-.g2-mfa-bindTotp .g2-mfa-bindTotp-securityCode-form .g2-mfa-submit-button {
-  margin-top: 64px !important;
-}
-.g2-mfa-bindTotp .g2-mfa-bindTotp-securityCode-form .g2-mfa-totp-verify-input {
-  text-align: center;
-  margin-top: 40px !important;
-}
-.g2-mfa-bindTotp .g2-mfa-bindTotp-securityCode-form p {
-  color: #878a95;
-}
-
 .authing-toggle-mfa,
 .toggle-mfa-dropdown .authing-dropdown-icon {
   color: #999;
@@ -933,6 +752,187 @@
 }
 
 
+.authing-tabs {
+  display: flex;
+  margin-bottom: 36px;
+  align-items: center;
+}
+.authing-tabs-inner {
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  flex: 1;
+}
+.authing-tabs-inner--more {
+  box-shadow: inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);
+}
+.authing-tab-item {
+  color: #aeb9d4;
+  font-size: 16px;
+  transition: all 0.3s ease-out;
+  white-space: nowrap;
+  cursor: pointer;
+  position: relative;
+  height: 28px;
+  margin-right: 32px;
+}
+.authing-tab-item:last-child {
+  margin-right: 12px;
+}
+.authing-tab-item:only-child {
+  margin-right: 0;
+}
+.authing-tab-item::after {
+  content: '';
+  width: 0;
+  height: 2px;
+  display: block;
+  position: absolute;
+  left: 50%;
+  bottom: -4px;
+  -webkit-transform: translateX(-50%);
+          transform: translateX(-50%);
+  background-color: transparent;
+  transition: all 0.3s ease-out;
+}
+.authing-tab-item__active {
+  color: #396aff;
+  font-size: 18px;
+}
+.authing-tab-item__active::after {
+  width: 26px;
+  background-color: #396aff;
+}
+.authing-tabs-show-more {
+  position: relative;
+  z-index: 2;
+}
+.authing-tabs-show-more.ant-btn {
+  padding: 0 12px;
+}
+.authing-tabs-show-more:hover,
+.authing-tabs-show-more:focus,
+.authing-tabs-show-more:active {
+  background-color: #fff;
+}
+.authing-tabs-show-more:hover .authing-tabs-more-panel {
+  height: auto;
+  opacity: 1;
+  padding: 4px 0;
+}
+.authing-tabs-show-more:after {
+  content: '';
+  display: block;
+  width: 100%;
+  height: 6px;
+  top: 100%;
+  left: 0;
+  position: absolute;
+}
+.authing-tabs-more-panel {
+  position: absolute;
+  box-sizing: border-box;
+  transition: all 0.3s;
+  height: 0;
+  opacity: 0;
+  right: 0;
+  top: 100%;
+  -webkit-transform: translateY(6px);
+          transform: translateY(6px);
+  background-color: #fff;
+  max-height: 200px;
+  margin: 0;
+  padding: 0;
+  overflow-x: hidden;
+  overflow-y: auto;
+  text-align: left;
+  list-style-type: none;
+  background-clip: padding-box;
+  border-radius: 2px;
+  outline: none;
+  box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
+}
+.authing-tabs-more-panel-item {
+  min-width: 120px;
+  margin: 0;
+  padding: 5px 12px;
+  overflow: hidden;
+  color: rgba(0, 0, 0, 0.85);
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 22px;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  cursor: pointer;
+  transition: all 0.3s;
+}
+.authing-tabs-more-panel-item:hover {
+  background-color: #f5f5f5;
+}
+@media only screen and (max-width: 719px) {
+  .authing-tabs-inner {
+    justify-content: flex-start;
+  }
+  .authing-tab-item {
+    margin-right: 40px;
+    font-size: 14px;
+  }
+  .authing-tab-item__active {
+    font-size: 16px;
+  }
+  .authing-tab-pane {
+    padding-bottom: 70px;
+  }
+}
+
+.g2-mfa-bindTotp {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  height: 100%;
+}
+.g2-mfa-bindTotp .g2-mfa-bindTotp-copySecret {
+  width: 100%;
+  height: 48px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: #f5f6f7;
+  border-radius: 4px;
+}
+.g2-mfa-bindTotp .g2-mfa-bindTotp-copySecret .authing-ant-typography {
+  margin: 0;
+}
+.g2-mfa-bindTotp .g2-mfa-bindTotp-copySecret .authing-ant-typography svg {
+  color: #878a95 !important;
+  margin-left: 30px;
+}
+.g2-mfa-bindTotp .g2-mfa-bindTotp-secretSave {
+  margin-top: 16px;
+}
+.g2-mfa-bindTotp .g2-mfa-submit-button {
+  margin-top: 80px !important;
+}
+.g2-mfa-bindTotp .g2-mfa-bindTotp-qrcode {
+  box-shadow: 0px 0px 30px rgba(84, 89, 104, 0.15);
+  border-radius: 4px;
+}
+.g2-mfa-bindTotp .g2-mfa-bindTotp-securityCode-form {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+.g2-mfa-bindTotp .g2-mfa-bindTotp-securityCode-form .g2-mfa-submit-button {
+  margin-top: 64px !important;
+}
+.g2-mfa-bindTotp .g2-mfa-bindTotp-securityCode-form .g2-mfa-totp-verify-input {
+  text-align: center;
+  margin-top: 40px !important;
+}
+.g2-mfa-bindTotp .g2-mfa-bindTotp-securityCode-form p {
+  color: #878a95;
+}
+
 .g2-completeInfo-content {
   margin-bottom: 44px;
 }
@@ -1014,6 +1014,13 @@
   font-size: 14px;
 }
 
+.g2-icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+}
+
 /* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
 /* stylelint-disable no-duplicate-selectors */
 /* stylelint-disable */
@@ -1881,13 +1888,6 @@ strong {
   align-items: center;
 }
 
-.g2-icon {
-  width: 1em;
-  height: 1em;
-  vertical-align: -0.15em;
-  fill: currentColor;
-}
-
 .g2-base-image-background-animation {
   background: linear-gradient(60deg, #888888, #cecece, #dfdfdf, #f0f0f0);
   -webkit-animation: gradientBG 3s ease infinite;