@oceanbase/ui 0.2.27 → 0.2.29

package/lib/ContentWithQuestion/style/index.js

@@ -0,0 +1,57 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/ContentWithQuestion/style/index.ts
+var style_exports = {};
+__export(style_exports, {
+  default: () => style_default,
+  genContentWithQuestionStyle: () => genContentWithQuestionStyle
+});
+module.exports = __toCommonJS(style_exports);
+var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
+var genContentWithQuestionStyle = (token) => {
+  const { componentCls, paddingSM } = token;
+  return {
+    [`${componentCls}-item`]: {
+      display: "inline-flex",
+      alignItems: "center",
+      [`${componentCls}-prefix`]: {
+        marginRight: 8
+      },
+      [`${componentCls}-suffix`]: {
+        marginLeft: 8
+      },
+      [`${componentCls}-help`]: {
+        cursor: "help"
+      },
+      [`${componentCls}-color`]: {
+        color: "red"
+      }
+    }
+  };
+};
+var style_default = (prefixCls) => {
+  const useStyle = (0, import_genComponentStyleHook.genComponentStyleHook)("ContentWithQuestion", (token) => {
+    return [genContentWithQuestionStyle(token)];
+  });
+  return useStyle(prefixCls);
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  genContentWithQuestionStyle
+});

package/lib/Highlight/index.d.ts

@@ -29,7 +29,7 @@ export declare const THEME_DARK = "dark";
 export declare const THEME_LIGHT = "light";
 declare const ThemeTypes: ["dark", "light"];
 export type ThemeType = (typeof ThemeTypes)[number];
-declare const supportedLanguages: ("ruby" | "css" | "bash" | "json" | "go" | "javascript" | "typescript" | "groovy" | "java" | "python" | "cpp" | "http" | "markdown" | "nginx" | "sql" | "xml" | "dockerfile" | "yaml" | "solidity" | "tsx" | "jsx")[];
+declare const supportedLanguages: ("ruby" | "css" | "javascript" | "typescript" | "groovy" | "java" | "python" | "bash" | "json" | "cpp" | "http" | "markdown" | "nginx" | "sql" | "xml" | "dockerfile" | "go" | "yaml" | "solidity" | "tsx" | "jsx")[];
 export type LanguageType = (typeof supportedLanguages)[number] | 'html';
 export interface HighlightProps extends LocaleWrapperProps {
     /**

package/lib/Login/index.d.ts

@@ -61,6 +61,7 @@ export interface LoginProps extends FormProps {
     onShowRegisterChange?: (isShow: boolean) => void;
     onShowActivateChange?: (isShow: boolean) => void;
     onAuthCodeImgChange?: () => void;
+    isMobile?: boolean;
 }
 declare const _default: any;
 export default _default;

package/lib/Login/index.js

@@ -37,7 +37,6 @@ 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_constant = require("../constant");
 var import_LocaleWrapper = __toESM(require("../locale/LocaleWrapper"));
 var import_util = require("../_util");
 var import_ActivateForm = __toESM(require("./ActivateForm"));
@@ -69,6 +68,7 @@ var Login = (props) => {
     showOtherLoginButton,
     authCodeImg,
     onAuthCodeImgChange,
+    isMobile,
     style = {}
   } = props;
   const [showRegister, setShowRegister] = (0, import_ahooks.useControllableValue)(props, {
@@ -95,21 +95,13 @@ var Login = (props) => {
     }
     setShowActivate(!showActivate);
   }, [showActivate, isLoading]);
-  const localeMenu = /* @__PURE__ */ import_react.default.createElement(
-    import_design.Menu,
-    {
-      onClick: ({ key }) => {
-        (0, import_util.setLocale)(key);
-      }
-    },
-    import_constant.LOCALE_LIST.filter((item) => !locales || locales.includes(item.value)).map((item) => /* @__PURE__ */ import_react.default.createElement(import_design.Menu.Item, { key: item.value }, item.label))
-  );
   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-with-board`]: board,
+        [`${prefix}-container-mobile`]: isMobile
       }),
       style
     },

package/lib/Login/index.less

@@ -5,20 +5,19 @@
 .@{prefix}-container {
   display: flex;
   justify-content: space-between;
-  min-width: 768px;
+  min-width: 960px;
   height: 100vh;
   min-height: 600px;
   overflow: auto;
 
   .@{prefix}-bg {
-    width: 540px;
-    min-width: 400px;
+    width: 40%;
     height: 100%;
     background-repeat: no-repeat;
     background-size: cover;
 
     .@{prefix}-info {
-      margin: 185px 90px 0 90px;
+      margin: 185px 48px 0 48px;
       color: #fff;
       font-weight: 600;
       font-size: 56px;
@@ -43,7 +42,7 @@
     background-color: #fff;
 
     .@{prefix}-locale {
-      position: fixed;
+      position: absolute;
       top: 24px;
       right: 24px;
       color: @colorTextTertiary;
@@ -58,6 +57,7 @@
 
     .@{prefix}-content {
       margin-top: -60px;
+      width: 404px;
       .@{prefix}-logo {
         display: block;
         height: 68px;
@@ -87,13 +87,11 @@
         }
 
         .@{prefixCls}-form-item {
-          width: 404px;
           margin-bottom: 24px;
           padding-bottom: 0;
         }
 
         .@{prefixCls}-input-affix-wrapper {
-          width: 404px;
           height: 40px;
           border-radius: 8px;
 
@@ -178,7 +176,6 @@
         }
       }
       .@{prefix}-submit-btn {
-        width: 404px;
         height: 40px;
         border-radius: 8px;
       }
@@ -201,7 +198,6 @@
       }
 
       .@{prefix}-alert {
-        width: 404px;
         margin-bottom: 24px;
         border-radius: 8px;
       }
@@ -209,54 +205,6 @@
   }
 }
 
-@media (max-width: 2048px) {
-  .@{prefix}-container {
-    .@{prefix}-bg {
-      width: 800px;
-
-      .@{prefix}-info {
-        margin: 185px 48px 0 48px;
-        font-size: 72px;
-        .@{prefix}-start {
-          font-size: 48px;
-        }
-      }
-    }
-  }
-}
-
-@media (max-width: 1800px) {
-  .@{prefix}-container {
-    .@{prefix}-bg {
-      width: 700px;
-
-      .@{prefix}-info {
-        margin: 185px 48px 0 48px;
-        font-size: 64px;
-        .@{prefix}-start {
-          font-size: 40px;
-        }
-      }
-    }
-  }
-}
-
-@media (max-width: 1600px) {
-  .@{prefix}-container {
-    .@{prefix}-bg {
-      width: 600px;
-
-      .@{prefix}-info {
-        margin: 185px 48px 0 48px;
-        font-size: 56px;
-        .@{prefix}-start {
-          font-size: 32px;
-        }
-      }
-    }
-  }
-}
-
 // 设置的登录页最小高度，防止 logo 偏移位置偏移遮住输入框
 @media (max-height: 650px) {
   .@{prefix}-container {
@@ -267,59 +215,53 @@
   }
 }
 
-@media (max-width: 1200px) {
-  .@{prefix}-container {
-    .@{prefix}-bg {
-      width: 500px;
-
-      .@{prefix}-info {
-        margin: 185px 48px 0 48px;
-        font-size: 48px;
-        .@{prefix}-start {
-          font-size: 28px;
-        }
-      }
+.@{prefix}-container-with-board {
+  .@{prefix}-card {
+    .@{prefix}-content {
+      margin-top: 0;
     }
   }
 }
 
-@media (max-width: 992px) {
-  .@{prefix}-container {
-    .@{prefix}-bg {
-      width: 400px;
-
-      .@{prefix}-info {
-        margin: 185px 32px 0 32px;
-        font-size: 40px;
-        .@{prefix}-start {
-          font-size: 24px;
-        }
-      }
-    }
+.@{prefix}-container-mobile {
+  flex-direction: column;
+  min-width: auto;
+  .@{prefix}-banner {
+    // 移动端设置百分比高度，避免使用 vh，否则安卓端打开软键盘会重新计算高度，导致 banner 图片高度出现跳变
+    height: 25%;
   }
-}
-
-@media (max-width: 768px) {
-  .@{prefix}-container {
-    .@{prefix}-bg {
-      width: 250px;
-
-      .@{prefix}-info {
-        margin: 185px 24px 0 24px;
-        font-size: 32px;
-
-        .@{prefix}-start {
-          font-size: 20px;
-        }
-      }
-    }
+  .@{prefix}-bg {
+    width: 100%;
   }
-}
-
-.@{prefix}-container-with-board {
   .@{prefix}-card {
+    align-items: start;
+    width: 100%;
+    height: 75%;
+    margin-top: -48px;
+    padding: 0 32px;
+    border-radius: 16px 16px 0 0;
+    position: relative;
+    .@{prefix}-board {
+      top: 8px;
+      left: 24px;
+    }
+    .@{prefix}-locale {
+      top: 8px;
+    }
     .@{prefix}-content {
-      margin-top: 0;
+      width: 100%;
+      margin-top: 40px;
+      .@{prefix}-logo {
+        height: 48px;
+        margin-bottom: 24px;
+      }
+      .@{prefix}-watermark-wrapper {
+        // 移动端改为正常文档流，避免安卓端被软键盘顶起
+        width: calc(100% - 64px);
+        position: static;
+        width: 100%;
+        margin-top: 96px;
+      }
     }
   }
 }

package/lib/PageContainer/style/index.js

@@ -47,12 +47,12 @@ var genPageContainerStyle = (token) => {
       [`${proComponentsCls}-grid-content`]: {
         minHeight: "auto"
       },
-      [`${antCls}-page-header`]: {
+      [`${componentCls}-warp-page-header,${componentCls}-wrap-page-header`]: {
         // 减小内容区左右两侧间距
-        paddingInlineStart: paddingLG,
-        paddingInlineEnd: paddingLG,
-        paddingBlockStart: padding,
-        paddingBlockEnd: padding,
+        paddingInlineStart: `${paddingLG}px !important`,
+        paddingInlineEnd: `${paddingLG}px !important`,
+        paddingBlockStart: `${padding}px !important`,
+        paddingBlockEnd: `${padding}px !important`,
         [`${antCls}-page-header-breadcrumb`]: {
           // overwritten pro-components style
           paddingBlockStart: 0

package/lib/TagSelect/style/index.js

@@ -73,6 +73,7 @@ var genTagSelectStyle = (token) => {
       marginRight: token.marginXS,
       padding: `${token.paddingXXS}px ${token.paddingContentHorizontal}px`,
       cursor: "pointer",
+      transition: `all ${token.motionDurationMid} ${token.motionEaseInOut}`,
       [`${componentCls}-input`]: {
         width: 0,
         height: 0,
@@ -107,15 +108,15 @@ var genTagSelectStyle = (token) => {
     [`${componentCls}-large`]: genSizeStyle(token.paddingContentVerticalSM, token.fontSize),
     [`${componentCls}-small`]: genSizeStyle(0, token.fontSize),
     [`${componentCls}-wrapper:not(${componentCls}-disabled):hover`]: {
-      color: token.colorPrimaryTextHover
+      borderColor: token.colorPrimaryText
     },
     [`${componentCls}-checked`]: genColoredStyle(
       token.blue,
       token.colorPrimaryBg,
       token.colorPrimaryText
     ),
-    [`${componentCls}-wrapper${componentCls}-checked:not(${componentCls}-disabled):focus-within`]: {
-      boxShadow: `0 1px 3px 0px #000`,
+    [`${componentCls}-wrapper:not(${componentCls}-disabled):active`]: {
+      boxShadow: `0px 0px 3px ${token.colorPrimary}`,
       borderColor: `${token.colorPrimary}`
     },
     [`${componentCls}-checked:not(${componentCls}-disabled)`]: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oceanbase/ui",
-  "version": "0.2.27",
+  "version": "0.2.29",
   "description": "The UI library based on OceanBase Design",
   "keywords": [
     "oceanbase",
@@ -37,7 +37,7 @@
     "@ant-design/cssinjs": "^1.17.2",
     "@ant-design/pro-components": "^2.6.34",
     "@ant-design/pro-layout": "^7.17.8",
-    "@oceanbase/design": "^0.2.26",
+    "@oceanbase/design": "^0.2.28",
     "@oceanbase/icons": "^0.2.9",
     "@oceanbase/util": "^0.2.11",
     "ahooks": "^2.10.14",
@@ -52,7 +52,7 @@
     "moment": "^2.29.4",
     "path-to-regexp": "^6.2.1",
     "randexp": "^0.5.3",
-    "rc-util": "^5.38.0",
+    "rc-util": "^5.38.1",
     "react-copy-to-clipboard": "^5.1.0",
     "react-json-view": "^1.21.3",
     "react-split-pane": "^0.1.92",
@@ -66,5 +66,5 @@
     "react": ">=16.9.0",
     "react-dom": ">=16.9.0"
   },
-  "gitHead": "c9a4257a5c6357396e72c6a7acccd24613c4ceaf"
+  "gitHead": "4f6e62c8ae28c364828a704f569bf55be42548d5"
 }