@oceanbase/ui 0.4.11 → 0.4.13

package/lib/DateRanger/PickerPanel.js

@@ -46,6 +46,19 @@ var import_dayjs2 = __toESM(require("dayjs"));
 var import_util = require("../_util");
 var import_constant = require("./constant");
 var ALL_ERROR_TYPE_LIST = ["endDate", "startDate", "endTime", "startTime"];
+var CLICK_STATE = {
+  START: "START",
+  END: "END"
+};
+var useClickFSA = () => {
+  const [state, setState] = (0, import_react.useState)(CLICK_STATE.END);
+  const next = () => {
+    setState((ps) => {
+      return ps === CLICK_STATE.START ? CLICK_STATE.END : CLICK_STATE.START;
+    });
+  };
+  return [state, next];
+};
 var prefix = (0, import_util.getPrefix)("ranger-picker-panel");
 var prefixCls = "ant-picker";
 var TIME_FORMAT = "HH:mm:ss";
@@ -63,6 +76,7 @@ var InternalPickerPanel = (props) => {
   } = props;
   const rootCls = (0, import_useCSSVarCls.default)(prefixCls);
   const [wrapCSSVar, hashId, cssVarCls] = (0, import_style.default)(prefixCls, rootCls);
+  const [clickFSA, clickFSANext] = useClickFSA();
   const [defaultS, defaultE] = defaultValue;
   const [calendarValue, setCalendarValue] = import_react.default.useState(defaultValue);
   const [internalHoverValues, setInternalHoverValues] = import_react.default.useState(null);
@@ -88,7 +102,9 @@ var InternalPickerPanel = (props) => {
     return clone;
   }
   const onPanelHover = (date) => {
-    setInternalHoverValues(date ? fillCalendarValue(date, activeIndex) : null);
+    setInternalHoverValues(
+      date && clickFSA === CLICK_STATE.START ? fillCalendarValue(date, activeIndex) : null
+    );
   };
   const formatValues = [...calendarValue].sort((a, b) => {
     return (a == null ? void 0 : a.valueOf()) - (b == null ? void 0 : b.valueOf());
@@ -99,8 +115,8 @@ var InternalPickerPanel = (props) => {
   const [_sDate, _eDate] = formatValues;
   const setFormatDateToForm = () => {
     form.setFieldsValue({
-      startDate: _sDate,
-      endDate: _eDate
+      startDate: getDateInstance(_sDate),
+      endDate: getDateInstance(_eDate)
     });
   };
   (0, import_react.useEffect)(() => {
@@ -115,88 +131,13 @@ var InternalPickerPanel = (props) => {
     pre[errorKey] = "error";
     return pre;
   }, {});
-  const validateInputDate = (e) => {
-    const v = e.target.value;
+  const formatDate = (v) => {
     const date = getDateInstance(v, DATE_FORMAT, true);
     return date.isValid() ? date.format(DATE_FORMAT) : null;
   };
-  const validateInputTime = (e) => {
+  const validateInputDate = (e) => {
     const v = e.target.value;
-    const [h, m, s] = (v == null ? void 0 : v.split(":")) ?? [];
-    if (!(h && m && s))
-      return null;
-    if (!(h.length === 2 && m.length === 2 && s.length === 2))
-      return null;
-    const date = getDateInstance(v, TIME_FORMAT, true);
-    return date.isValid() ? date.format(TIME_FORMAT) : null;
-  };
-  const selectDateInputRange = (inputDomRef) => {
-    if (!inputDomRef)
-      return;
-    if (inputDomRef.selectionStart >= 0 && inputDomRef.selectionStart <= 4) {
-      inputDomRef.setSelectionRange(0, 4);
-    }
-    if (inputDomRef.selectionStart > 4 && inputDomRef.selectionStart <= 7) {
-      inputDomRef.setSelectionRange(5, 7);
-    }
-    if (inputDomRef.selectionStart > 7 && inputDomRef.selectionStart <= 10) {
-      inputDomRef.setSelectionRange(8, 10);
-    }
-  };
-  const selectTimeInputRange = (inputDomRef) => {
-    if (!inputDomRef)
-      return;
-    if (inputDomRef.selectionStart >= 0 && inputDomRef.selectionStart <= 2) {
-      inputDomRef.setSelectionRange(0, 2);
-    }
-    if (inputDomRef.selectionStart > 2 && inputDomRef.selectionStart <= 5) {
-      inputDomRef.setSelectionRange(3, 5);
-    }
-    if (inputDomRef.selectionStart > 5 && inputDomRef.selectionStart <= 8) {
-      inputDomRef.setSelectionRange(6, 8);
-    }
-  };
-  const handleDateInputKeyDown = (inputDomRef, e) => {
-    if (!inputDomRef)
-      return;
-    if (e.key === "Enter") {
-      inputDomRef.blur();
-      return;
-    }
-    if (e.key === "ArrowLeft") {
-      const curIndex = inputDomRef.selectionStart;
-      inputDomRef.setSelectionRange(curIndex - 1, curIndex - 1);
-    }
-    if (e.key === "ArrowRight") {
-      const curIndex = inputDomRef.selectionEnd;
-      inputDomRef.setSelectionRange(curIndex + 1, curIndex + 1);
-    }
-    requestIdleCallback(() => {
-      if (validateInputDate(e)) {
-        selectDateInputRange(inputDomRef);
-      }
-    });
-  };
-  const handleTimeInputKeyDown = (inputDomRef, e) => {
-    if (!inputDomRef)
-      return;
-    if (e.key === "Enter") {
-      inputDomRef.blur();
-      return;
-    }
-    if (e.key === "ArrowLeft") {
-      const curIndex = inputDomRef.selectionStart;
-      inputDomRef.setSelectionRange(curIndex - 1, curIndex - 1);
-    }
-    if (e.key === "ArrowRight") {
-      const curIndex = inputDomRef.selectionEnd;
-      inputDomRef.setSelectionRange(curIndex + 1, curIndex + 1);
-    }
-    requestIdleCallback(() => {
-      if (validateInputTime(e)) {
-        selectTimeInputRange(inputDomRef);
-      }
-    });
+    return formatDate(v);
   };
   return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(prefix) }, /* @__PURE__ */ import_react.default.createElement(import_design.Space, { direction: "vertical", size: 12, style: { margin: "12px 0" } }, /* @__PURE__ */ import_react.default.createElement(
     import_design.Form,
@@ -217,25 +158,26 @@ var InternalPickerPanel = (props) => {
         rules: [{ required: true }]
       },
       /* @__PURE__ */ import_react.default.createElement(
-        import_design.Input,
+        import_design.DatePicker,
         {
-          size: "middle",
+          format: {
+            format: "YYYY-MM-DD",
+            type: "mask"
+          },
+          style: { width: 128 },
+          open: false,
+          suffixIcon: null,
+          allowClear: false,
           onBlur: (e) => {
             const v = validateInputDate(e);
             if (v) {
-              form.setFieldValue("startDate", v);
+              form.setFieldValue("startDate", getDateInstance(v));
               setCalendarValue(([, eDate]) => {
                 return [getDateInstance(v), eDate];
               });
             } else {
               setFormatDateToForm();
             }
-          },
-          onClick: () => {
-            selectDateInputRange(form.getFieldInstance("startDate").nativeElement);
-          },
-          onKeyDown: (e) => {
-            handleDateInputKeyDown(form.getFieldInstance("startDate").nativeElement, e);
           }
         }
       )
@@ -257,16 +199,9 @@ var InternalPickerPanel = (props) => {
           needConfirm: false,
           getPopupContainer: (triggerNode) => triggerNode.parentNode,
           style: { width: "100%" },
-          onClick: () => {
-            selectTimeInputRange(
-              form.getFieldInstance("startTime").nativeElement.querySelector("input")
-            );
-          },
-          onKeyDown: (e) => {
-            handleTimeInputKeyDown(
-              form.getFieldInstance("startTime").nativeElement.querySelector("input"),
-              e
-            );
+          format: {
+            format: "HH:mm:ss",
+            type: "mask"
           }
         }
       )
@@ -281,24 +216,26 @@ var InternalPickerPanel = (props) => {
         rules: [{ required: true }]
       },
       /* @__PURE__ */ import_react.default.createElement(
-        import_design.Input,
+        import_design.DatePicker,
         {
+          format: {
+            format: "YYYY-MM-DD",
+            type: "mask"
+          },
+          style: { width: 128 },
+          open: false,
+          suffixIcon: null,
+          allowClear: false,
           onBlur: (e) => {
             const v = validateInputDate(e);
             if (v) {
-              form.setFieldValue("endDate", v);
+              form.setFieldValue("endDate", getDateInstance(v));
               setCalendarValue(([sDate]) => {
                 return [sDate, getDateInstance(v)];
               });
             } else {
               setFormatDateToForm();
             }
-          },
-          onClick: () => {
-            selectDateInputRange(form.getFieldInstance("endDate").nativeElement);
-          },
-          onKeyDown: (e) => {
-            handleDateInputKeyDown(form.getFieldInstance("endDate").nativeElement, e);
           }
         }
       )
@@ -320,16 +257,9 @@ var InternalPickerPanel = (props) => {
           needConfirm: false,
           getPopupContainer: (triggerNode) => triggerNode.parentNode,
           style: { width: "100%" },
-          onClick: () => {
-            selectTimeInputRange(
-              form.getFieldInstance("endTime").nativeElement.querySelector("input")
-            );
-          },
-          onKeyDown: (e) => {
-            handleTimeInputKeyDown(
-              form.getFieldInstance("endTime").nativeElement.querySelector("input"),
-              e
-            );
+          format: {
+            format: "HH:mm:ss",
+            type: "mask"
           }
         }
       )
@@ -355,7 +285,12 @@ var InternalPickerPanel = (props) => {
             onPanelHover(res[0]);
           },
           onSelect: (...res) => {
-            setCalendarValue(fillCalendarValue(res[0], activeIndex));
+            clickFSANext();
+            if (clickFSA === CLICK_STATE.END) {
+              setCalendarValue([res[0], res[0]]);
+            } else {
+              setCalendarValue(fillCalendarValue(res[0], activeIndex));
+            }
             setActiveIndex((index) => {
               return index + 1 === 2 ? 0 : index + 1;
             });
@@ -400,11 +335,11 @@ var InternalPickerPanel = (props) => {
         onClick: () => {
           form.validateFields().then((values) => {
             const { startDate, startTime, endDate, endTime } = values;
-            const [sTime, eTime] = startDate === endDate ? [startTime, endTime].sort((a, b) => {
+            const [sTime, eTime] = startDate.isSame(endDate) ? [startTime, endTime].sort((a, b) => {
               return (a == null ? void 0 : a.valueOf()) - (b == null ? void 0 : b.valueOf());
             }) : [startTime, endTime];
-            const start = `${startDate} ${sTime.format(TIME_FORMAT)}`;
-            const end = `${endDate} ${eTime.format(TIME_FORMAT)}`;
+            const start = `${formatDate(startDate)} ${sTime.format(TIME_FORMAT)}`;
+            const end = `${formatDate(endDate)} ${eTime.format(TIME_FORMAT)}`;
             let errorList = [];
             let message = "";
             rules == null ? void 0 : rules.some((item) => {

package/lib/DateRanger/Ranger.js

@@ -230,7 +230,7 @@ var Ranger = import_react.default.forwardRef((props, ref) => {
   return /* @__PURE__ */ import_react.default.createElement(
     import_design.Space,
     {
-      className: (0, import_classnames.default)({
+      className: (0, import_classnames.default)(rest.className, {
         [prefix]: true,
         [`${prefix}-show-range`]: true,
         [`${prefix}-back-radio-focused`]: backRadioFocused
@@ -358,7 +358,7 @@ var Ranger = import_react.default.forwardRef((props, ref) => {
             allowClear: false,
             size,
             suffixIcon: null,
-            ...(0, import_lodash.omit)(rest, "value", "onChange"),
+            ...(0, import_lodash.omit)(rest, "value", "onChange", "style", "className"),
             open: false
           }
         )

package/lib/Dialog/Anchor.d.ts

@@ -15,5 +15,5 @@ export declare class Anchor extends React.Component<IAnchorProps> {
     onDragStart: (event: PointerEvent) => void;
     onDragMove: (event: PointerEvent) => void;
     onDragEnd: (event: PointerEvent) => void;
-    render(): import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+    render(): import("@emotion/react/jsx-runtime").JSX.Element;
 }

package/lib/Dialog/EventProxy.d.ts

@@ -1,2 +1,2 @@
 import type { HTMLAttributes } from 'react';
-export declare const EventProxy: (props: HTMLAttributes<HTMLDivElement>) => import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+export declare const EventProxy: (props: HTMLAttributes<HTMLDivElement>) => import("@emotion/react/jsx-runtime").JSX.Element;

package/lib/Highlight/DiffView/DiffCells.d.ts

@@ -14,4 +14,4 @@ export interface DiffCellsProps {
     onMouseDown?: React.MouseEventHandler;
     hashId?: string;
 }
-export default function DiffCells({ diffPrefixCls, data, emptyText, width, lock, rowOffset, onMouseDown, hashId, }: DiffCellsProps): import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+export default function DiffCells({ diffPrefixCls, data, emptyText, width, lock, rowOffset, onMouseDown, hashId, }: DiffCellsProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/lib/Highlight/HighlightCell.d.ts

@@ -15,4 +15,4 @@ export interface HighlightCellProps {
     lineNumber?: boolean;
     hashId?: string;
 }
-export default function HighlightCell({ prefixCls, theme, data, emptyText, width, lock, lineNumber, onMouseDown, hashId, }: HighlightCellProps): import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+export default function HighlightCell({ prefixCls, theme, data, emptyText, width, lock, lineNumber, onMouseDown, hashId, }: HighlightCellProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/lib/Highlight/JsonView.d.ts

@@ -3,5 +3,5 @@ import './index.less';
 export interface JsonViewProps extends HighlightProps {
     json: object;
 }
-declare const _default: ({ json, theme, style, className, height, onCopyChange, copyable, }: JsonViewProps) => import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+declare const _default: ({ json, theme, style, className, height, onCopyChange, copyable, }: JsonViewProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default _default;

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" | "go" | "java" | "python" | "sql" | "json" | "javascript" | "typescript" | "groovy" | "bash" | "cpp" | "http" | "markdown" | "nginx" | "xml" | "dockerfile" | "yaml" | "solidity" | "tsx" | "jsx")[];
+declare const supportedLanguages: ("ruby" | "go" | "css" | "java" | "json" | "bash" | "javascript" | "typescript" | "groovy" | "python" | "cpp" | "http" | "markdown" | "nginx" | "sql" | "xml" | "dockerfile" | "yaml" | "solidity" | "tsx" | "jsx")[];
 export type LanguageType = (typeof supportedLanguages)[number] | 'html';
 export interface HighlightProps extends LocaleWrapperProps {
     /**

package/lib/IconFont/index.d.ts

@@ -8,5 +8,5 @@ export interface IconFontProps {
 /**
  * @deprecated Please use `@oceanbase/icons` instead.
  */
-declare const IconFont: (props: IconFontProps) => import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+declare const IconFont: (props: IconFontProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default IconFont;

package/lib/Login/LoginForm.d.ts

@@ -1,4 +1,5 @@
-import type { FormProps } from '@oceanbase/design/es/form';
+import type { FormProps, InputProps } from '@oceanbase/design';
+import type { PasswordProps } from '@oceanbase/design/es/input';
 import React from 'react';
 import type { LoginLocale } from '.';
 import './index.less';
@@ -15,6 +16,12 @@ export interface ILoginFormProps extends FormProps {
     authCodeImg?: string;
     otherLoginProps?: any;
     onAuthCodeImgChange?: () => void;
+    passwordOptional?: boolean;
+    componentProps?: {
+        username: InputProps;
+        password: PasswordProps;
+        authCode: InputProps;
+    };
 }
 declare const Login: React.FC<ILoginFormProps>;
 export default Login;

package/lib/Login/LoginForm.js

@@ -49,6 +49,8 @@ var Login = ({
   authCodeImg,
   otherLoginProps,
   onAuthCodeImgChange,
+  componentProps,
+  passwordOptional = false,
   ...restProps
 }) => {
   const { token } = import_design2.theme.useToken();
@@ -88,7 +90,8 @@ var Login = ({
           },
           className: (0, import_classnames.default)({
             [`${prefix}-focus-input`]: focusInput === "username"
-          })
+          }),
+          ...(componentProps == null ? void 0 : componentProps.username) || {}
         }
       )
     ),
@@ -96,7 +99,7 @@ var Login = ({
       import_design.Form.Item,
       {
         name: "password",
-        rules: [
+        rules: passwordOptional ? [] : [
           {
             required: true,
             message: locale.passwordMessage
@@ -116,7 +119,8 @@ var Login = ({
           onBlur: () => {
             setFocusInput("");
           },
-          className: focusInput === "password" ? `${prefix}-focus-input` : ""
+          className: focusInput === "password" ? `${prefix}-focus-input` : "",
+          ...(componentProps == null ? void 0 : componentProps.password) || {}
         }
       )
     ),
@@ -144,7 +148,8 @@ var Login = ({
           },
           className: (0, import_classnames.default)({
             [`${prefix}-focus-input`]: focusInput === "authCode"
-          })
+          }),
+          ...(componentProps == null ? void 0 : componentProps.authCode) || {}
         }
       )
     ), /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(`${prefix}-code-btn`) }, /* @__PURE__ */ import_react.default.createElement("img", { src: authCodeImg, alt: "", width: "96", height: "38" }), /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}-code-mask`, onClick: onAuthCodeImgChange }, /* @__PURE__ */ import_react.default.createElement(import_icons.SyncOutlined, null)))),

package/lib/Login/index.less

@@ -102,7 +102,7 @@
           }
 
           // 覆盖 input:-internal-autofill-selected 自带背景色样式问题
-          .@{prefixCls}-input {
+          .@{prefixCls}-input:not(.@{prefixCls}-input-disabled) {
             box-shadow: inset 0 0 0 1000px white !important;
           }
 

package/lib/NavMenu/index.d.ts

@@ -15,5 +15,5 @@ export interface NavMenuProps {
     className?: string;
     style?: React.CSSProperties;
 }
-declare const _default: (props: NavMenuProps) => import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+declare const _default: (props: NavMenuProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default _default;

package/lib/PageContainer/ItemRender.d.ts

@@ -3,5 +3,5 @@ declare const _default: ({ route, params, routes, paths }: {
     params: any;
     routes: any;
     paths: any;
-}) => import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+}) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default _default;

package/lib/ProCard/index.js

@@ -35,6 +35,7 @@ module.exports = __toCommonJS(ProCard_exports);
 var import_react = __toESM(require("react"));
 var import_pro_components = require("@ant-design/pro-components");
 var import_design = require("@oceanbase/design");
+var import_util = require("@oceanbase/design/es/_util");
 var import_classnames = __toESM(require("classnames"));
 var import_style = __toESM(require("./style"));
 var ProCard = ({
@@ -50,12 +51,11 @@ var ProCard = ({
   const { getPrefixCls } = (0, import_react.useContext)(import_design.ConfigProvider.ConfigContext);
   const prefixCls = getPrefixCls("pro-card", customizePrefixCls);
   const { wrapSSR } = (0, import_style.default)(prefixCls);
-  const zeroPaddingList = [0, "0", "0px"];
-  const noBodyPadding = zeroPaddingList.includes(bodyStyle == null ? void 0 : bodyStyle.padding) || ghost;
+  const noBodyHorizontalPadding = (0, import_util.isHorizontalPaddingZero)(bodyStyle == null ? void 0 : bodyStyle.padding) || ghost;
   const proCardCls = (0, import_classnames.default)(
     {
       [`${prefixCls}-has-title`]: !!title,
-      [`${prefixCls}-no-body-padding`]: noBodyPadding,
+      [`${prefixCls}-no-body-horizontal-padding`]: noBodyHorizontalPadding,
       [`${prefixCls}-no-divider`]: !headerBordered,
       [`${prefixCls}-contain-tabs`]: !!tabs
     },

package/lib/ProCard/style/index.js

@@ -27,6 +27,7 @@ var import_design = require("@oceanbase/design");
 var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
 var genProCardStyle = (token) => {
   const { componentCls, antCls, prefixCls } = token;
+  const tableComponentCls = `${antCls}-table`;
   const tabsComponentCls = `${antCls}-tabs`;
   const tabsPrefixCls = `${prefixCls}-tabs`;
   return {
@@ -58,15 +59,23 @@ var genProCardStyle = (token) => {
         paddingInline: 0
       }
     },
-    // no body padding card
-    [`${componentCls}${componentCls}-no-body-padding:not(${componentCls}-contain-tabs)`]: {
+    // reduce margin between card title and table
+    [`&${componentCls}-has-title${componentCls}-no-divider:not(${componentCls}-contain-tabs)`]: {
+      [`${componentCls}-body`]: {
+        [`& > ${tableComponentCls}-wrapper ${tableComponentCls}:not(${tableComponentCls}-bordered):first-child`]: {
+          marginTop: -token.marginSM
+        }
+      }
+    },
+    // no body horizontal padding card
+    [`${componentCls}${componentCls}-no-body-horizontal-padding:not(${componentCls}-contain-tabs)`]: {
       [`${componentCls}-header`]: {
         paddingBlockEnd: token.padding
       },
       ...import_design.Card.genTableStyle(token.paddingLG, token)
     },
-    // no body padding small card
-    [`${componentCls}${componentCls}-no-body-padding${componentCls}-size-small:not(${componentCls}-contain-tabs)`]: {
+    // no body horizontal padding small card
+    [`${componentCls}${componentCls}-no-body-horizontal-padding${componentCls}-size-small:not(${componentCls}-contain-tabs)`]: {
       [`${componentCls}-header`]: {
         paddingBlockEnd: token.paddingXS
       },

package/lib/ProTable/index.d.ts

@@ -1,5 +1,10 @@
-import { ProTable as AntProTable } from '@ant-design/pro-components';
-import type { ProTableProps } from '@ant-design/pro-components';
-export { ProTableProps };
-declare const ProTable: typeof AntProTable;
+import React from 'react';
+import type { ProTableProps as AntProTableProps } from '@ant-design/pro-components';
+export interface ProTableProps<T, U, ValueType> extends AntProTableProps<T, U, ValueType> {
+    innerBordered?: boolean;
+}
+declare function ProTable<T, U, ValueType>({ form, headerTitle, options, optionsRender, toolbar, toolBarRender, size, bordered, innerBordered, expandable, rowSelection, pagination: customPagination, footer, locale, cardProps: outerCardProps, prefixCls: customizePrefixCls, tableClassName, className, ...restProps }: ProTableProps<T, U, ValueType>): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+declare namespace ProTable {
+    var Summary;
+}
 export default ProTable;

package/lib/ProTable/index.js

@@ -39,7 +39,7 @@ var import_classnames = __toESM(require("classnames"));
 var import_lodash = require("lodash");
 var import_style = __toESM(require("../LightFilter/style"));
 var import_style2 = __toESM(require("./style"));
-var ProTable = ({
+function ProTable({
   form,
   headerTitle,
   options,
@@ -47,6 +47,8 @@ var ProTable = ({
   toolbar,
   toolBarRender,
   size,
+  bordered,
+  innerBordered,
   expandable,
   rowSelection,
   pagination: customPagination,
@@ -57,7 +59,7 @@ var ProTable = ({
   tableClassName,
   className,
   ...restProps
-}) => {
+}) {
   const { getPrefixCls } = (0, import_react.useContext)(import_design.ConfigProvider.ConfigContext);
   const tablePrefixCls = getPrefixCls("table", customizePrefixCls);
   const { wrapSSR: tableWrapSSR } = import_design.Table.useStyle(tablePrefixCls);
@@ -66,7 +68,8 @@ var ProTable = ({
     {
       [`${tablePrefixCls}-expandable`]: !(0, import_lodash.isEmpty)(expandable),
       [`${tablePrefixCls}-selectable`]: !!rowSelection,
-      [`${tablePrefixCls}-has-footer`]: !!footer
+      [`${tablePrefixCls}-has-footer`]: !!footer,
+      [`${tablePrefixCls}-inner-bordered`]: innerBordered
     },
     tableClassName
   );
@@ -86,6 +89,7 @@ var ProTable = ({
           {
             defaultSize: "large",
             size,
+            bordered: bordered || innerBordered,
             form: {
               // query form should remove required mark
               requiredMark: false,
@@ -128,6 +132,6 @@ var ProTable = ({
       )
     )
   );
-};
+}
 ProTable.Summary = import_pro_components.ProTable.Summary;
 var ProTable_default = ProTable;

package/lib/Ranger/QuickPicker.d.ts

@@ -13,5 +13,5 @@ export interface QuickPickerProps extends LocaleWrapperProps {
     isMoment?: boolean;
     size?: 'small' | 'large' | 'middle';
 }
-declare const _default: (props: QuickPickerProps) => import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+declare const _default: (props: QuickPickerProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default _default;

package/lib/SideTip/Dragger.d.ts

@@ -41,6 +41,6 @@ declare class Draggable extends React.Component<DraggableProps, DraggableState>
     handleMouseDown: (e: any) => void;
     handleMouseMove: (e: any) => void;
     handleMouseUp: (e: any) => void;
-    render(): import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+    render(): import("@emotion/react/jsx-runtime").JSX.Element;
 }
 export default Draggable;

package/lib/SideTip/IconLoading.d.ts

@@ -1,2 +1,2 @@
-declare const iconLoading: (props: any) => import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+declare const iconLoading: (props: any) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default iconLoading;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oceanbase/ui",
-  "version": "0.4.11",
+  "version": "0.4.13",
   "description": "The UI library based on OceanBase Design",
   "keywords": [
     "oceanbase",
@@ -40,23 +40,23 @@
   },
   "dependencies": {
     "@ant-design/cssinjs": "^1.23.0",
-    "@ant-design/pro-components": "^2.8.5",
+    "@ant-design/pro-components": "^2.8.7",
     "@antv/g6": "3.4.10",
-    "@oceanbase/design": "^0.4.9",
-    "@oceanbase/icons": "^0.4.5",
+    "@oceanbase/design": "^0.4.10",
+    "@oceanbase/icons": "^0.4.6",
     "@oceanbase/util": "^0.4.2",
     "ahooks": "^2.10.14",
     "classnames": "^2.5.1",
     "dayjs": "^1.11.13",
     "diff": "^5.2.0",
-    "highlight.js": "^11.10.0",
+    "highlight.js": "^11.11.1",
     "highlightjs-solidity": "^2.0.6",
     "hoist-non-react-statics": "^3.3.2",
     "lodash": "^4.17.21",
     "moment": "^2.30.1",
     "path-to-regexp": "^7.2.0",
     "randexp": "^0.5.3",
-    "rc-picker": "^4.11.1",
+    "rc-picker": "^4.11.3",
     "rc-util": "^5.44.4",
     "react-copy-to-clipboard": "^5.1.0",
     "react-json-view": "^1.21.3",
@@ -64,12 +64,12 @@
     "screenfull": "^6.0.2"
   },
   "devDependencies": {
-    "@ant-design/pro-form": "^2.31.5",
-    "@ant-design/pro-layout": "^7.22.2"
+    "@ant-design/pro-form": "^2.31.7",
+    "@ant-design/pro-layout": "^7.22.4"
   },
   "peerDependencies": {
     "react": ">=16.9.0",
     "react-dom": ">=16.9.0"
   },
-  "gitHead": "94fed4fc95ce62f539ccc9f6c57a746d4a5e0f57"
+  "gitHead": "84305961875cebaf02361d907dc1db3a1871d1f5"
 }