@oceanbase/ui 0.2.0

package/lib/NavMenu/index.less

@@ -0,0 +1,50 @@
+@import '../variable.less';
+
+@prefix: ob-menu;
+
+.@{prefix}-container {
+  margin-top: 21px;
+  background-color: transparent;
+  user-select: none;
+
+  ul {
+    background-color: transparent;
+
+    li {
+      padding-right: 0 !important;
+
+      .@{prefixCls}-menu-title-content {
+        padding: 0 20px;
+        border-radius: 10px;
+        transition: 0.6s;
+
+        &:hover {
+          background-color: #e4e8f5;
+        }
+      }
+    }
+
+    .@{prefixCls}-menu-item:not(.@{prefixCls}-menu-item-selected):hover {
+      background-color: transparent !important;
+    }
+
+    .@{prefixCls}-menu-item-selected {
+      background-color: transparent !important;
+
+      .@{prefixCls}-menu-title-content {
+        background-color: #d7e2fc;
+
+        a {
+          color: transparent;
+          font-family: SourceSansPro-Semibold, SourceSansPro-Regular;
+          background: linear-gradient(-45deg, #002bff 0%, #0080ff 100%);
+          background-clip: text;
+        }
+      }
+
+      &::after {
+        display: none;
+      }
+    }
+  }
+}

package/lib/PageContainer/ItemRender.js

@@ -0,0 +1,51 @@
+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/PageContainer/ItemRender.tsx
+var ItemRender_exports = {};
+__export(ItemRender_exports, {
+  default: () => ItemRender_default
+});
+module.exports = __toCommonJS(ItemRender_exports);
+var import_useHistory = __toESM(require("../_util/useHistory"));
+var ItemRender_default = ({ route, params, routes, paths }) => {
+  const routeIndex = routes.indexOf(route);
+  const last = routeIndex === routes.length - 1;
+  const title = route.title || route.breadcrumbName;
+  const path = route.href || routes.slice(0, routeIndex + 1).map((item) => item.path).join("/");
+  const history = (0, import_useHistory.default)();
+  return last ? /* @__PURE__ */ React.createElement("span", null, title) : /* @__PURE__ */ React.createElement(
+    "a",
+    {
+      onClick: () => {
+        history.push(path);
+      }
+    },
+    title
+  );
+};

package/lib/PageContainer/index.d.ts

@@ -0,0 +1,16 @@
+import type { IconComponentProps } from '@ant-design/icons/es/components/Icon';
+import type { PageContainerProps as AntPageContainerProps, PageHeaderProps as AntPageHeaderProps } from '@ant-design/pro-components';
+import React from 'react';
+export declare type ReloadType = boolean | IconComponentProps | React.ReactNode;
+export interface PageContainerLocale {
+    reload?: string;
+}
+export declare type PageHeaderProps = AntPageHeaderProps & {
+    reload?: ReloadType;
+};
+export interface PageContainerProps extends AntPageContainerProps {
+    header?: PageHeaderProps;
+    locale?: PageContainerLocale;
+}
+declare const _default: any;
+export default _default;

package/lib/PageContainer/index.js

@@ -0,0 +1,88 @@
+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/PageContainer/index.tsx
+var PageContainer_exports = {};
+__export(PageContainer_exports, {
+  default: () => PageContainer_default
+});
+module.exports = __toCommonJS(PageContainer_exports);
+var import_icons = require("@ant-design/icons");
+var import_pro_components = require("@ant-design/pro-components");
+var import_design = require("@oceanbase/design");
+var import_classnames = __toESM(require("classnames"));
+var import_lodash = require("lodash");
+var import_react = __toESM(require("react"));
+var import_design2 = require("@oceanbase/design");
+var import_LocaleWrapper = __toESM(require("../locale/LocaleWrapper"));
+var import_ItemRender = __toESM(require("./ItemRender"));
+var import_zh_CN = __toESM(require("./locale/zh-CN"));
+var import_style = __toESM(require("./style"));
+var PageContainer = ({
+  prefixCls: customizePrefixCls,
+  className,
+  header,
+  locale,
+  ...restProps
+}) => {
+  const { getPrefixCls } = (0, import_react.useContext)(import_design2.ConfigProvider.ConfigContext);
+  const rootPrefixCls = getPrefixCls();
+  const prefixCls = getPrefixCls("pro-page-container", customizePrefixCls);
+  const { wrapSSR, hashId } = (0, import_style.default)(prefixCls);
+  const pageContainerCls = (0, import_classnames.default)(className, hashId);
+  const { reload, subTitle, breadcrumb } = header || {};
+  const reloadProps = (0, import_lodash.isObject)(reload) && !import_react.default.isValidElement(reload) ? reload : {};
+  const reloadCls = (0, import_classnames.default)(
+    `${rootPrefixCls}-page-header-heading-reload`,
+    reloadProps.className
+  );
+  const newSubTitle = /* @__PURE__ */ import_react.default.createElement(import_design.Space, { size: 12 }, reload && /* @__PURE__ */ import_react.default.createElement(import_design2.Tooltip, { title: locale.reload }, (0, import_lodash.isObject)(reload) && import_react.default.isValidElement(reload) ? reload : /* @__PURE__ */ import_react.default.createElement(import_icons.SyncOutlined, { ...reloadProps, className: reloadCls })), subTitle);
+  const newHeader = header && {
+    ...header,
+    subTitle: newSubTitle,
+    breadcrumb: {
+      itemRender: (route, params, routes, paths) => /* @__PURE__ */ import_react.default.createElement(import_ItemRender.default, { route, params, routes, paths }),
+      ...breadcrumb
+    }
+  };
+  return wrapSSR(
+    /* @__PURE__ */ import_react.default.createElement(
+      import_pro_components.PageContainer,
+      {
+        prefixCls: customizePrefixCls,
+        className: pageContainerCls,
+        header: newHeader,
+        ...restProps
+      }
+    )
+  );
+};
+var PageContainer_default = (0, import_LocaleWrapper.default)({
+  componentName: "PageContainer",
+  defaultLocale: import_zh_CN.default
+})(PageContainer);

package/lib/PageContainer/locale/en-US.js

@@ -0,0 +1,27 @@
+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/PageContainer/locale/en-US.ts
+var en_US_exports = {};
+__export(en_US_exports, {
+  default: () => en_US_default
+});
+module.exports = __toCommonJS(en_US_exports);
+var en_US_default = {
+  reload: "Reload"
+};

package/lib/PageContainer/locale/zh-CN.js

@@ -0,0 +1,27 @@
+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/PageContainer/locale/zh-CN.ts
+var zh_CN_exports = {};
+__export(zh_CN_exports, {
+  default: () => zh_CN_default
+});
+module.exports = __toCommonJS(zh_CN_exports);
+var zh_CN_default = {
+  reload: "刷新"
+};

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

@@ -0,0 +1,27 @@
+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/PageContainer/locale/zh-TW.ts
+var zh_TW_exports = {};
+__export(zh_TW_exports, {
+  default: () => zh_TW_default
+});
+module.exports = __toCommonJS(zh_TW_exports);
+var zh_TW_default = {
+  reload: "重新加載"
+};

package/lib/PageContainer/style/index.d.ts

@@ -0,0 +1,5 @@
+import type { PageContainerToken } from '@ant-design/pro-layout/es/components/PageContainer/style';
+import type { GenerateStyle } from 'antd/es/theme/internal';
+export declare const genPageContainerStyle: GenerateStyle<PageContainerToken>;
+declare const _default: (prefixCls: string) => any;
+export default _default;

package/lib/PageContainer/style/index.js

@@ -0,0 +1,120 @@
+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/PageContainer/style/index.ts
+var style_exports = {};
+__export(style_exports, {
+  default: () => style_default,
+  genPageContainerStyle: () => genPageContainerStyle
+});
+module.exports = __toCommonJS(style_exports);
+var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
+var genPageContainerStyle = (token) => {
+  const {
+    antCls,
+    proComponentsCls,
+    componentCls,
+    colorBgBase,
+    borderRadius,
+    boxShadowSecondary,
+    fontSizeHeading3,
+    controlHeightLG,
+    padding,
+    paddingLG
+  } = token;
+  const height = controlHeightLG;
+  const lineHeight = `${controlHeightLG}px`;
+  return {
+    [`${componentCls}`]: {
+      // 48px is the height of BasicLayout header
+      minHeight: "calc(100vh - 48px)",
+      [`${proComponentsCls}-grid-content`]: {
+        minHeight: "auto"
+      },
+      [`${antCls}-page-header`]: {
+        [`${antCls}-page-header-breadcrumb`]: {
+          marginBottom: 6
+        },
+        [`${antCls}-page-header-heading-title`]: {
+          fontSize: fontSizeHeading3
+        },
+        [`${antCls}-page-header-heading-reload`]: {
+          cursor: "pointer"
+        },
+        [`${antCls}-page-header-heading-extra`]: {
+          height,
+          lineHeight,
+          marginBlock: 0,
+          // 设置页容器右上角的组件高度
+          [`${antCls}-btn:not(${antCls}-input-search-button)`]: {
+            minWidth: controlHeightLG,
+            height
+          },
+          [`${antCls}-radio-button-wrapper`]: {
+            height,
+            lineHeight
+          },
+          [`${antCls}-input-wrapper`]: {
+            lineHeight
+          }
+        },
+        [`${antCls}-page-header-footer`]: {
+          marginBlockStart: 0
+        }
+      },
+      // 减小内容区左右两侧间距
+      [`${componentCls}-warp-page-header`]: {
+        paddingInline: paddingLG,
+        paddingBlock: padding
+      },
+      [`${componentCls}-children-container`]: {
+        paddingInline: paddingLG,
+        paddingBlockStart: 0,
+        paddingBlockEnd: paddingLG
+      }
+    },
+    [`${componentCls}-with-footer `]: {
+      paddingBottom: 64
+    },
+    [`${proComponentsCls}-footer-bar`]: {
+      backgroundColor: colorBgBase,
+      borderRadius,
+      boxShadow: boxShadowSecondary,
+      borderBlockStart: "none",
+      // 设置底部操作栏的组件高度
+      [`${antCls}-btn:not(${antCls}-input-search-button)`]: {
+        minWidth: 68,
+        height
+      },
+      [`${antCls}-radio-button-wrapper`]: {
+        height,
+        lineHeight
+      }
+    }
+  };
+};
+var style_default = (prefixCls) => {
+  const useStyle = (0, import_genComponentStyleHook.genComponentStyleHook)("PageContainer", (token) => {
+    return [genPageContainerStyle(token)];
+  });
+  return useStyle(prefixCls);
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  genPageContainerStyle
+});

package/lib/Password/Content.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+export interface Validator {
+    validate: (value?: string) => boolean;
+    message: string;
+    optional?: boolean;
+}
+declare const Content: React.FC<{
+    rules: Validator[];
+    fieldError: string[];
+    isValidating: boolean;
+    value?: string;
+    isTouched: boolean;
+}>;
+export default Content;

package/lib/Password/Content.js

@@ -0,0 +1,106 @@
+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/Password/Content.tsx
+var Content_exports = {};
+__export(Content_exports, {
+  default: () => Content_default
+});
+module.exports = __toCommonJS(Content_exports);
+var import_icons = require("@ant-design/icons");
+var import_design = require("@oceanbase/design");
+var import_react = __toESM(require("react"));
+var import_design2 = require("@oceanbase/design");
+var Content = ({ rules, fieldError, isValidating, value, isTouched }) => {
+  const statusIconMap = {
+    error: /* @__PURE__ */ import_react.default.createElement(import_icons.CloseCircleFilled, { style: { color: import_design2.token.colorError } }),
+    success: /* @__PURE__ */ import_react.default.createElement(import_icons.CheckCircleFilled, { style: { color: import_design2.token.colorSuccess } }),
+    wait: /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          width: 14,
+          height: 22
+        }
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          style: {
+            width: 6,
+            height: 6,
+            backgroundColor: import_design2.token.colorTextTertiary,
+            borderRadius: 4
+          }
+        }
+      )
+    )
+  };
+  const isRequireFail = rules.filter((rule) => !rule.optional).filter((rule) => fieldError.includes(rule.message)).length > 0;
+  const percent = Math.max(
+    0,
+    Math.min(100, (rules.length - fieldError.length) / rules.length * 100)
+  );
+  let strokeColor = "";
+  if (isRequireFail) {
+    strokeColor = import_design2.token.colorError;
+    if (percent > 50 && percent < 100 && percent !== 100) {
+      strokeColor = import_design2.token.colorWarning;
+    }
+  } else {
+    strokeColor = import_design2.token.colorSuccess;
+  }
+  return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(
+    import_design.Progress,
+    {
+      percent: value ? percent : 0,
+      strokeColor,
+      showInfo: false,
+      size: "small"
+    }
+  ), /* @__PURE__ */ import_react.default.createElement("ul", { style: { margin: 0, marginTop: "10px", listStyle: "none", padding: "0" } }, rules == null ? void 0 : rules.map((rule, index) => {
+    const isError = fieldError.includes(rule.message);
+    let status = "wait";
+    if (isError) {
+      status = rule.optional ? "wait" : "error";
+    } else {
+      status = "success";
+    }
+    if (!value) {
+      status = "error";
+    }
+    if (!isTouched) {
+      status = "wait";
+    }
+    return /* @__PURE__ */ import_react.default.createElement("li", { key: index }, /* @__PURE__ */ import_react.default.createElement(import_design.Space, { align: "start" }, isValidating ? /* @__PURE__ */ import_react.default.createElement(import_icons.LoadingOutlined, null) : statusIconMap[status], /* @__PURE__ */ import_react.default.createElement("span", { style: { color: import_design2.token.colorTextSecondary } }, rule.message)));
+  })));
+};
+var Content_default = Content;

package/lib/Password/index.d.ts

@@ -0,0 +1,25 @@
+import type { PasswordProps as AntdPasswordProps } from 'antd/es/input';
+import type { LocaleWrapperProps } from '../locale/LocaleWrapper';
+import type { Validator } from './Content';
+export interface PasswordLocale {
+    lengthRuleMessage: string;
+    charRuleMessage: string;
+    strengthRuleMessage: string;
+    placeholder: string;
+    generatePlaceholder: string;
+    randomlyGenerate: string;
+    pleaseKeepYourPasswordIn: string;
+    copySuccessfully: string;
+    copyPassword: string;
+    andKeepItProperly: string;
+}
+export interface PasswordProps extends LocaleWrapperProps, Omit<AntdPasswordProps, 'onChange'> {
+    value?: string;
+    onChange?: (value?: string) => void;
+    rules?: Validator[];
+    onValidate?: (passed: boolean) => void;
+    generatePasswordRegex?: RegExp;
+    locale?: PasswordLocale;
+}
+declare const _default: any;
+export default _default;