From 4957534b545aaea91dcdb100ffcd1ef55de6a771 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9D=8E=E8=89=BA=E7=8F=85?= <l>
Date: Fri, 8 Jan 2021 11:48:17 +0800
Subject: [PATCH] feat(tabs): add centered tab bar style

---
 components/tabs/TabBar.tsx       | 3 +++
 components/tabs/style/index.less | 6 ++++++
 components/tabs/tabs.tsx         | 1 +
 3 files changed, 10 insertions(+)

diff --git a/components/tabs/TabBar.tsx b/components/tabs/TabBar.tsx
index d2184d10bd..ef7014692c 100644
--- a/components/tabs/TabBar.tsx
+++ b/components/tabs/TabBar.tsx
@@ -12,6 +12,7 @@ const TabBar = defineComponent({
   inheritAttrs: false,
   props: {
     prefixCls: PropTypes.string,
+    centered: PropTypes.looseBool.def(false),
     tabBarStyle: PropTypes.style,
     tabBarExtraContent: PropTypes.VNodeChild,
     type: PropTypes.oneOf(tuple('line', 'card', 'editable-card')),
@@ -29,6 +30,7 @@ const TabBar = defineComponent({
   },
   render() {
     const {
+      centered,
       tabBarStyle,
       animated = true,
       renderTabBar,
@@ -62,6 +64,7 @@ const TabBar = defineComponent({
     // Additional className for style usage
     const cls = {
       [this.$attrs.class as string]: this.$attrs.class,
+      [`${prefixCls}-centered-bar`]: centered,
       [`${prefixCls}-${tabPosition}-bar`]: true,
       [`${prefixCls}-${size}-bar`]: !!size,
       [`${prefixCls}-card-bar`]: type && type.indexOf('card') >= 0,
diff --git a/components/tabs/style/index.less b/components/tabs/style/index.less
index f632616aae..eac4aa3e77 100644
--- a/components/tabs/style/index.less
+++ b/components/tabs/style/index.less
@@ -243,6 +243,12 @@
     }
   }
 
+  .@{tab-prefix-cls}-centered-bar {
+    .@{tab-prefix-cls}-nav-wrap {
+      text-align: center;
+    }
+  }
+
   // Create an empty element to avoid margin collapsing
   // https://github.com/ant-design/ant-design/issues/18103
   &-content::before {
diff --git a/components/tabs/tabs.tsx b/components/tabs/tabs.tsx
index 109b38b7c7..8133167265 100644
--- a/components/tabs/tabs.tsx
+++ b/components/tabs/tabs.tsx
@@ -28,6 +28,7 @@ export default defineComponent({
     activeKey: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     defaultActiveKey: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     hideAdd: PropTypes.looseBool.def(false),
+    centered: PropTypes.looseBool.def(false),
     tabBarStyle: PropTypes.object,
     tabBarExtraContent: PropTypes.any,
     destroyInactiveTabPane: PropTypes.looseBool.def(false),