@authing/react-ui-components 3.0.2-alpha.2 → 3.0.2-beta.12

package/components/AuthingGuard/api/appConfig.ts

@@ -1,146 +0,0 @@
-import { Lang, Protocol } from '../types'
-import {
-  IAzureAdConnectionConfig,
-  ICasConnectionConfig,
-  IOAuthConnectionConfig,
-  ISamlConnectionConfig,
-  OIDCConnectionConfig,
-  SocialConnectionItem,
-} from './userPoolConfig'
-import { i18n } from '../../_utils/locales'
-import { requestClient } from '../../_utils/http'
-import { PasswordStrength } from '../../_utils'
-
-export enum ApplicationMfaType {
-  SMS = 'SMS',
-  EMAIL = 'EMAIL',
-  // OTP = 'OTP',
-  // FACE = 'FACE',
-  // FINGERPRINT = 'FINGERPRINT',
-}
-
-export const ApplicationMfaTypeLabel: () => Record<
-  ApplicationMfaType,
-  string
-> = () => ({
-  [ApplicationMfaType.SMS]: i18n.t('common.SMS'),
-  [ApplicationMfaType.EMAIL]: i18n.t('common.EmailVerification'),
-})
-
-export interface OidcClientMetadata {
-  grant_types: string[]
-  client_id: string
-  redirect_uris: string[]
-  scope: string
-  response_types: ResponseType[]
-}
-export interface InternalExtendsField {
-  type: 'internal'
-  name: string
-  label: string
-  inputType: string
-}
-
-export interface UserExtendsField {
-  type: 'user'
-  id: string
-  name: string
-  label: string
-  inputType: string
-}
-
-export type ExtendsField = InternalExtendsField | UserExtendsField
-
-export interface ApplicationPasswordTabConfig {
-  enabledLoginMethods?: PasswordLoginMethods[]
-}
-
-export interface Agreement {
-  id: number
-  title: string
-  required: boolean
-  lang: Lang
-}
-
-export type PasswordLoginMethods =
-  | 'username-password'
-  | 'email-password'
-  | 'phone-password'
-
-export interface ApplicationConfig {
-  id: string
-  cdnBase: string
-  userPoolId: string
-  rootUserPoolId: string
-  publicKey: string
-  // 登录框自定义 css 代码
-  css: string
-  name: string
-  logo: string
-  redirectUris: string[]
-  registerDisabled: boolean
-  registerTabs: {
-    list: string[]
-    default: string
-    title: { [x: string]: string }
-  }
-  loginTabs: {
-    list: string[]
-    default: string
-    title: { [x: string]: string }
-  }
-  socialConnections: SocialConnectionItem[]
-
-  extendsFieldsEnabled: boolean
-  extendsFields: ExtendsField[]
-
-  identifier: string
-  identityProviders: {
-    identifier: string
-    protocol: Protocol
-    displayName: string
-    logo: string
-    config:
-      | ISamlConnectionConfig
-      | OIDCConnectionConfig
-      | ICasConnectionConfig
-      | IAzureAdConnectionConfig
-      | IOAuthConnectionConfig
-  }[]
-
-  ssoPageComponentDisplay: {
-    autoRegisterThenLoginHintInfo: boolean
-    forgetPasswordBtn: boolean
-    idpBtns: boolean
-    loginBtn: boolean
-    loginByPhoneCodeTab: boolean
-    loginByUserPasswordTab: boolean
-    loginMethodNav: boolean
-    phoneCodeInput: boolean
-    registerBtn: boolean
-    registerByEmailTab: boolean
-    registerByPhoneTab: boolean
-    registerMethodNav: boolean
-    socialLoginBtns: boolean
-    userPasswordInput: boolean
-    wxMpScanTab: boolean
-  }
-
-  protocol: Protocol
-  oidcConfig: OidcClientMetadata
-  passwordTabConfig: ApplicationPasswordTabConfig
-
-  agreementEnabled: boolean
-  agreements: Agreement[]
-  customPasswordStrength: any
-  passwordStrength: PasswordStrength
-  verifyCodeLength: number
-}
-
-export const fetchAppConfig = (appId: string) =>
-  requestClient.get<ApplicationConfig>(
-    `/api/v2/applications/${appId}/public-config`,
-    {
-      credentials: 'include',
-    }
-  )

package/components/AuthingGuard/api/index.ts

@@ -1,3 +0,0 @@
-export * from './sso'
-export * from './appConfig'
-export * from './userPoolConfig'

package/components/AuthingGuard/api/sso.ts

@@ -1,29 +0,0 @@
-import { User } from '../types'
-import { requestClient } from '../../_utils/http'
-
-export interface SessionData {
-  session: null | {
-    _id: string
-    cookie: {
-      originalMaxAge: number
-      expires: Date
-      secure: boolean
-      httpOnly: boolean
-      path: string
-      sameSite: string
-    }
-    appId?: string
-    type: string
-    userId: string
-  }
-  userInfo?: User
-}
-
-export const trackSession = () =>
-  requestClient.get<SessionData>(
-    `/cas/session`,
-    {},
-    {
-      credentials: 'include',
-    }
-  )

package/components/AuthingGuard/api/userPoolConfig.ts

@@ -1,111 +0,0 @@
-import { Lang, Protocol } from '../types'
-import { SocialConnectionProvider } from 'authing-js-sdk'
-
-export interface OIDCConnectionConfig {
-  issuerUrl: string
-  authorizationEdpoint: string
-  responseType: string
-  mode: OIDCConnectionMode
-  clientId: string
-  clientSecret: string
-  scopes: string
-  redirectUri: string
-}
-
-export interface IOAuthConnectionConfig {
-  authEndPoint: string
-  tokenEndPoint: string
-  scope: string
-  clientId: string
-  clientSecret: string
-  authUrlTemplate: string
-  codeToTokenScript: string
-  tokenToUserInfoScript: string
-  tokenToUserInfoScriptFuncId: string
-  codeToTokenScriptFuncId: string
-  authUrl?: string // 根据模板拼接出来的授权 url
-}
-
-export interface IAzureAdConnectionConfig {
-  microsoftAzureAdDomain: string
-  clientId: string
-  syncUserProfileOnLogin: string
-  emailVerifiedDefault: boolean
-  authorizationUrl: string
-  callbackUrl: string
-}
-
-export enum OIDCConnectionMode {
-  FRONT_CHANNEL = 'FRONT_CHANNEL',
-  BACK_CHANNEL = 'BACK_CHANNEL',
-}
-
-export interface ISamlConnectionConfig {
-  signInEndPoint: string
-  samlRequest?: string
-
-  // saml assertion 验签公钥
-
-  samlIdpCert: string
-
-  // saml request 验签公钥
-
-  samlSpCert: string
-
-  // saml request 签名私钥
-
-  samlSpKey: string
-
-  signOutEndPoint: string
-
-  signSamlRequest: boolean
-
-  signatureAlgorithm: string
-
-  digestAlgorithm: string
-
-  protocolBinding: string
-}
-
-export interface ICasConnectionConfig {
-  casConnectionLoginUrl: string
-}
-export interface SocialConnectionItem {
-  name: string
-  name_en: string
-  logo: string
-  description: string
-  provider: SocialConnectionProvider
-  authorizationUrl: string
-  tooltip: Record<Lang, string>
-}
-
-export interface EnterpriseConnectionItem {
-  id: string
-  createdAt: Date
-  updatedAt: Date
-  userPoolId: string
-  protocol: Protocol
-  identifier: string
-  displayName: string
-  logo: string
-  enabled: boolean
-  config:
-    | OIDCConnectionConfig
-    | ISamlConnectionConfig
-    | ICasConnectionConfig
-    | IAzureAdConnectionConfig
-    | IOAuthConnectionConfig
-}
-
-export interface UserPoolConfig {
-  name: string
-  logo: string
-  socialConnections: SocialConnectionItem[]
-  enterpriseConnections: EnterpriseConnectionItem[]
-}
-
-// export const fetchUserPoolConfig = (userPoolId: string) =>
-//   requestClient.get<UserPoolConfig>(
-//     `/api/v2/userpools/${userPoolId}/public-config`
-//   )

package/components/AuthingGuard/constants.ts

@@ -1,105 +0,0 @@
-import {
-  GuardMode,
-  UserConfig,
-  GuardScenes,
-  LoginMethods,
-  RegisterMethods,
-  LocalesConfig,
-} from '../../components/AuthingGuard/types'
-import { i18n } from '../_utils/locales'
-
-// 个人版 OTP MFA 的 error code
-export const OTP_MFA_CODE = 1635
-// 企业版手机和短信验证吗 MFA 的 error code
-export const APP_MFA_CODE = 1636
-
-// 需要验证吗
-export const NEED_CAPTCHA = 2000
-
-export const LOGIN_METHODS_MAP = () => ({
-  [LoginMethods.Password]: i18n.t('login.pwdLogin'),
-  [LoginMethods.PhoneCode]: i18n.t('login.verifyCodeLogin'),
-  [LoginMethods.AppQr]: i18n.t('login.appScanLogin'),
-  [LoginMethods.WxMinQr]: i18n.t('login.scanLogin'),
-  [LoginMethods.LDAP]: i18n.t('login.ldapLogin'),
-  [LoginMethods.AD]: i18n.t('login.adLogin'),
-  [LoginMethods.WechatMpQrcode]: i18n.t('login.wechatmpQrcode'),
-})
-
-export const REGISTER_METHODS_MAP = () => ({
-  [RegisterMethods.Email]: i18n.t('login.emailRegister'),
-  [RegisterMethods.Phone]: i18n.t('login.phoneRegister'),
-})
-
-// 某些社会化登录会在 tabs 中显示，或者无法在 Guard 中使用，所以底部不显示了
-export const HIDE_SOCIALS = [
-  'wechat:miniprogram:app-launch',
-  'wechat:miniprogram:qrconnect',
-  'wechat:webpage-authorization',
-  'wechat:miniprogram:default',
-  'wechatwork:addressbook',
-  'wechat:mobile',
-]
-
-// 企业版 MFA 支持的方式
-export enum ApplicationMfaType {
-  SMS = 'SMS',
-  EMAIL = 'EMAIL',
-  // OTP = 'OTP',
-  // FACE = 'FACE',
-  // FINGERPRINT = 'FINGERPRINT',
-}
-
-export const defaultGuardConfig: Partial<UserConfig> = {
-  isSSO: false,
-  title: 'Authing',
-  text: {
-    loginTabs: LOGIN_METHODS_MAP(),
-    loginBtn: {
-      normal: '登录',
-      loading: '登录',
-    },
-    registerBtn: {
-      normal: '注册',
-      loading: '注册',
-    },
-  },
-  escCloseable: true,
-  autoRegister: false,
-  clickCloseable: true,
-  mode: GuardMode.Normal,
-  disableRegister: false,
-  disableResetPwd: false,
-  defaultScenes: GuardScenes.Login,
-  appHost: 'https://core.authing.cn',
-  defaultLoginMethod: LoginMethods.Password,
-  defaultRegisterMethod: RegisterMethods.Email,
-  loginMethods: [LoginMethods.Password, LoginMethods.PhoneCode],
-  registerMethods: [RegisterMethods.Email, RegisterMethods.Phone],
-  logo:
-    'https://files.authing.co/user-contents/photos/0a4c99ff-b8ce-4030-aaaf-584c807cb21c.png',
-  passwordLoginMethods: [
-    'email-password',
-    'username-password',
-    'phone-password',
-  ],
-}
-
-export const defaultLocalesConfig: LocalesConfig = {
-  defaultLang: 'zh-CN',
-  isShowChange: false,
-}
-
-export const defaultHeaders: {
-  'userpool-id': string
-  'app-id': string
-  'sdk-version': string
-  'request-from': string
-  lang: string
-} = {
-  'userpool-id': 'x-authing-userpool-id',
-  'app-id': 'x-authing-app-id',
-  'request-from': 'x-authing-request-from',
-  'sdk-version': 'x-authing-sdk-version',
-  lang: 'x-authing-lang',
-}

package/components/AuthingGuard/hooks/index.tsx

@@ -1,70 +0,0 @@
-import {
-  AuthenticationClient,
-  AuthenticationClientOptions,
-} from 'authing-js-sdk'
-import { defaultGuardConfig } from '../constants'
-
-let authClient: AuthenticationClient | null = null
-
-export interface AuthClientConfig extends AuthenticationClientOptions {
-  /**
-   * @deprecated 使用 appHost
-   */
-  appDomain?: string
-  /**
-   * @deprecated 无需传入
-   */
-  isSSO?: boolean
-  /**
-   * @deprecated 使用 appHost
-   */
-  host?: string
-}
-
-export const initAuthClient = (config: AuthClientConfig) => {
-  if (authClient) {
-    return authClient
-  }
-
-  const { appHost, appDomain, host } = config
-
-  /**
-   * 兼容之前的参数
-   */
-  let realHost
-  if (appHost) {
-    realHost = appHost
-  } else if (appDomain) {
-    const parsedUrl = new URL(host || defaultGuardConfig.appHost!)
-    realHost = `${parsedUrl.protocol}//${appDomain}${
-      parsedUrl.port ? ':' + parsedUrl.port : ''
-    }`
-  } else if (host) {
-    realHost = host
-  } else {
-    realHost = defaultGuardConfig.appHost
-  }
-  config.appHost = realHost!
-
-  authClient = new AuthenticationClient(config)
-
-  return authClient
-}
-
-export const useAuthing = (config?: AuthClientConfig) => {
-  return { authClient: getAuthClient(config) }
-}
-
-export const getAuthClient = (config?: AuthClientConfig) => {
-  if (!authClient && !config) {
-    throw new Error(
-      'Please `initAuthClient` first or pass `AuthClientConfig` to useAuthing.'
-    )
-  }
-
-  if (config) {
-    initAuthClient(config)
-  }
-
-  return authClient
-}

package/components/AuthingGuard/hooks/useScreenSize.tsx

@@ -1,68 +0,0 @@
-import { useState, useEffect } from 'react'
-// import { inRange, debounce } from 'lodash'
-
-function debounce(fn: Function, delay: number, immediate = true) {
-  let timer: any
-
-  return function (this: any) {
-    let context = this
-    let args = arguments
-    timer && clearTimeout(timer)
-
-    if (immediate && !timer) {
-      fn.apply(context, args)
-    }
-
-    timer = setTimeout(function () {
-      fn.apply(context, args)
-    }, delay)
-  }
-}
-
-function inRange(n: number, start: number, end?: number): boolean {
-  if (end || end === 0) {
-    return n >= start && n <= end
-  }
-  return n >= start
-}
-
-export enum ScreenSize {
-  Mobile = 'mobile',
-  Desktop = 'desktop',
-}
-export const SCREEN_SIZE_RANG: {
-  size: ScreenSize
-  range: [number, number]
-}[] = [
-  {
-    size: ScreenSize.Mobile,
-    range: [0, 719],
-  },
-  {
-    size: ScreenSize.Desktop,
-    range: [720, Infinity],
-  },
-]
-
-export const getScreenSize = () => {
-  const viewportWidth = document.body.clientWidth
-  return (
-    SCREEN_SIZE_RANG.find((item) => inRange(viewportWidth, ...item.range))
-      ?.size ?? ScreenSize.Desktop
-  )
-}
-
-export const useScreenSize = () => {
-  const [screenSize, setScreenSize] = useState(getScreenSize)
-
-  useEffect(() => {
-    const onResize = debounce(() => {
-      setScreenSize(getScreenSize())
-    }, 200)
-    window.addEventListener('resize', onResize)
-
-    return () => window.removeEventListener('resize', onResize)
-  }, [])
-
-  return [screenSize]
-}

package/components/AuthingGuard/index.tsx

@@ -1,126 +0,0 @@
-import { ConfigProvider, message } from 'antd'
-import React, { FC } from 'react'
-import { AuthenticationClient } from 'authing-js-sdk'
-
-import { GuardContext } from '../context/global/context'
-import { GuardScenes } from '../../components/AuthingGuard/types'
-import { requestClient } from '../_utils/http'
-import {
-  defaultGuardConfig,
-  OTP_MFA_CODE,
-  APP_MFA_CODE,
-  defaultLocalesConfig,
-  defaultHeaders,
-} from '../../components/AuthingGuard/constants'
-import { GuardLayout } from '../../components/AuthingGuard/GuardLayout'
-import {
-  UserConfig,
-  GuardEventsHandler,
-} from '../../components/AuthingGuard/types/GuardConfig'
-
-import './style.less'
-import { initI18n } from '../_utils/locales'
-const PREFIX_CLS = 'authing-ant'
-
-message.config({
-  prefixCls: `${PREFIX_CLS}-message`,
-})
-
-interface AuthingGuardProps extends GuardEventsHandler {
-  appId: string
-  config?: UserConfig
-  visible?: boolean
-  className?: string
-  id?: string
-}
-
-export const AuthingGuard: FC<AuthingGuardProps> = ({
-  appId,
-  config = {},
-  visible,
-  className,
-  id,
-  ...guardEvents
-}) => {
-  const {
-    apiHost,
-    appDomain,
-    appHost,
-    defaultLoginMethod = defaultGuardConfig.defaultLoginMethod,
-    defaultScenes = defaultGuardConfig.defaultScenes,
-    defaultRegisterMethod = defaultGuardConfig.defaultRegisterMethod,
-    lang,
-    localesConfig = defaultLocalesConfig,
-    headers = defaultHeaders,
-  } = config
-
-  initI18n(localesConfig, lang)
-
-  let realHost: string | undefined
-  if (appHost) {
-    realHost = appHost
-  } else if (appDomain) {
-    const parsedUrl = new URL(defaultGuardConfig.appHost!)
-    realHost = `${parsedUrl.protocol}//${appDomain}${
-      parsedUrl.port ? ':' + parsedUrl.port : ''
-    }`
-  } else {
-    realHost = apiHost || defaultGuardConfig.appHost!
-  }
-
-  requestClient.setBaseUrl(realHost)
-  requestClient.setLangHeader(headers?.lang)
-
-  const authClient = new AuthenticationClient({
-    appHost: realHost!,
-    appId,
-    requestFrom: 'ui-components',
-    lang: localesConfig.defaultLang ?? lang,
-    headers,
-    onError: (code, msg: any) => {
-      if (code === 2020) {
-        return
-      }
-      if ([OTP_MFA_CODE, APP_MFA_CODE].includes(code)) {
-        message.info(msg)
-        return
-      }
-      message.error(msg)
-    },
-  })
-
-  const activeTabs = {
-    [GuardScenes.Login]: defaultLoginMethod,
-    [GuardScenes.Register]: defaultRegisterMethod,
-  }
-
-  return (
-    <ConfigProvider prefixCls={PREFIX_CLS}>
-      <GuardContext
-        value={{
-          authClient,
-          config: { ...config },
-          userConfig: config,
-          appId,
-          guardScenes: defaultScenes,
-          activeTabs,
-          guardTitle: config.title,
-          mfaData: {
-            mfaToken: '',
-          },
-          guardEvents,
-          localesConfig: config.localesConfig,
-          realHost: realHost,
-        }}
-      >
-        <GuardLayout
-          id={id}
-          className={className}
-          visible={visible}
-          lang={lang}
-          userConfig={config}
-        />
-      </GuardContext>
-    </ConfigProvider>
-  )
-}