From e0be38aec44f65b0b82780c8aa2abcbe0846fa1f Mon Sep 17 00:00:00 2001
From: CharlesLuk <792281365@qq.com>
Date: Thu, 11 May 2023 18:54:49 +0800
Subject: [PATCH] =?UTF-8?q?feat(tabs):=20=E6=94=AF=E6=8C=81className=20?=
 =?UTF-8?q?=E5=92=8C=20style=20=E7=BB=84=E4=BB=B6=E5=8F=82=E6=95=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/tabs/Tabs.tsx | 12 +++++++++---
 src/tabs/tabs.md  |  2 ++
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/tabs/Tabs.tsx b/src/tabs/Tabs.tsx
index 516a0a9d..edbb19f4 100644
--- a/src/tabs/Tabs.tsx
+++ b/src/tabs/Tabs.tsx
@@ -1,12 +1,17 @@
-import React, { FC, useEffect, useRef, useState } from 'react';
+import React, { FC, HTMLAttributes, useEffect, useRef, useState } from 'react';
 import classnames from 'classnames';
 import useConfig from '../_util/useConfig';
 import { TdTabsProps } from './type';
 import TabPanel from './TabPanel';
 import TabContext from './context';
 
-const Tabs: FC<TdTabsProps> = (props) => {
+type TabsHTMLAttrs = Pick<HTMLAttributes<HTMLDivElement>, 'className' | 'style'>;
+export interface TabsProps extends TdTabsProps, TabsHTMLAttrs {}
+
+const Tabs: FC<TabsProps> = (props) => {
   const {
+    className = '',
+    style,
     children,
     content,
     defaultValue = '',
@@ -104,11 +109,12 @@ const Tabs: FC<TdTabsProps> = (props) => {
   return (
     <div
       className={classnames(
-        `${tabPrefix}-tabs`,
+        [`${tabPrefix}-tabs`, className],
         size === 'large' && `${tabPrefix}-size-l`,
         size === 'small' && `${tabPrefix}-size-s`,
         placement && `${tabPrefix}-is-${placement}`,
       )}
+      style={style}
     >
       <div ref={wrapRef} className={classnames(`${tabPrefix}-tabs__nav `, `${tabPrefix}-is-scrollable `)}>
         <div className={classnames(`${tabPrefix}-tabs__nav-wrap`, `${tabPrefix}-tabs__nav-container`)}>
diff --git a/src/tabs/tabs.md b/src/tabs/tabs.md
index ede42b27..82a3b7b7 100644
--- a/src/tabs/tabs.md
+++ b/src/tabs/tabs.md
@@ -6,6 +6,8 @@
 
 名称 | 类型 | 默认值 | 说明 | 必传
 -- | -- | -- | -- | --
+className | String | - | 类名 | N
+style | Object | - | 样式，TS 类型：`React.CSSProperties` | N
 list | Array | - | 选项卡列表 | N
 animation | Object | - | 动画效果设置{transition-timing-function, transition-duration}。 | N
 placement | String | top | 选项卡位置，可选值'left'\|'right'\|'top'\|'bottom' | N