@oceanbase/ui 1.0.0-alpha.10 → 1.0.0-alpha.11

package/lib/Login/locale/zh-TW.js

@@ -1,50 +1,32 @@
-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);
+"use strict";
 
-// src/Login/locale/zh-TW.ts
-var zh_TW_exports = {};
-__export(zh_TW_exports, {
-  default: () => zh_TW_default
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(zh_TW_exports);
-var zh_TW_default = {
-  usernamePlaceholder: "請輸入用戶名",
-  usernameMessage: "用戶名不能為空",
-  passwordPlaceholder: "請輸入密碼",
-  passwordMessage: "密碼不能為空",
-  loginText: "登錄",
-  isLoadingWarn: "正在執行中",
-  usernameLabel: "用戶名",
-  switchLoginLabel: "登錄已有帳號",
-  switchRegisterLabel: "註冊帳號",
-  userExistMessage: "用戶名已存在",
-  usernameFormatMessage: "用戶名格式不符合要求",
-  samePasswordMessage: "確認密碼不一致",
-  usernameHelp: "支持英文、數字、下劃線和特殊字符（._+@#$%），長度 4~48 位字符",
-  usernameLengthMessage: "用戶名長度 4~48 位字符",
-  passwordLabel: "密碼",
-  passwordHelp: "至少包含 2 位字符、2 位大寫字母、2 位小寫字母和 2 位特殊字符（._+@#$%），長度 8~32 位字符",
-  confirmPwdLabel: "確認密碼",
-  confirmPwdMessage: "請再次輸入密碼",
-  registerBtn: "立即注册",
-  registerTitle: "註冊帳號",
-  activeTitle: "設置密碼激活帳號",
-  activeTitleDescrition: "為了帳號安全，需要設置密碼激活帳號",
-  activeSubmitBtn: "激活",
-  activeBackBtn: "返回上一步"
-};
+exports.default = void 0;
+var _default = exports.default = {
+  usernamePlaceholder: '請輸入用戶名',
+  usernameMessage: '用戶名不能為空',
+  passwordPlaceholder: '請輸入密碼',
+  passwordMessage: '密碼不能為空',
+  loginText: '登錄',
+  isLoadingWarn: '正在執行中',
+  usernameLabel: '用戶名',
+  switchLoginLabel: '登錄已有帳號',
+  switchRegisterLabel: '註冊帳號',
+  userExistMessage: '用戶名已存在',
+  usernameFormatMessage: '用戶名格式不符合要求',
+  samePasswordMessage: '確認密碼不一致',
+  usernameHelp: '支持英文、數字、下劃線和特殊字符（._+@#$%），長度 4~48 位字符',
+  usernameLengthMessage: '用戶名長度 4~48 位字符',
+  passwordLabel: '密碼',
+  passwordHelp: '至少包含 2 位字符、2 位大寫字母、2 位小寫字母和 2 位特殊字符（._+@#$%），長度 8~32 位字符',
+  confirmPwdLabel: '確認密碼',
+  confirmPwdMessage: '請再次輸入密碼',
+  registerBtn: '立即注册',
+  registerTitle: '註冊帳號',
+  activeTitle: '設置密碼激活帳號',
+  activeTitleDescrition: '為了帳號安全，需要設置密碼激活帳號',
+  activeSubmitBtn: '激活',
+  activeBackBtn: '返回上一步'
+};

package/lib/Login/style/index.js

@@ -1,30 +1,11 @@
-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);
+"use strict";
 
-// src/Login/style/index.ts
-var style_exports = {};
-__export(style_exports, {
-  default: () => style_default,
-  genLoginStyle: () => genLoginStyle
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(style_exports);
-var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
-var genLoginStyle = (token) => {
+exports.genLoginStyle = exports.default = void 0;
+var _genComponentStyleHook = require("../../_util/genComponentStyleHook");
+const genLoginStyle = token => {
   const {
     componentCls,
     antCls,
@@ -36,27 +17,27 @@ var genLoginStyle = (token) => {
   } = token;
   return {
     [`${componentCls}-container`]: {
-      display: "flex",
-      justifyContent: "space-between",
+      display: 'flex',
+      justifyContent: 'space-between',
       minWidth: 960,
-      height: "100vh",
+      height: '100vh',
       minHeight: 600,
-      overflow: "auto",
+      overflow: 'auto',
       [`${componentCls}-bg`]: {
-        width: "40%",
-        height: "100%",
-        backgroundRepeat: "no-repeat",
-        backgroundSize: "cover",
-        backgroundPosition: "center",
+        width: '40%',
+        height: '100%',
+        backgroundRepeat: 'no-repeat',
+        backgroundSize: 'cover',
+        backgroundPosition: 'center',
         [`${componentCls}-info`]: {
-          margin: "185px 48px 0 48px",
-          color: "#fff",
+          margin: '185px 48px 0 48px',
+          color: '#fff',
           fontWeight: token.fontWeightStrong,
           fontSize: 56,
-          fontFamily: "PingFangSC",
+          fontFamily: 'PingFangSC',
           [`${componentCls}-start`]: {
             marginTop: 22,
-            color: "#f4f4f4",
+            color: '#f4f4f4',
             fontWeight: token.fontWeightStrong,
             fontSize: 32,
             letterSpacing: 0
@@ -64,38 +45,38 @@ var genLoginStyle = (token) => {
         }
       },
       [`${componentCls}-card`]: {
-        display: "flex",
+        display: 'flex',
         flex: 1,
-        alignItems: "center",
-        justifyContent: "center",
-        height: "100%",
+        alignItems: 'center',
+        justifyContent: 'center',
+        height: '100%',
         minHeight: 600,
-        backgroundColor: "#fff",
+        backgroundColor: '#fff',
         [`${componentCls}-locale`]: {
-          position: "absolute",
+          position: 'absolute',
           top: 24,
           right: 24,
           color: colorTextTertiary,
-          fontFamily: "PingFangSC-Regular",
-          cursor: "pointer"
+          fontFamily: 'PingFangSC-Regular',
+          cursor: 'pointer'
         },
         [`${componentCls}-board`]: {
-          position: "absolute",
+          position: 'absolute',
           top: 48
         },
         [`${componentCls}-content`]: {
           marginTop: -60,
           width: 404,
           [`${componentCls}-logo`]: {
-            display: "block",
+            display: 'block',
             height: 68,
-            margin: "0 auto",
+            margin: '0 auto',
             marginBottom: 40
           },
           [`${componentCls}-activate-logo, ${componentCls}-reigster-logo`]: {
-            display: "block",
+            display: 'block',
             height: 68,
-            margin: "0 auto"
+            margin: '0 auto'
           },
           [`${componentCls}-register, ${componentCls}-activate`]: {
             [`${antCls}-form-item-with-help`]: {
@@ -103,8 +84,8 @@ var genLoginStyle = (token) => {
             }
           },
           [`${componentCls}-form`]: {
-            width: "100%",
-            "input::placeholder": {
+            width: '100%',
+            'input::placeholder': {
               fontSize: 14
             },
             [`${antCls}-form-item`]: {
@@ -113,13 +94,13 @@ var genLoginStyle = (token) => {
             },
             [`${antCls}-input-affix-wrapper`]: {
               [`${antCls}-input:not(${antCls}-input-disabled)`]: {
-                boxShadow: "inset 0 0 0 1000px white !important"
+                boxShadow: 'inset 0 0 0 1000px white !important'
               },
               [`${antCls}-input:-internal-autofill-selected`]: {
-                boxShadow: "inset 0 0 0 1000px white !important"
+                boxShadow: 'inset 0 0 0 1000px white !important'
               },
               [`${antCls}-input:focus:-internal-autofill-selected`]: {
-                boxShadow: "inset 0 0 0 1000px white !important"
+                boxShadow: 'inset 0 0 0 1000px white !important'
               }
             },
             [`${antCls}-input-affix-wrapper ${antCls}-input:not(:first-child)`]: {
@@ -137,9 +118,9 @@ var genLoginStyle = (token) => {
             }
           },
           [`${componentCls}-auth-code`]: {
-            display: "flex",
-            alignItems: "start",
-            width: "100%",
+            display: 'flex',
+            alignItems: 'start',
+            width: '100%',
             marginBottom: 24,
             paddingBottom: 0,
             [`> ${antCls}-space-item:first-child`]: {
@@ -149,27 +130,27 @@ var genLoginStyle = (token) => {
               marginBottom: 0
             },
             [`${componentCls}-code-btn`]: {
-              position: "relative",
+              position: 'relative',
               height: 38,
               border: `1px solid ${colorBorder}`,
-              borderRadius,
-              cursor: "pointer",
+              borderRadius: borderRadius,
+              cursor: 'pointer',
               img: {
                 height: 38,
-                borderRadius
+                borderRadius: borderRadius
               },
               [`${componentCls}-code-mask`]: {
-                position: "absolute",
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center",
+                position: 'absolute',
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
                 height: 38,
-                color: "#fff",
-                background: "rgba(0, 0, 0, 0.5)",
-                borderRadius,
-                cursor: "pointer",
+                color: '#fff',
+                background: 'rgba(0, 0, 0, 0.5)',
+                borderRadius: borderRadius,
+                cursor: 'pointer',
                 opacity: 0,
-                transition: "opacity 0.3s",
+                transition: 'opacity 0.3s',
                 inset: 0
               },
               [`&.${componentCls}-error, &:hover`]: {
@@ -182,27 +163,27 @@ var genLoginStyle = (token) => {
           [`${componentCls}-submit-btn`]: {},
           [`${componentCls}-switch-btn`]: {
             marginTop: 24,
-            textAlign: "center",
-            cursor: "pointer"
+            textAlign: 'center',
+            cursor: 'pointer'
           },
           [`${componentCls}-watermark-wrapper`]: {
-            position: "absolute",
+            position: 'absolute',
             bottom: 40,
             width: 404,
-            textAlign: "center",
+            textAlign: 'center',
             [`${componentCls}-watermark`]: {
               height: 16
             }
           },
           [`${componentCls}-alert`]: {
             marginBottom: 24,
-            borderRadius
+            borderRadius: borderRadius
           }
         }
       },
-      "@media (max-height: 650px)": {
+      '@media (max-height: 650px)': {
         [`${componentCls}-watermark-wrapper`]: {
-          position: "absolute",
+          position: 'absolute',
           top: 600
         }
       }
@@ -215,22 +196,22 @@ var genLoginStyle = (token) => {
       }
     },
     [`${componentCls}-container-mobile`]: {
-      flexDirection: "column",
-      minWidth: "auto",
+      flexDirection: 'column',
+      minWidth: 'auto',
       [`${componentCls}-banner`]: {
-        height: "25%"
+        height: '25%'
       },
       [`${componentCls}-bg`]: {
-        width: "100%"
+        width: '100%'
       },
       [`${componentCls}-card`]: {
-        alignItems: "start",
-        width: "100%",
-        height: "75%",
+        alignItems: 'start',
+        width: '100%',
+        height: '75%',
         marginTop: -48,
-        padding: "0 32px",
-        borderRadius: "16px 16px 0 0",
-        position: "relative",
+        padding: '0 32px',
+        borderRadius: '16px 16px 0 0',
+        position: 'relative',
         [`${componentCls}-board`]: {
           top: 8,
           left: 24
@@ -239,15 +220,15 @@ var genLoginStyle = (token) => {
           top: 8
         },
         [`${componentCls}-content`]: {
-          width: "100%",
+          width: '100%',
           marginTop: 40,
           [`${componentCls}-logo`]: {
             height: 48,
             marginBottom: 24
           },
           [`${componentCls}-watermark-wrapper`]: {
-            width: "100%",
-            position: "static",
+            width: '100%',
+            position: 'static',
             marginTop: 96
           }
         }
@@ -255,13 +236,11 @@ var genLoginStyle = (token) => {
     }
   };
 };
-var style_default = (prefixCls) => {
-  const useStyle = (0, import_genComponentStyleHook.genComponentStyleHook)("Login", (token) => {
+exports.genLoginStyle = genLoginStyle;
+var _default = prefixCls => {
+  const useStyle = (0, _genComponentStyleHook.genComponentStyleHook)('Login', token => {
     return [genLoginStyle(token)];
   });
   return useStyle(prefixCls);
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  genLoginStyle
-});
+exports.default = _default;

package/lib/Lottie/index.js

@@ -1,26 +1,9 @@
-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);
+"use strict";
 
-// src/Lottie/index.ts
-var Lottie_exports = {};
-__export(Lottie_exports, {
-  default: () => Lottie_default
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(Lottie_exports);
-var import_design = require("@oceanbase/design");
-var Lottie_default = import_design.Lottie;
+exports.default = void 0;
+var _design = require("@oceanbase/design");
+"use client";
+var _default = exports.default = _design.Lottie;

package/lib/NavMenu/index.js

@@ -1,116 +1,113 @@
-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/NavMenu/index.tsx
-var NavMenu_exports = {};
-__export(NavMenu_exports, {
-  default: () => NavMenu_default
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(NavMenu_exports);
-var import_design = require("@oceanbase/design");
-var import_lodash = require("lodash");
-var import_path_to_regexp = require("path-to-regexp");
-var import_react = require("react");
-var import_useNavigate = __toESM(require("../_util/useNavigate"));
-var import_style = __toESM(require("./style"));
-var import_jsx_runtime = require("react/jsx-runtime");
-var NavMenu_default = (props) => {
-  const { menuList, className, style } = props;
-  const { getPrefixCls } = (0, import_react.useContext)(import_design.ConfigProvider.ConfigContext);
-  const prefixCls = getPrefixCls("menu");
-  const { wrapSSR } = (0, import_style.default)(prefixCls);
-  const [selectedKeys, setSelectedKeys] = (0, import_react.useState)(["0"]);
-  const [menus, setMenus] = (0, import_react.useState)([]);
+exports.default = void 0;
+var _design = require("@oceanbase/design");
+var _lodash = require("lodash");
+var _pathToRegexp = require("path-to-regexp");
+var _react = _interopRequireWildcard(require("react"));
+var _useNavigate = _interopRequireDefault(require("../_util/useNavigate"));
+var _style = _interopRequireDefault(require("./style"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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; }
+"use client";
+var _default = props => {
+  const {
+    menuList,
+    className,
+    style
+  } = props;
+  const {
+    getPrefixCls
+  } = (0, _react.useContext)(_design.ConfigProvider.ConfigContext);
+  const prefixCls = getPrefixCls('menu');
+  const {
+    wrapSSR
+  } = (0, _style.default)(prefixCls);
+  const [selectedKeys, setSelectedKeys] = (0, _react.useState)(['0']);
+  const [menus, setMenus] = (0, _react.useState)([]);
   const location = window.location;
-  const navigate = (0, import_useNavigate.default)();
-  const preProcess = (0, import_react.useCallback)(
-    (list) => {
-      const { pathname } = location;
-      try {
-        for (let i = 0; i < list.length; i++) {
-          const { link, openNewTab, href, key, children } = list[i];
-          const linkList = (0, import_lodash.isArray)(link) ? link : [link];
-          const match = linkList.some(
-            (lk) => (
-              // pathToRegexp 不支持 http/https 协议解析，需要去掉协议头
-              (0, import_path_to_regexp.pathToRegexp)(lk.replace(/^https?:\/\//, "")).test(pathname)
-            )
-          );
-          if (match) {
-            if (openNewTab || href)
-              return false;
-            setSelectedKeys([key]);
-            setMenus(list);
-            return;
-          }
-          if (!!(children == null ? void 0 : children.length)) {
-            preProcess(children);
-          }
+  const navigate = (0, _useNavigate.default)();
+  const preProcess = (0, _react.useCallback)(list => {
+    const {
+      pathname
+    } = location;
+    try {
+      for (let i = 0; i < list.length; i++) {
+        const {
+          link,
+          openNewTab,
+          href,
+          key,
+          children
+        } = list[i];
+        const linkList = (0, _lodash.isArray)(link) ? link : [link];
+        const match = linkList.some(lk =>
+        // pathToRegexp 不支持 http/https 协议解析，需要去掉协议头
+        (0, _pathToRegexp.pathToRegexp)(lk.replace(/^https?:\/\//, '')).test(pathname));
+        if (match) {
+          if (openNewTab || href) return false;
+          setSelectedKeys([key]);
+          setMenus(list);
+          return;
+        }
+        if (!!children?.length) {
+          preProcess(children);
         }
-      } catch (error) {
-        console.log("error", error);
       }
-    },
-    [location]
-  );
-  (0, import_react.useEffect)(() => {
+    } catch (error) {
+      console.log('error', error);
+    }
+  }, [location]);
+  (0, _react.useEffect)(() => {
     preProcess(menuList);
   }, [menuList, preProcess]);
-  const onMenuItemSelect = (0, import_react.useCallback)(
-    (payload) => {
-      const { selectedKeys: newSelectedKeys } = payload;
-      if (menus.some((i) => i.key === newSelectedKeys[0] && i.openNewTab))
-        return;
-      setSelectedKeys(newSelectedKeys);
-    },
-    [setSelectedKeys, menus]
-  );
-  const onMenuClick = (0, import_react.useCallback)(
-    (link) => {
-      const linkList = (0, import_lodash.isArray)(link) ? link : [link];
-      navigate == null ? void 0 : navigate(linkList[0]);
-    },
-    [navigate]
-  );
-  return wrapSSR(
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `${prefixCls}-container ${className || ""}`, style, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_design.Menu,
-      {
-        style: { height: "100%", borderRight: 0 },
-        defaultSelectedKeys: ["0"],
-        selectedKeys,
-        onSelect: onMenuItemSelect,
-        mode: "inline",
-        theme: "light",
-        children: menus.map((config) => {
-          return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design.Menu.Item, { disabled: config.disabled ?? false, children: config.openNewTab ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { id: config.id, href: config.link, target: "_blank", rel: "noreferrer", children: config.title }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { id: config.id, onClick: () => onMenuClick(config.link), children: config.title }) }, config.key);
-        })
-      }
-    ) })
-  );
+  const onMenuItemSelect = (0, _react.useCallback)(payload => {
+    const {
+      selectedKeys: newSelectedKeys
+    } = payload;
+    // 打开新tab类型的不需要设置选中态
+    if (menus.some(i => i.key === newSelectedKeys[0] && i.openNewTab)) return;
+    setSelectedKeys(newSelectedKeys);
+  }, [setSelectedKeys, menus]);
+  const onMenuClick = (0, _react.useCallback)(link => {
+    const linkList = (0, _lodash.isArray)(link) ? link : [link];
+    navigate?.(linkList[0]);
+  }, [navigate]);
+  return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: `${prefixCls}-container ${className || ''}`,
+    style: style,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Menu, {
+      style: {
+        height: '100%',
+        borderRight: 0
+      },
+      defaultSelectedKeys: ['0'],
+      selectedKeys: selectedKeys,
+      onSelect: onMenuItemSelect,
+      mode: "inline",
+      theme: "light",
+      children: menus.map(config => {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_design.Menu.Item, {
+          disabled: config.disabled ?? false,
+          children: config.openNewTab ? /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
+            id: config.id,
+            href: config.link,
+            target: "_blank",
+            rel: "noreferrer",
+            children: config.title
+          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
+            id: config.id,
+            onClick: () => onMenuClick(config.link),
+            children: config.title
+          })
+        }, config.key);
+      })
+    })
+  }));
 };
+exports.default = _default;