@oceanbase/ui 1.0.0-alpha.2 → 1.0.0-alpha.20

package/lib/Login/RegisterForm.js

@@ -1,46 +1,21 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Login/RegisterForm.tsx
-var RegisterForm_exports = {};
-__export(RegisterForm_exports, {
-  PASSWORD_REGEX: () => PASSWORD_REGEX,
-  default: () => RegisterForm_default
+"use strict";
+"use client";
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(RegisterForm_exports);
-var import_design = require("@oceanbase/design");
-var import_lodash = require("lodash");
-var import_react = __toESM(require("react"));
-var import_util = require("../_util");
-var import_index = require("./index.less");
-var PASSWORD_REGEX = /^(?=(.*[a-z]){2,})(?=(.*[A-Z]){2,})(?=(.*\d){2,})(?=(.*[ !"#\$%&'\(\)\*\+,-\./:;<=>\?@\[\\\]\^_`\{\|\}~]){2,})[A-Za-z\d !"#\$%&'\(\)\*\+,-\./:;<=>\?@\[\\\]\^_`\{\|\}~]{8,32}$/;
-var prefix = (0, import_util.getPrefix)("login");
-var Register = ({
+exports.default = exports.PASSWORD_REGEX = void 0;
+var _design = require("@oceanbase/design");
+var _lodash = require("lodash");
+var _react = _interopRequireWildcard(require("react"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/**
+ * 冗余的转义符可以增强正则的可读性
+ */
+// eslint-disable-next-line
+const PASSWORD_REGEX = exports.PASSWORD_REGEX = /^(?=(.*[a-z]){2,})(?=(.*[A-Z]){2,})(?=(.*\d){2,})(?=(.*[ !"#\$%&'\(\)\*\+,-\./:;<=>\?@\[\\\]\^_`\{\|\}~]){2,})[A-Za-z\d !"#\$%&'\(\)\*\+,-\./:;<=>\?@\[\\\]\^_`\{\|\}~]{8,32}$/;
+const Register = ({
   isUserExists,
   locale,
   loading,
@@ -48,130 +23,114 @@ var Register = ({
   errorMessage,
   ...restProps
 }) => {
-  const [form] = import_design.Form.useForm();
-  const handleValidateAccount = (0, import_react.useCallback)(
-    async (rule, value) => {
-      if (!value || !(0, import_lodash.isFunction)(isUserExists)) {
-        return;
-      }
-      const isExists = await isUserExists(value);
-      if (isExists) {
-        throw new Error(locale.userExistMessage);
-      }
-    },
-    [isUserExists]
-  );
-  const handleValidateConfirmPassword = (0, import_react.useCallback)(
-    (rule, value, callback) => {
-      if (!form) {
-        callback();
-        return;
-      }
-      const pwd = form.getFieldValue("password");
-      if ((0, import_lodash.toString)(value) !== (0, import_lodash.toString)(pwd)) {
-        callback(locale.samePasswordMessage);
-        return;
-      }
+  const {
+    getPrefixCls
+  } = (0, _react.useContext)(_design.ConfigProvider.ConfigContext);
+  const prefixCls = getPrefixCls('login');
+  const [form] = _design.Form.useForm();
+  const handleValidateAccount = (0, _react.useCallback)(async (rule, value) => {
+    if (!value || !(0, _lodash.isFunction)(isUserExists)) {
+      return;
+    }
+    const isExists = await isUserExists(value);
+    if (isExists) {
+      throw new Error(locale.userExistMessage);
+    }
+  }, [isUserExists]);
+  const handleValidateConfirmPassword = (0, _react.useCallback)((rule, value, callback) => {
+    if (!form) {
       callback();
-    },
-    [form]
-  );
+      return;
+    }
+    const pwd = form.getFieldValue('password');
+    if ((0, _lodash.toString)(value) !== (0, _lodash.toString)(pwd)) {
+      callback(locale.samePasswordMessage);
+      return;
+    }
+    callback();
+  }, [form]);
   const passwordRegexpRule = passwordRule || {
     pattern: PASSWORD_REGEX,
     message: locale.passwordHelp
   };
-  return /* @__PURE__ */ import_react.default.createElement(
-    import_design.Form,
-    {
-      layout: "vertical",
-      requiredMark: false,
-      className: `${prefix}-form`,
-      form,
-      ...restProps,
-      "data-testid": "login.register"
-    },
-    errorMessage && /* @__PURE__ */ import_react.default.createElement(import_design.Alert, { type: "error", showIcon: true, className: `${prefix}-alert`, message: errorMessage }),
-    /* @__PURE__ */ import_react.default.createElement(
-      import_design.Form.Item,
-      {
-        name: "username",
-        label: locale.usernameLabel,
-        extra: locale.usernameHelp,
-        validateFirst: true,
-        rules: [
-          {
-            required: true,
-            whitespace: true,
-            message: locale.usernameMessage
-          },
-          {
-            min: 4,
-            max: 48,
-            message: locale.usernameLengthMessage
-          },
-          {
-            pattern: /^[a-zA-Z0-9_.+@#$%]+$/,
-            message: locale.usernameFormatMessage
-          },
-          {
-            validator: handleValidateAccount
-          }
-        ]
-      },
-      /* @__PURE__ */ import_react.default.createElement(import_design.Input, { autoComplete: "new-account", autoFocus: true })
-    ),
-    /* @__PURE__ */ import_react.default.createElement(
-      import_design.Form.Item,
-      {
-        name: "password",
-        label: locale.passwordLabel,
-        dependencies: ["confirmPassword"],
-        help: passwordRegexpRule.message,
-        validateFirst: true,
-        rules: [
-          {
-            required: true,
-            message: locale.passwordMessage
-          },
-          passwordRegexpRule
-        ]
-      },
-      /* @__PURE__ */ import_react.default.createElement(import_design.Input.Password, { visibilityToggle: true, autoComplete: "new-password" })
-    ),
-    /* @__PURE__ */ import_react.default.createElement(
-      import_design.Form.Item,
-      {
-        name: "confirmPassword",
-        label: locale.confirmPwdLabel,
-        dependencies: ["password"],
-        validateFirst: true,
-        rules: [
-          {
-            required: true,
-            message: locale.confirmPwdMessage
-          },
-          {
-            validator: handleValidateConfirmPassword
-          }
-        ]
-      },
-      /* @__PURE__ */ import_react.default.createElement(import_design.Input.Password, { visibilityToggle: true, autoComplete: "new-password" })
-    ),
-    /* @__PURE__ */ import_react.default.createElement(
-      import_design.Button,
-      {
-        htmlType: "submit",
-        loading,
-        type: "primary",
-        block: true,
-        className: `${prefix}-submit-btn`
-      },
-      locale.registerBtn
-    )
-  );
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_design.Form, {
+    layout: "vertical",
+    requiredMark: false,
+    className: `${prefixCls}-form`,
+    form: form,
+    ...restProps,
+    "data-testid": "login.register",
+    children: [errorMessage && /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Alert, {
+      type: "error",
+      showIcon: true,
+      className: `${prefixCls}-alert`,
+      message: errorMessage
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Form.Item, {
+      name: "username",
+      label: locale.usernameLabel,
+      extra: locale.usernameHelp,
+      validateFirst: true,
+      rules: [{
+        required: true,
+        whitespace: true,
+        message: locale.usernameMessage
+      }, {
+        min: 4,
+        max: 48,
+        message: locale.usernameLengthMessage
+      }, {
+        pattern: /^[a-zA-Z0-9_.+@#$%]+$/,
+        message: locale.usernameFormatMessage
+      }, {
+        validator: handleValidateAccount
+      }],
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Input, {
+        size: "large",
+        autoComplete: "new-account",
+        autoFocus: true
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Form.Item, {
+      name: "password",
+      label: locale.passwordLabel,
+      dependencies: ['confirmPassword'],
+      help: passwordRegexpRule.message,
+      validateFirst: true,
+      rules: [{
+        required: true,
+        message: locale.passwordMessage
+      }, passwordRegexpRule],
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Input.Password, {
+        size: "large",
+        visibilityToggle: true,
+        autoComplete: "new-password"
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Form.Item, {
+      name: "confirmPassword",
+      label: locale.confirmPwdLabel,
+      dependencies: ['password'],
+      validateFirst: true,
+      rules: [{
+        required: true,
+        message: locale.confirmPwdMessage
+      }, {
+        validator: handleValidateConfirmPassword
+      }],
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Input.Password, {
+        size: "large",
+        visibilityToggle: true,
+        autoComplete: "new-password"
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Button
+    // 按下回车键，即可触发点击事件
+    , {
+      htmlType: "submit",
+      size: "large",
+      loading: loading,
+      type: "primary",
+      block: true,
+      className: `${prefixCls}-submit-btn`,
+      children: locale.registerBtn
+    })]
+  });
 };
-var RegisterForm_default = Register;
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  PASSWORD_REGEX
-});
+var _default = exports.default = Register;

package/lib/Login/index.d.ts

@@ -5,7 +5,6 @@ import type { IActivateFormProps } from './ActivateForm';
 import type { ILoginFormProps } from './LoginForm';
 import type { IRegisterFormProps } from './RegisterForm';
 import type { Locale } from '../interface';
-import './index.less';
 export interface Values {
     username: string;
     password: string;

package/lib/Login/index.js

@@ -1,54 +1,29 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+"use strict";
 
-// src/Login/index.tsx
-var Login_exports = {};
-__export(Login_exports, {
-  default: () => Login_default
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(Login_exports);
-var import_ahooks = require("ahooks");
-var import_design = require("@oceanbase/design");
-var import_design2 = require("@oceanbase/design");
-var import_classnames = __toESM(require("classnames"));
-var import_react = __toESM(require("react"));
-var import_LocaleWrapper = __toESM(require("../locale/LocaleWrapper"));
-var import_util = require("../_util");
-var import_ActivateForm = __toESM(require("./ActivateForm"));
-var import_zh_CN = __toESM(require("./locale/zh-CN"));
-var import_LoginForm = __toESM(require("./LoginForm"));
-var import_RegisterForm = __toESM(require("./RegisterForm"));
-var import_oceanbase_logo = __toESM(require("../assets/logo/oceanbase_logo.svg"));
-var import_oceanbase_logo_dark = __toESM(require("../assets/logo/oceanbase_logo_dark.svg"));
-var import_LocaleDropdown = __toESM(require("../LocaleDropdown"));
-var import_index = require("./index.less");
-var prefix = (0, import_util.getPrefix)("login");
-var Login = (props) => {
+exports.default = void 0;
+var _ahooks = require("ahooks");
+var _design = require("@oceanbase/design");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _react = _interopRequireWildcard(require("react"));
+var _LocaleWrapper = _interopRequireDefault(require("../locale/LocaleWrapper"));
+var _ActivateForm = _interopRequireDefault(require("./ActivateForm"));
+var _zhCN = _interopRequireDefault(require("./locale/zh-CN"));
+var _LoginForm = _interopRequireDefault(require("./LoginForm"));
+var _RegisterForm = _interopRequireDefault(require("./RegisterForm"));
+var _oceanbase_logo = _interopRequireDefault(require("../assets/logo/oceanbase_logo.svg"));
+var _oceanbase_logo_dark = _interopRequireDefault(require("../assets/logo/oceanbase_logo_dark.svg"));
+var _LocaleDropdown = _interopRequireDefault(require("../LocaleDropdown"));
+var _style = _interopRequireDefault(require("./style"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+"use client"; // @ts-ignore
+// @ts-ignore
+const Login = props => {
   const {
     logo,
     bgImage,
@@ -71,102 +46,151 @@ var Login = (props) => {
     isMobile,
     style = {}
   } = props;
-  const [showRegister, setShowRegister] = (0, import_ahooks.useControllableValue)(props, {
+  const {
+    getPrefixCls,
+    theme
+  } = (0, _react.useContext)(_design.ConfigProvider.ConfigContext);
+  const prefixCls = getPrefixCls('login');
+  const {
+    wrapSSR
+  } = (0, _style.default)(prefixCls);
+  const [showRegister, setShowRegister] = (0, _ahooks.useControllableValue)(props, {
     defaultValue: false,
-    valuePropName: "showRegister",
-    trigger: "onShowRegisterChange"
+    valuePropName: 'showRegister',
+    trigger: 'onShowRegisterChange'
   });
-  const [showActivate, setShowActivate] = (0, import_ahooks.useControllableValue)(props, {
+  const [showActivate, setShowActivate] = (0, _ahooks.useControllableValue)(props, {
     defaultValue: false,
-    valuePropName: "showActivate",
-    trigger: "onShowActivateChange"
+    valuePropName: 'showActivate',
+    trigger: 'onShowActivateChange'
   });
-  const isLoading = (loginProps == null ? void 0 : loginProps.loading) || (registerProps == null ? void 0 : registerProps.loading) || (otherLoginProps == null ? void 0 : otherLoginProps.loading);
-  const { theme } = (0, import_react.useContext)(import_design.ConfigProvider.ConfigContext);
-  const switchForm = (0, import_react.useCallback)(() => {
+  const isLoading = loginProps?.loading || registerProps?.loading || otherLoginProps?.loading;
+  const switchForm = (0, _react.useCallback)(() => {
     if (isLoading) {
-      import_design2.message.warning(locale.isLoadingWarn);
+      _design.message.warning(locale.isLoadingWarn);
     }
     setShowRegister(!showRegister);
   }, [showRegister, isLoading]);
-  const goBack = (0, import_react.useCallback)(() => {
+  const goBack = (0, _react.useCallback)(() => {
     if (isLoading) {
-      import_design2.message.warning(locale.isLoadingWarn);
+      _design.message.warning(locale.isLoadingWarn);
     }
     setShowActivate(!showActivate);
   }, [showActivate, isLoading]);
   const showWaterMark = !showRegister;
-  return /* @__PURE__ */ import_react.default.createElement(import_design.App, null, /* @__PURE__ */ import_react.default.createElement(
-    "div",
-    {
-      className: (0, import_classnames.default)(`${prefix}-container`, {
-        [`${prefix}-container-with-board`]: board,
-        [`${prefix}-container-mobile`]: isMobile
+  return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.App, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: (0, _classnames.default)(`${prefixCls}-container`, {
+        [`${prefixCls}-container-with-board`]: board,
+        [`${prefixCls}-container-mobile`]: isMobile
       }),
-      style
-    },
-    /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}-bg`, style: { backgroundImage: `url(${bgImage})` } }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}-info` }, title && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}-welcome` }, title), description && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}-start` }, description))),
-    /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}-card` }, showLocale && /* @__PURE__ */ import_react.default.createElement(import_LocaleDropdown.default, { locales, className: `${prefix}-locale` }), board && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}-board` }, board), /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}-content` }, showActivate ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("img", { src: logo, alt: "", className: `${prefix}-activate-logo` }), /* @__PURE__ */ import_react.default.createElement(
-      import_design.Divider,
-      {
-        style: {
-          marginTop: 14,
-          marginBottom: 20
-        }
-      }
-    ), /* @__PURE__ */ import_react.default.createElement(import_design.Typography.Title, { level: 3 }, locale.activeTitle), /* @__PURE__ */ import_react.default.createElement(import_design.Typography.Paragraph, null, locale.activeTitleDescrition), /* @__PURE__ */ import_react.default.createElement(
-      import_ActivateForm.default,
-      {
-        ...activateFormProps,
-        locale,
-        errorMessage: alertProps == null ? void 0 : alertProps.message,
-        goBack
-      }
-    )) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, showRegister ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("img", { src: logo, alt: "", className: `${prefix}-reigster-logo` }), /* @__PURE__ */ import_react.default.createElement(
-      import_design.Divider,
-      {
+      style: style,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: `${prefixCls}-bg`,
         style: {
-          marginTop: 14,
-          marginBottom: 20
-        }
-      }
-    ), /* @__PURE__ */ import_react.default.createElement(import_design.Typography.Title, { level: 3 }, locale.registerTitle), /* @__PURE__ */ import_react.default.createElement(
-      import_RegisterForm.default,
-      {
-        ...registerProps,
-        locale,
-        errorMessage: alertProps == null ? void 0 : alertProps.message
-      }
-    )) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("img", { src: logo, alt: "", className: `${prefix}-logo` }), /* @__PURE__ */ import_react.default.createElement(
-      import_LoginForm.default,
-      {
-        ...loginProps,
-        otherLoginProps,
-        locale,
-        errorMessage: alertProps == null ? void 0 : alertProps.message,
-        showAuthCode,
-        showOtherLoginButton,
-        authCodeImg,
-        onAuthCodeImgChange
-      }
-    ))), !!enableRegister && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}-switch-btn` }, /* @__PURE__ */ import_react.default.createElement(import_design.Button, { type: "link", onClick: switchForm, "data-testid": "login.register.btn" }, showRegister ? locale.switchLoginLabel : locale.switchRegisterLabel)), showWaterMark ? /* @__PURE__ */ import_react.default.createElement(
-      "div",
-      {
-        className: `${prefix}-watermark-wrapper`,
-        style: { paddingLeft: showAuthCode ? 96 : 0 }
-      },
-      /* @__PURE__ */ import_react.default.createElement(
-        "img",
-        {
-          src: (theme == null ? void 0 : theme.isDark) ? import_oceanbase_logo_dark.default : import_oceanbase_logo.default,
-          alt: "",
-          className: `${prefix}-watermark`
-        }
-      )
-    ) : null))
-  ));
+          backgroundImage: `url(${bgImage})`
+        },
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: `${prefixCls}-info`,
+          children: [title && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: `${prefixCls}-welcome`,
+            children: title
+          }), description && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: `${prefixCls}-start`,
+            children: description
+          })]
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: `${prefixCls}-card`,
+        children: [showLocale && /*#__PURE__*/(0, _jsxRuntime.jsx)(_LocaleDropdown.default, {
+          locales: locales,
+          className: `${prefixCls}-locale`
+        }), board && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: `${prefixCls}-board`,
+          children: board
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: `${prefixCls}-content`,
+          children: [showActivate ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+              src: logo,
+              alt: "",
+              className: `${prefixCls}-activate-logo`
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Divider, {
+              style: {
+                marginTop: 14,
+                marginBottom: 20
+              }
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Typography.Title, {
+              level: 3,
+              children: locale.activeTitle
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Typography.Paragraph, {
+              children: locale.activeTitleDescrition
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ActivateForm.default, {
+              ...activateFormProps,
+              locale: locale,
+              errorMessage: alertProps?.message,
+              goBack: goBack
+            })]
+          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+            children: showRegister ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+                src: logo,
+                alt: "",
+                className: `${prefixCls}-reigster-logo`
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Divider, {
+                style: {
+                  marginTop: 14,
+                  marginBottom: 20
+                }
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Typography.Title, {
+                level: 3,
+                children: locale.registerTitle
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RegisterForm.default, {
+                ...registerProps,
+                locale: locale,
+                errorMessage: alertProps?.message
+              })]
+            }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+                src: logo,
+                alt: "",
+                className: `${prefixCls}-logo`
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_LoginForm.default, {
+                ...loginProps,
+                otherLoginProps: otherLoginProps,
+                locale: locale,
+                errorMessage: alertProps?.message,
+                showAuthCode: showAuthCode,
+                showOtherLoginButton: showOtherLoginButton,
+                authCodeImg: authCodeImg,
+                onAuthCodeImgChange: onAuthCodeImgChange
+              })]
+            })
+          }), !!enableRegister && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: `${prefixCls}-switch-btn`,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Button, {
+              type: "link",
+              onClick: switchForm,
+              "data-testid": "login.register.btn",
+              children: showRegister ? locale.switchLoginLabel : locale.switchRegisterLabel
+            })
+          }), showWaterMark ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: `${prefixCls}-watermark-wrapper`,
+            style: {
+              paddingLeft: showAuthCode ? 96 : 0
+            },
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+              src: theme?.isDark ? _oceanbase_logo_dark.default : _oceanbase_logo.default,
+              alt: "",
+              className: `${prefixCls}-watermark`
+            })
+          }) : null]
+        })]
+      })]
+    })
+  }));
 };
-var Login_default = (0, import_LocaleWrapper.default)({
-  componentName: "Login",
-  defaultLocale: import_zh_CN.default
-})(Login);
+var _default = exports.default = (0, _LocaleWrapper.default)({
+  componentName: 'Login',
+  defaultLocale: _zhCN.default
+})(Login);