@oceanbase/design 0.4.16 → 1.0.0-alpha.1

package/lib/_util/genStyle.js

@@ -19,8 +19,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/_util/genStyle.ts
 var genStyle_exports = {};
 __export(genStyle_exports, {
-  genCompactStyle: () => genCompactStyle,
-  genLargeStyle: () => genLargeStyle
+  genCompactStyle: () => genCompactStyle
 });
 module.exports = __toCommonJS(genStyle_exports);
 var genCompactStyle = (componentCls, subComponentCls = "") => {
@@ -38,122 +37,7 @@ var genCompactStyle = (componentCls, subComponentCls = "") => {
     }
   };
 };
-var genLargeStyle = (token) => {
-  const {
-    antCls,
-    iconCls,
-    fontSize,
-    lineWidth,
-    borderRadiusLG,
-    controlHeight,
-    controlHeightSM,
-    controlHeightLG
-  } = token;
-  const height = controlHeightLG;
-  const lineHeight = `${controlHeightLG}px`;
-  return {
-    // Button
-    [`${antCls}-btn`]: {
-      // limit min width for icon button
-      minWidth: controlHeightLG,
-      height,
-      fontSize,
-      borderRadius: borderRadiusLG,
-      // Button in Space.Compact
-      ...genCompactStyle(`${antCls}-btn`)
-    },
-    // Radio.Button
-    [`${antCls}-radio-group`]: {
-      [`${antCls}-radio-button-wrapper`]: {
-        height,
-        lineHeight: `${height - lineWidth * 2}px`,
-        fontSize,
-        [`&:first-child`]: {
-          borderStartStartRadius: borderRadiusLG,
-          borderEndStartRadius: borderRadiusLG
-        },
-        [`&:last-child`]: {
-          borderStartEndRadius: borderRadiusLG,
-          borderEndEndRadius: borderRadiusLG
-        }
-      }
-    },
-    // Select
-    [`${antCls}-select`]: {
-      height,
-      fontSize,
-      // Select in Space.Compact
-      ...genCompactStyle(`${antCls}-select`, `${antCls}-select-selector`),
-      [`${antCls}-select-selector`]: {
-        borderRadius: borderRadiusLG
-      },
-      [`${antCls}-select-selection-item`]: {
-        fontSize
-      }
-    },
-    [`${antCls}-select-multiple ${antCls}-select-selection-wrap`]: {
-      // ref: https://github.com/oceanbase/oceanbase-design/pull/881
-      height: "100%"
-    },
-    // Input
-    [`${antCls}-input-wrapper`]: {
-      fontSize,
-      [`${iconCls}`]: {
-        fontSize
-      },
-      [`${antCls}-input-affix-wrapper`]: {
-        borderStartEndRadius: 0,
-        borderEndEndRadius: 0
-      }
-    },
-    [`${antCls}-input-affix-wrapper`]: {
-      height,
-      borderRadius: borderRadiusLG,
-      [`&:not(${antCls}-input-affix-wrapper-lg)`]: {
-        lineHeight: `${controlHeight - lineWidth * 2}px`
-      },
-      // avoid to conflict with `${antCls}-input-affix-wrapper` height
-      [`${antCls}-input`]: {
-        height: `${controlHeight - lineWidth * 2}px`
-      },
-      [`${antCls}-input-lg`]: {
-        height: controlHeightSM
-      },
-      [`${antCls}-input-sm`]: {
-        height: `${controlHeightLG - lineWidth * 2}px`
-      }
-    },
-    [`${antCls}-input`]: {
-      height,
-      fontSize,
-      borderRadius: borderRadiusLG,
-      // Input in Space.Compact
-      ...genCompactStyle(`${antCls}-input`)
-    },
-    [`${antCls}-input-search-button`]: {
-      height,
-      lineHeight,
-      borderStartEndRadius: borderRadiusLG,
-      borderEndEndRadius: borderRadiusLG
-    },
-    [`${antCls}-input-group-addon`]: {
-      fontSize,
-      borderStartEndRadius: borderRadiusLG,
-      borderEndEndRadius: borderRadiusLG
-    },
-    // set large DatePicker, TimePicker and RangePicker style
-    [`${antCls}-picker`]: {
-      height,
-      borderRadius: borderRadiusLG,
-      ...genCompactStyle(`${antCls}-picker`),
-      [`${antCls}-picker-input>input`]: {
-        fontSize
-      }
-    }
-  };
-};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  genCompactStyle,
-  genLargeStyle
+  genCompactStyle
 });

package/lib/badge/style/index.js

@@ -43,7 +43,6 @@ var genBadgeStyle = (token) => {
       },
       // icon style
       [`${componentCls}-status-icon`]: {
-        fontSize: token.fontSizeSM,
         // remove dot style
         backgroundColor: "transparent",
         ["&::after"]: {

package/lib/button/style/index.js

@@ -25,43 +25,7 @@ __export(style_exports, {
 module.exports = __toCommonJS(style_exports);
 var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
 var genButtonStyle = (token) => {
-  const { componentCls } = token;
-  const primaryBtnCls = `${componentCls}${componentCls}-primary:not([disabled]):not(${componentCls}-disabled):not(${componentCls}-dangerous):not(${componentCls}-background-ghost)`;
-  const primaryAndCompactItemBtnCls = `${componentCls}-compact-item${primaryBtnCls}`;
-  return {
-    [`${componentCls}`]: {
-      // remove box-shadow for button
-      boxShadow: "none !important"
-    },
-    // primary button
-    [`${primaryBtnCls}`]: {
-      background: "linear-gradient(-59deg, #002BFF 0%, #0080FF 100%)",
-      border: "none",
-      ["&:hover"]: {
-        background: "linear-gradient(120deg, #1AA0FF 0%, #1A53FF 100%)"
-      },
-      ["&:active"]: {
-        background: "linear-gradient(120deg, #0060E6 0%, #0013E6 100%)"
-      }
-    },
-    // primary button in compact item
-    [`${primaryBtnCls}${componentCls}-compact-last-item`]: {
-      background: "linear-gradient(-59deg, #002BFF 0%, #002BFF 100%)",
-      ["&:hover"]: {
-        background: "linear-gradient(120deg, #1AA0FF 0%, #1A53FF 100%)"
-      },
-      ["&:active"]: {
-        background: "linear-gradient(120deg, #0060E6 0%, #0013E6 100%)"
-      }
-    },
-    [`${primaryAndCompactItemBtnCls}+${primaryAndCompactItemBtnCls}:before`]: {
-      height: "100%",
-      top: 0
-    },
-    [`${primaryAndCompactItemBtnCls}:hover`]: {
-      zIndex: 0
-    }
-  };
+  return {};
 };
 var style_default = (prefixCls, isAliyun) => {
   const useStyle = (0, import_genComponentStyleHook.genComponentStyleHook)("Button", (token) => {

package/lib/card/style/index.js

@@ -67,7 +67,15 @@ var genCardStyle = (token) => {
     [`${componentCls}${componentCls}-no-divider`]: {
       [`${componentCls}-head`]: {
         // should not remove border-bottom to avoid tabs inkbar display correctly
-        borderBottomColor: "transparent"
+        borderBottomColor: "transparent",
+        // remove divider for top and bottom tabs
+        [tabsComponentCls]: {
+          [`&${tabsComponentCls}-top, &${tabsComponentCls}-bottom`]: {
+            [`${tabsComponentCls}-nav::before`]: {
+              border: "none"
+            }
+          }
+        }
       }
     },
     [`${componentCls}${componentCls}-no-divider:not(${componentCls}-contain-tabs)`]: {

package/lib/config-provider/index.js

@@ -111,14 +111,7 @@ var ConfigProvider = ({
       ),
       spin: (0, import_lodash.merge)({}, parentContext.spin, spin),
       table: (0, import_lodash.merge)({}, parentContext.table, table),
-      tabs: (0, import_lodash.merge)(
-        {},
-        {
-          indicatorSize: (origin) => origin >= 24 ? origin - 16 : origin
-        },
-        parentContext.tabs,
-        tabs
-      ),
+      tabs: (0, import_lodash.merge)({}, parentContext.tabs, tabs),
       theme: (0, import_lodash.merge)({}, mergedTheme, {
         token: (
           // custom fontFamily

package/lib/empty/style/index.js

@@ -24,7 +24,6 @@ __export(style_exports, {
 });
 module.exports = __toCommonJS(style_exports);
 var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
-var import_genStyle = require("../../_util/genStyle");
 var genEmptyStyle = (token) => {
   const { antCls, componentCls, colorTextTertiary, colorText, colorTextSecondary } = token;
   return {
@@ -87,10 +86,6 @@ var genEmptyStyle = (token) => {
             }
           }
         }
-      },
-      [`${componentCls}-footer`]: {
-        marginTop: token.marginLG,
-        ...(0, import_genStyle.genLargeStyle)(token)
       }
     },
     [`${componentCls}-horizontal`]: {

package/lib/form/FormItem.d.ts

@@ -9,6 +9,7 @@ declare const AntFormItem: (<Values = any>(props: AntFormItemProps<Values>) => R
         warnings: React.ReactNode[];
     };
 };
+export * from 'antd/es/form/FormItem';
 export type WrapperTooltipProps = Omit<TooltipProps, 'mouseFollow'> & {
     icon?: React.ReactElement;
 };

package/lib/form/FormItem.js

@@ -16,6 +16,7 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
 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-
@@ -40,6 +41,7 @@ var import_classnames = __toESM(require("classnames"));
 var import_config_provider = __toESM(require("../config-provider"));
 var import_useTooltipTypeList = require("../tooltip/hooks/useTooltipTypeList");
 var import_style = __toESM(require("./style"));
+__reExport(FormItem_exports, require("antd/es/form/FormItem"), module.exports);
 var AntFormItem = import_antd.Form.Item;
 var FormItem = ({
   children,
@@ -95,3 +97,7 @@ var FormItem = ({
 };
 FormItem.useStatus = AntFormItem.useStatus;
 var FormItem_default = FormItem;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("antd/es/form/FormItem")
+});

package/lib/index.d.ts

@@ -74,4 +74,3 @@ declare const useToken: () => {
 };
 export { useToken };
 export type { PresetStatusColorType } from 'antd/es/_util/colors';
-export { genLargeStyle } from './_util/genStyle';

package/lib/index.js

@@ -63,7 +63,6 @@ __export(src_exports, {
   Tooltip: () => import_tooltip.default,
   TreeSelect: () => import_tree_select.default,
   Typography: () => import_typography.default,
-  genLargeStyle: () => import_genStyle.genLargeStyle,
   message: () => import_static_function.message,
   notification: () => import_static_function.notification,
   theme: () => import_theme.default,
@@ -110,7 +109,6 @@ var import_badge = __toESM(require("./badge"));
 var import_lottie = __toESM(require("./lottie"));
 var import_theme = __toESM(require("./theme"));
 var import_theme2 = __toESM(require("./theme"));
-var import_genStyle = require("./_util/genStyle");
 var { useToken } = import_theme2.default;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
@@ -147,7 +145,6 @@ var { useToken } = import_theme2.default;
   Tooltip,
   TreeSelect,
   Typography,
-  genLargeStyle,
   message,
   notification,
   theme,

package/lib/result/style/index.js

@@ -24,7 +24,6 @@ __export(style_exports, {
 });
 module.exports = __toCommonJS(style_exports);
 var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
-var import_genStyle = require("../../_util/genStyle");
 var genResultStyle = (token) => {
   const { componentCls } = token;
   return {
@@ -38,9 +37,6 @@ var genResultStyle = (token) => {
         maxWidth: 600,
         margin: "0px auto"
       },
-      [`${componentCls}-extra`]: {
-        ...(0, import_genStyle.genLargeStyle)(token)
-      },
       [`${componentCls}-content`]: {
         maxWidth: 1e3,
         margin: "0px auto",

package/lib/table/style/index.js

@@ -72,21 +72,6 @@ var genTableStyle = (token) => {
       },
       // body 样式
       [`${componentCls}-tbody`]: {
-        // 斑马纹样式
-        [`tr:nth-child(2n + 1):not(${componentCls}-placeholder):not(${componentCls}-row-selected):not(${antCls}-descriptions-row) > td`]: {
-          backgroundColor: colorBgBase
-        },
-        [`tr:nth-child(2n):not(${componentCls}-placeholder):not(${componentCls}-row-selected):not(${componentCls}-expanded-row):not(${antCls}-descriptions-row) > td`]: {
-          backgroundColor: colorFillQuaternary
-        },
-        // hover 行样式
-        [`tr:not(${componentCls}-placeholder):not(${componentCls}-expanded-row):not(${antCls}-descriptions-row):hover > td`]: {
-          backgroundColor: `${colorPrimaryBg} !important`
-        },
-        // 选中行样式
-        [`tr${componentCls}-row-selected > td`]: {
-          backgroundColor: `${colorPrimaryBg} !important`
-        },
         [`${componentCls}-tbody-virtual-scrollbar ${componentCls}-tbody-virtual-scrollbar-thumb`]: {
           background: `${token.colorFillSecondary} !important`
         },
@@ -152,28 +137,8 @@ var genTableStyle = (token) => {
         }
       }
     },
-    // 滚动表格样式
-    // 由于滚动表格会在 tbody 下最前面多一个 tr 元素，因此需要设置相反的斑马条样式
-    // .ant-table-scroll-horizontal: 水平滚动
-    // .ant-table-fixed-header: 垂直滚动
-    [`${componentCls}-wrapper ${componentCls}${componentCls}-scroll-horizontal, ${componentCls}-wrapper ${componentCls}${componentCls}-fixed-header`]: {
-      [`${componentCls}-tbody`]: {
-        // 斑马纹样式
-        [`tr:nth-child(2n + 1):not(${componentCls}-placeholder):not(${componentCls}-row-selected):not(${antCls}-descriptions-row) > td`]: {
-          backgroundColor: colorFillQuaternary
-        },
-        [`tr:nth-child(2n):not(${componentCls}-placeholder):not(${componentCls}-row-selected):not(${componentCls}-expanded-row):not(${antCls}-descriptions-row) > td`]: {
-          backgroundColor: colorBgBase
-        }
-      }
-    },
     // 带边框的表格样式
     [`${componentCls}-wrapper ${componentCls}${componentCls}-bordered`]: {
-      [`${componentCls}-thead > tr`]: {
-        ["th"]: {
-          backgroundColor: colorFillQuaternary
-        }
-      },
       [`${componentCls}-footer`]: {
         borderRadius: `0px 0px ${token.borderRadiusLG}px ${token.borderRadiusLG}px`
       }
@@ -227,37 +192,15 @@ var genTableStyle = (token) => {
     //       },
     //     },
     //   },
-    // 非可展开表格、不带 footer 表格、非空表格、不带边框表格: 底部添加分隔线，并去掉底部圆角
+    // 非可展开表格、不带 footer 表格、非空表格、不带边框表格: 去掉底部圆角
     [`${componentCls}-wrapper:not(${componentCls}-expandable):not(${componentCls}-has-footer) ${componentCls}:not(${componentCls}-bordered):not(${componentCls}-empty)`]: {
-      borderBottom: `1px solid ${colorBorderSecondary}`,
       borderBottomLeftRadius: 0,
       borderBottomRightRadius: 0
     },
-    // 去掉非展开表格的边框
-    [`${componentCls}-wrapper:not(${componentCls}-expandable)`]: {
-      [`${componentCls}:not(${componentCls}-bordered)`]: {
-        [`${componentCls}-tbody`]: {
-          [`tr:not(${componentCls}-measure-row) > td`]: {
-            border: "none"
-          }
-        }
-      }
-    },
     // 可展开表格样式
     [`${componentCls}-wrapper${componentCls}-expandable`]: {
       [`${componentCls}`]: {
         [`${componentCls}-tbody`]: {
-          // 去掉斑马纹
-          [`tr:nth-child(n):not(${componentCls}-placeholder):not(${componentCls}-row-selected):not(${componentCls}-expanded-row)`]: {
-            ["& > td"]: {
-              backgroundColor: colorBgBase
-            },
-            ["&:hover"]: {
-              td: {
-                backgroundColor: colorPrimaryBg
-              }
-            }
-          },
           [`${componentCls}-expanded-row > td`]: {
             // 除内嵌子表格外，设置其他内嵌元素样式
             [`& > *:not(${componentCls}-wrapper):not(${componentCls}-expanded-row-fixed)`]: {

package/lib/tabs/index.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
-import type { TabsProps as AntTabsProps, TabsPosition as AntTabsPosition } from 'antd/es/tabs';
+import type { TabsProps as AntTabsProps, TabsPosition as AntTabsPosition, TabsRef } from 'antd/es/tabs';
 import type { Tab as AntTab } from 'rc-tabs/es/interface';
+import { genTabsStyle } from './style';
+import TabPane from './TabPane';
 import type { TabPaneProps } from './TabPane';
 import type { BadgeProps } from '../badge';
 export * from 'antd/es/tabs';
@@ -17,13 +19,13 @@ export type Tab = {
     badge?: BadgeType;
 } & (AntTab | AntTabOptional);
 export interface TabsProps extends Omit<AntTabsProps, 'items'> {
+    divider?: boolean;
     items?: Tab[];
 }
 export type TabsPosition = AntTabsPosition;
-declare const Tabs: {
-    ({ children, items, type, tabPosition, prefixCls: customizePrefixCls, className, ...restProps }: TabsProps): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
-    TabPane: React.FC<TabPaneProps>;
-    genTabsStyle: (token: Partial<import("./style").TabsToken>) => import("@ant-design/cssinjs").CSSObject;
-    displayName: string;
+type CompoundedComponent = React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<TabsRef>> & {
+    TabPane: typeof TabPane;
+    genTabsStyle: typeof genTabsStyle;
 };
+declare const Tabs: CompoundedComponent;
 export default Tabs;

package/lib/tabs/index.js

@@ -33,9 +33,9 @@ __export(tabs_exports, {
   default: () => tabs_default
 });
 module.exports = __toCommonJS(tabs_exports);
-var import_util = require("@oceanbase/util");
-var import_antd = require("antd");
 var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_util = require("@oceanbase/util");
 var import_classnames = __toESM(require("classnames"));
 var import_badge = __toESM(require("../badge"));
 var import_config_provider = __toESM(require("../config-provider"));
@@ -46,67 +46,73 @@ __reExport(tabs_exports, require("antd/es/tabs"), module.exports);
 var isReactNode = (item) => {
   return import_react.default.isValidElement(item);
 };
-var Tabs = ({
-  children,
-  items,
-  type,
-  tabPosition,
-  prefixCls: customizePrefixCls,
-  className,
-  ...restProps
-}) => {
-  const { getPrefixCls } = (0, import_react.useContext)(import_config_provider.default.ConfigContext);
-  const prefixCls = getPrefixCls("tabs", customizePrefixCls);
-  const { wrapSSR } = (0, import_style.default)(prefixCls);
-  const tabsCls = (0, import_classnames.default)(className);
-  const isHorizontal = !tabPosition || tabPosition === "top" || tabPosition === "bottom";
-  const dividerList = (items == null ? void 0 : items.filter((item) => item.divider)) || [];
-  const renderBadge = (0, import_react.useCallback)(
-    (badge) => {
-      if (typeof badge === "object" && !isReactNode(badge)) {
-        return /* @__PURE__ */ import_react.default.createElement(import_badge.default, { ...badge, className: (0, import_classnames.default)(`${prefixCls}-tab-badge`, badge.className) });
+var Tabs = import_react.default.forwardRef(
+  ({
+    children,
+    divider = false,
+    items,
+    type,
+    tabPosition,
+    prefixCls: customizePrefixCls,
+    className,
+    ...restProps
+  }, ref) => {
+    const { getPrefixCls } = (0, import_react.useContext)(import_config_provider.default.ConfigContext);
+    const prefixCls = getPrefixCls("tabs", customizePrefixCls);
+    const { wrapSSR } = (0, import_style.default)(prefixCls);
+    const tabsCls = (0, import_classnames.default)(className, {
+      [`${prefixCls}-no-divider`]: !divider
+    });
+    const isHorizontal = !tabPosition || tabPosition === "top" || tabPosition === "bottom";
+    const dividerList = (items == null ? void 0 : items.filter((item) => item.divider)) || [];
+    const renderBadge = (0, import_react.useCallback)(
+      (badge) => {
+        if (typeof badge === "object" && !isReactNode(badge)) {
+          return /* @__PURE__ */ import_react.default.createElement(import_badge.default, { ...badge, className: (0, import_classnames.default)(`${prefixCls}-tab-badge`, badge.className) });
+        }
+        return /* @__PURE__ */ import_react.default.createElement(import_badge.default, { className: `${prefixCls}-tab-badge`, count: badge });
+      },
+      [prefixCls]
+    );
+    let newItems = (0, import_useLegacyItems.default)(items, children);
+    newItems = newItems == null ? void 0 : newItems.map((item) => {
+      if (!(0, import_util.isNullValue)(item.divider)) {
+        return {
+          ...item,
+          key: `divider-${dividerList == null ? void 0 : dividerList.indexOf(item)}`,
+          label: /* @__PURE__ */ import_react.default.createElement(
+            import_antd.Divider,
+            {
+              type: isHorizontal ? "vertical" : "horizontal",
+              className: `${prefixCls}-divider`
+            }
+          ),
+          disabled: true
+        };
+      } else if (!(0, import_util.isNullValue)(item.tag) || !(0, import_util.isNullValue)(item.badge)) {
+        return {
+          ...item,
+          label: /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { size: 4 }, item.label, item.badge && renderBadge(item.badge), !(0, import_util.isNullValue)(item.tag) && /* @__PURE__ */ import_react.default.createElement(import_antd.Tag, { bordered: false, className: `${prefixCls}-tab-tag` }, item.tag))
+        };
       }
-      return /* @__PURE__ */ import_react.default.createElement(import_badge.default, { className: `${prefixCls}-tab-badge`, count: badge });
-    },
-    [prefixCls]
-  );
-  let newItems = (0, import_useLegacyItems.default)(items, children);
-  newItems = newItems == null ? void 0 : newItems.map((item) => {
-    if (!(0, import_util.isNullValue)(item.divider)) {
-      return {
-        ...item,
-        key: `divider-${dividerList == null ? void 0 : dividerList.indexOf(item)}`,
-        label: /* @__PURE__ */ import_react.default.createElement(
-          import_antd.Divider,
-          {
-            type: isHorizontal ? "vertical" : "horizontal",
-            className: `${prefixCls}-divider`
-          }
-        ),
-        disabled: true
-      };
-    } else if (!(0, import_util.isNullValue)(item.tag) || !(0, import_util.isNullValue)(item.badge)) {
-      return {
-        ...item,
-        label: /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { size: 4 }, item.label, item.badge && renderBadge(item.badge), !(0, import_util.isNullValue)(item.tag) && /* @__PURE__ */ import_react.default.createElement(import_antd.Tag, { bordered: false, className: `${prefixCls}-tab-tag` }, item.tag))
-      };
-    }
-    return item;
-  });
-  return wrapSSR(
-    /* @__PURE__ */ import_react.default.createElement(
-      import_antd.Tabs,
-      {
-        items: newItems,
-        type,
-        tabPosition,
-        prefixCls: customizePrefixCls,
-        className: tabsCls,
-        ...restProps
-      }
-    )
-  );
-};
+      return item;
+    });
+    return wrapSSR(
+      /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Tabs,
+        {
+          ref,
+          items: newItems,
+          type,
+          tabPosition,
+          prefixCls: customizePrefixCls,
+          className: tabsCls,
+          ...restProps
+        }
+      )
+    );
+  }
+);
 Tabs.TabPane = import_TabPane.default;
 Tabs.genTabsStyle = import_style.genTabsStyle;
 if (process.env.NODE_ENV !== "production") {

package/lib/tabs/style/index.js

@@ -28,10 +28,12 @@ var genTabsStyle = (token) => {
   const { antCls, componentCls, colorInfo, colorInfoBg, colorTextSecondary, colorFillQuaternary } = token;
   return {
     [componentCls]: {
-      [`&${componentCls}-top, &${componentCls}-bottom`]: {
-        [`${componentCls}-nav::before`]: {
-          // 页签位置为 top 和 bottom 时，去掉分割线
-          border: "none"
+      [`&${componentCls}-no-divider`]: {
+        // divider prop work for top and bottom tabs
+        [`&${componentCls}-top, &${componentCls}-bottom`]: {
+          [`${componentCls}-nav::before`]: {
+            border: "none"
+          }
         }
       },
       [`${componentCls}-tab`]: {