@douyinfe/semi-ui 2.27.0-alpha.2 → 2.27.0-beta.0

package/lib/cjs/button/Button.d.ts

@@ -48,7 +48,7 @@ export default class Button extends PureComponent<ButtonProps> {
         prefixCls: PropTypes.Requireable<string>;
         style: PropTypes.Requireable<object>;
         size: PropTypes.Requireable<"default" | "small" | "large">;
-        type: PropTypes.Requireable<"warning" | "primary" | "secondary" | "tertiary" | "danger">;
+        type: PropTypes.Requireable<"warning" | "primary" | "tertiary" | "secondary" | "danger">;
         block: PropTypes.Requireable<boolean>;
         onClick: PropTypes.Requireable<(...args: any[]) => any>;
         onMouseDown: PropTypes.Requireable<(...args: any[]) => any>;

package/lib/cjs/button/index.d.ts

@@ -23,7 +23,7 @@ declare class Button extends React.PureComponent<ButtonProps> {
         onMouseLeave: import("prop-types").Requireable<(...args: any[]) => any>;
         disabled: import("prop-types").Requireable<boolean>;
         size: import("prop-types").Requireable<"default" | "small" | "large">;
-        type: import("prop-types").Requireable<"warning" | "primary" | "secondary" | "tertiary" | "danger">;
+        type: import("prop-types").Requireable<"warning" | "primary" | "tertiary" | "secondary" | "danger">;
         block: import("prop-types").Requireable<boolean>;
         onClick: import("prop-types").Requireable<(...args: any[]) => any>;
         onMouseDown: import("prop-types").Requireable<(...args: any[]) => any>;

package/lib/cjs/carousel/index.d.ts

@@ -14,7 +14,7 @@ export interface CarouselState {
 declare class Carousel extends BaseComponent<CarouselProps, CarouselState> {
     static propTypes: {
         activeIndex: PropTypes.Requireable<number>;
-        animation: PropTypes.Requireable<"fade" | "slide">;
+        animation: PropTypes.Requireable<"slide" | "fade">;
         arrowProps: PropTypes.Requireable<object>;
         autoPlay: PropTypes.Requireable<NonNullable<boolean | object>>;
         className: PropTypes.Requireable<string>;

package/lib/cjs/datePicker/dateInput.d.ts

@@ -26,7 +26,7 @@ export default class DateInput extends BaseComponent<DateInputProps, {}> {
         onFocus: PropTypes.Requireable<(...args: any[]) => any>;
         value: PropTypes.Requireable<any[]>;
         disabled: PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
+        type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
         showClear: PropTypes.Requireable<boolean>;
         format: PropTypes.Requireable<string>;
         inputStyle: PropTypes.Requireable<object>;

package/lib/cjs/datePicker/datePicker.d.ts

@@ -46,7 +46,7 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
         'aria-invalid': PropTypes.Requireable<boolean>;
         'aria-labelledby': PropTypes.Requireable<string>;
         'aria-required': PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
+        type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
         size: PropTypes.Requireable<"default" | "small" | "large">;
         clearIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         density: PropTypes.Requireable<"default" | "compact">;

package/lib/cjs/datePicker/monthsGrid.d.ts

@@ -19,7 +19,7 @@ export interface MonthsGridProps extends MonthsGridFoundationProps, BaseProps {
 export declare type MonthsGridState = MonthsGridFoundationState;
 export default class MonthsGrid extends BaseComponent<MonthsGridProps, MonthsGridState> {
     static propTypes: {
-        type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
+        type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
         defaultValue: PropTypes.Requireable<NonNullable<string | number | object>>;
         defaultPickerValue: PropTypes.Requireable<NonNullable<string | number | object>>;
         multiple: PropTypes.Requireable<boolean>;

package/lib/cjs/form/baseForm.d.ts

@@ -135,7 +135,7 @@ declare class Form<Values extends Record<string, any> = any> extends BaseCompone
         preventScroll?: boolean;
         showRestTagsPopover?: boolean;
         restTagsPopoverProps?: import("../popover").PopoverProps;
-    } & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "getPopupContainer" | "motion" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay"> & React.RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
+    } & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "motion" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay"> & React.RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
     static Checkbox: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../checkbox").CheckboxProps & import("./interface").RCIncludeType>;
     static CheckboxGroup: React.ComponentType<import("utility-types").Subtract<import("../checkbox").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & React.RefAttributes<any>>;
     static Radio: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../radio").RadioProps & import("./interface").RCIncludeType>;

package/lib/cjs/form/field.d.ts

@@ -83,7 +83,7 @@ declare const FormSelect: import("react").ComponentType<import("utility-types").
     preventScroll?: boolean;
     showRestTagsPopover?: boolean;
     restTagsPopoverProps?: import("../popover").PopoverProps;
-} & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "getPopupContainer" | "motion" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay"> & import("react").RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
+} & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "motion" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay"> & import("react").RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
 declare const FormCheckboxGroup: import("react").ComponentType<import("utility-types").Subtract<import("../checkbox/checkboxGroup").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & import("react").RefAttributes<any>>;
 declare const FormCheckbox: import("react").ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../checkbox/checkbox").CheckboxProps & import("./interface").RCIncludeType>;
 declare const FormRadioGroup: import("react").ComponentType<import("utility-types").Subtract<import("../radio/radioGroup").RadioGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & import("react").RefAttributes<any>>;

package/lib/cjs/tabs/TabBar.d.ts

@@ -5,6 +5,7 @@ export interface TabBarState {
     endInd: number;
     rePosKey: number;
     startInd: number;
+    uuid: string;
 }
 export interface OverflowItem extends PlainTab {
     key: string;
@@ -25,8 +26,8 @@ declare class TabBar extends React.Component<TabBarProps, TabBarState> {
         closable: PropTypes.Requireable<boolean>;
         deleteTabItem: PropTypes.Requireable<(...args: any[]) => any>;
     };
-    uuid: string;
     constructor(props: TabBarProps);
+    componentDidMount(): void;
     renderIcon(icon: ReactNode): ReactNode;
     renderExtra(): ReactNode;
     handleItemClick: (itemKey: string, e: MouseEvent<Element>) => void;

package/lib/cjs/tabs/TabBar.js

@@ -27,8 +27,6 @@ var _semiIcons = require("@douyinfe/semi-icons");
 
 var _uuid = require("@douyinfe/semi-foundation/lib/cjs/utils/uuid");
 
-var _TabItem = _interopRequireDefault(require("./TabItem"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 var __rest = void 0 && (void 0).__rest || function (s, e) {
@@ -53,7 +51,7 @@ class TabBar extends _react.default.Component {
         const key = this._getItemKey(itemKey); // eslint-disable-next-line max-len
 
 
-        const tabItem = document.querySelector("[data-uuid=\"".concat(this.uuid, "\"] .").concat(_constants.cssClasses.TABS_TAB, "[data-scrollkey=\"").concat(key, "\"]"));
+        const tabItem = document.querySelector("[data-uuid=\"".concat(this.state.uuid, "\"] .").concat(_constants.cssClasses.TABS_TAB, "[data-scrollkey=\"").concat(key, "\"]"));
         tabItem.scrollIntoView({
           behavior: 'smooth',
           block: 'nearest',
@@ -70,23 +68,45 @@ class TabBar extends _react.default.Component {
       const {
         size,
         type,
-        deleteTabItem,
-        handleKeyDown,
-        tabPosition
+        deleteTabItem
       } = this.props;
+      const panelIcon = panel.icon ? this.renderIcon(panel.icon) : null;
+      const closableIcon = type === 'card' && panel.closable ? /*#__PURE__*/_react.default.createElement(_semiIcons.IconClose, {
+        "aria-label": "Close",
+        role: "button",
+        className: "".concat(_constants.cssClasses.TABS_TAB, "-icon-close"),
+        onClick: e => deleteTabItem(panel.itemKey, e)
+      }) : null;
+      let events = {};
+      const key = panel.itemKey;
+
+      if (!panel.disabled) {
+        events = {
+          onClick: e => this.handleItemClick(key, e)
+        };
+      }
 
-      const isSelected = this._isActive(panel.itemKey);
-
-      return /*#__PURE__*/_react.default.createElement(_TabItem.default, Object.assign({}, panel, {
-        key: this._getItemKey(panel.itemKey),
-        selected: isSelected,
-        size: size,
-        type: type,
-        tabPosition: tabPosition,
-        handleKeyDown: handleKeyDown,
-        deleteTabItem: deleteTabItem,
-        onClick: this.handleItemClick
-      }));
+      const isSelected = this._isActive(key);
+
+      const className = (0, _classnames.default)(_constants.cssClasses.TABS_TAB, {
+        [_constants.cssClasses.TABS_TAB_ACTIVE]: isSelected,
+        [_constants.cssClasses.TABS_TAB_DISABLED]: panel.disabled,
+        ["".concat(_constants.cssClasses.TABS_TAB, "-small")]: size === 'small',
+        ["".concat(_constants.cssClasses.TABS_TAB, "-medium")]: size === 'medium'
+      });
+      return /*#__PURE__*/_react.default.createElement("div", Object.assign({
+        role: "tab",
+        id: "semiTab".concat(key),
+        "data-tabkey": "semiTab".concat(key),
+        "aria-controls": "semiTabPanel".concat(key),
+        "aria-disabled": panel.disabled ? 'true' : 'false',
+        "aria-selected": isSelected ? 'true' : 'false',
+        tabIndex: isSelected ? 0 : -1,
+        onKeyDown: e => this.handleKeyDown(e, key, panel.closable)
+      }, events, {
+        className: className,
+        key: this._getItemKey(key)
+      }), panelIcon, panel.tab, closableIcon);
     };
 
     this.renderTabComponents = list => list.map(panel => this.renderTabItem(panel));
@@ -101,7 +121,7 @@ class TabBar extends _react.default.Component {
       const key = this._getItemKey(lastItem.itemKey); // eslint-disable-next-line max-len
 
 
-      const tabItem = document.querySelector("[data-uuid=\"".concat(this.uuid, "\"] .").concat(_constants.cssClasses.TABS_TAB, "[data-scrollkey=\"").concat(key, "\"]"));
+      const tabItem = document.querySelector("[data-uuid=\"".concat(this.state.uuid, "\"] .").concat(_constants.cssClasses.TABS_TAB, "[data-scrollkey=\"").concat(key, "\"]"));
       tabItem.scrollIntoView({
         behavior: 'smooth',
         block: 'nearest',
@@ -205,9 +225,15 @@ class TabBar extends _react.default.Component {
     this.state = {
       endInd: props.list.length,
       rePosKey: 0,
-      startInd: 0
+      startInd: 0,
+      uuid: ''
     };
-    this.uuid = (0, _uuid.getUuidv4)();
+  }
+
+  componentDidMount() {
+    this.setState({
+      uuid: (0, _uuid.getUuidv4)()
+    });
   }
 
   renderIcon(icon) {
@@ -269,7 +295,7 @@ class TabBar extends _react.default.Component {
       className: classNames,
       style: style
     }, (0, _getDataAttr.default)(restProps), {
-      "data-uuid": this.uuid
+      "data-uuid": this.state.uuid
     }), contents, extra);
   }
 

package/lib/cjs/tabs/index.d.ts

@@ -1,4 +1,4 @@
-import React, { MouseEvent, ReactElement, ReactNode, RefCallback, RefObject } from 'react';
+import { MouseEvent, ReactElement, ReactNode, RefCallback, RefObject } from 'react';
 import PropTypes from 'prop-types';
 import TabsFoundation, { TabsAdapter } from '@douyinfe/semi-foundation/lib/cjs/tabs/foundation';
 import BaseComponent from '../_base/baseComponent';
@@ -14,7 +14,6 @@ export interface TabsState {
 }
 declare class Tabs extends BaseComponent<TabsProps, TabsState> {
     static TabPane: typeof TabPane;
-    static TabItem: React.ForwardRefExoticComponent<import("./TabItem").TabItemProps & React.RefAttributes<HTMLDivElement>>;
     static propTypes: {
         activeKey: PropTypes.Requireable<string>;
         className: PropTypes.Requireable<string>;

package/lib/cjs/tabs/index.js

@@ -32,8 +32,6 @@ var _TabBar = _interopRequireDefault(require("./TabBar"));
 
 var _TabPane = _interopRequireDefault(require("./TabPane"));
 
-var _TabItem = _interopRequireDefault(require("./TabItem"));
-
 var _tabsContext = _interopRequireDefault(require("./tabs-context"));
 
 var _interface = require("./interface");
@@ -381,7 +379,6 @@ class Tabs extends _baseComponent.default {
 }
 
 Tabs.TabPane = _TabPane.default;
-Tabs.TabItem = _TabItem.default;
 Tabs.propTypes = {
   activeKey: _propTypes.default.string,
   className: _propTypes.default.string,

package/lib/cjs/typography/base.d.ts

@@ -64,7 +64,7 @@ export default class Base extends Component<BaseTypographyProps, BaseTypographyS
         spacing: PropTypes.Requireable<"normal" | "extended">;
         strong: PropTypes.Requireable<boolean>;
         size: PropTypes.Requireable<"small" | "normal">;
-        type: PropTypes.Requireable<"warning" | "success" | "primary" | "secondary" | "tertiary" | "danger" | "quaternary">;
+        type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;
         icon: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;

package/lib/cjs/typography/numeral.d.ts

@@ -38,7 +38,7 @@ export default class Numeral extends PureComponent<NumeralProps> {
         underline: PropTypes.Requireable<boolean>;
         link: PropTypes.Requireable<NonNullable<boolean | object>>;
         strong: PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"warning" | "success" | "primary" | "secondary" | "tertiary" | "danger" | "quaternary">;
+        type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
         size: PropTypes.Requireable<"small" | "normal">;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;

package/lib/cjs/typography/paragraph.d.ts

@@ -29,7 +29,7 @@ export default class Paragraph extends PureComponent<ParagraphProps> {
         link: PropTypes.Requireable<NonNullable<boolean | object>>;
         underline: PropTypes.Requireable<boolean>;
         strong: PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"warning" | "success" | "primary" | "secondary" | "tertiary" | "danger" | "quaternary">;
+        type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
         size: PropTypes.Requireable<"small" | "normal">;
         spacing: PropTypes.Requireable<"normal" | "extended">;
         style: PropTypes.Requireable<object>;

package/lib/cjs/typography/text.d.ts

@@ -32,7 +32,7 @@ export default class Text extends PureComponent<TextProps> {
         underline: PropTypes.Requireable<boolean>;
         link: PropTypes.Requireable<NonNullable<boolean | object>>;
         strong: PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"warning" | "success" | "primary" | "secondary" | "tertiary" | "danger" | "quaternary">;
+        type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
         size: PropTypes.Requireable<"small" | "normal">;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;

package/lib/cjs/typography/title.d.ts

@@ -36,7 +36,7 @@ export default class Title extends PureComponent<TitleProps> {
         link: PropTypes.Requireable<NonNullable<boolean | object>>;
         underline: PropTypes.Requireable<boolean>;
         strong: PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"warning" | "success" | "primary" | "secondary" | "tertiary" | "danger" | "quaternary">;
+        type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
         heading: PropTypes.Requireable<1 | 2 | 3 | 4 | 6 | 5>;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;

package/lib/es/button/Button.d.ts

@@ -48,7 +48,7 @@ export default class Button extends PureComponent<ButtonProps> {
         prefixCls: PropTypes.Requireable<string>;
         style: PropTypes.Requireable<object>;
         size: PropTypes.Requireable<"default" | "small" | "large">;
-        type: PropTypes.Requireable<"warning" | "primary" | "secondary" | "tertiary" | "danger">;
+        type: PropTypes.Requireable<"warning" | "primary" | "tertiary" | "secondary" | "danger">;
         block: PropTypes.Requireable<boolean>;
         onClick: PropTypes.Requireable<(...args: any[]) => any>;
         onMouseDown: PropTypes.Requireable<(...args: any[]) => any>;

package/lib/es/button/index.d.ts

@@ -23,7 +23,7 @@ declare class Button extends React.PureComponent<ButtonProps> {
         onMouseLeave: import("prop-types").Requireable<(...args: any[]) => any>;
         disabled: import("prop-types").Requireable<boolean>;
         size: import("prop-types").Requireable<"default" | "small" | "large">;
-        type: import("prop-types").Requireable<"warning" | "primary" | "secondary" | "tertiary" | "danger">;
+        type: import("prop-types").Requireable<"warning" | "primary" | "tertiary" | "secondary" | "danger">;
         block: import("prop-types").Requireable<boolean>;
         onClick: import("prop-types").Requireable<(...args: any[]) => any>;
         onMouseDown: import("prop-types").Requireable<(...args: any[]) => any>;

package/lib/es/carousel/index.d.ts

@@ -14,7 +14,7 @@ export interface CarouselState {
 declare class Carousel extends BaseComponent<CarouselProps, CarouselState> {
     static propTypes: {
         activeIndex: PropTypes.Requireable<number>;
-        animation: PropTypes.Requireable<"fade" | "slide">;
+        animation: PropTypes.Requireable<"slide" | "fade">;
         arrowProps: PropTypes.Requireable<object>;
         autoPlay: PropTypes.Requireable<NonNullable<boolean | object>>;
         className: PropTypes.Requireable<string>;

package/lib/es/datePicker/dateInput.d.ts

@@ -26,7 +26,7 @@ export default class DateInput extends BaseComponent<DateInputProps, {}> {
         onFocus: PropTypes.Requireable<(...args: any[]) => any>;
         value: PropTypes.Requireable<any[]>;
         disabled: PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
+        type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
         showClear: PropTypes.Requireable<boolean>;
         format: PropTypes.Requireable<string>;
         inputStyle: PropTypes.Requireable<object>;

package/lib/es/datePicker/datePicker.d.ts

@@ -46,7 +46,7 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
         'aria-invalid': PropTypes.Requireable<boolean>;
         'aria-labelledby': PropTypes.Requireable<string>;
         'aria-required': PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
+        type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
         size: PropTypes.Requireable<"default" | "small" | "large">;
         clearIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         density: PropTypes.Requireable<"default" | "compact">;

package/lib/es/datePicker/monthsGrid.d.ts

@@ -19,7 +19,7 @@ export interface MonthsGridProps extends MonthsGridFoundationProps, BaseProps {
 export declare type MonthsGridState = MonthsGridFoundationState;
 export default class MonthsGrid extends BaseComponent<MonthsGridProps, MonthsGridState> {
     static propTypes: {
-        type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
+        type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
         defaultValue: PropTypes.Requireable<NonNullable<string | number | object>>;
         defaultPickerValue: PropTypes.Requireable<NonNullable<string | number | object>>;
         multiple: PropTypes.Requireable<boolean>;

package/lib/es/form/baseForm.d.ts

@@ -135,7 +135,7 @@ declare class Form<Values extends Record<string, any> = any> extends BaseCompone
         preventScroll?: boolean;
         showRestTagsPopover?: boolean;
         restTagsPopoverProps?: import("../popover").PopoverProps;
-    } & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "getPopupContainer" | "motion" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay"> & React.RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
+    } & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "motion" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay"> & React.RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
     static Checkbox: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../checkbox").CheckboxProps & import("./interface").RCIncludeType>;
     static CheckboxGroup: React.ComponentType<import("utility-types").Subtract<import("../checkbox").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & React.RefAttributes<any>>;
     static Radio: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../radio").RadioProps & import("./interface").RCIncludeType>;

package/lib/es/form/field.d.ts

@@ -83,7 +83,7 @@ declare const FormSelect: import("react").ComponentType<import("utility-types").
     preventScroll?: boolean;
     showRestTagsPopover?: boolean;
     restTagsPopoverProps?: import("../popover").PopoverProps;
-} & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "getPopupContainer" | "motion" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay"> & import("react").RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
+} & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "motion" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay"> & import("react").RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
 declare const FormCheckboxGroup: import("react").ComponentType<import("utility-types").Subtract<import("../checkbox/checkboxGroup").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & import("react").RefAttributes<any>>;
 declare const FormCheckbox: import("react").ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../checkbox/checkbox").CheckboxProps & import("./interface").RCIncludeType>;
 declare const FormRadioGroup: import("react").ComponentType<import("utility-types").Subtract<import("../radio/radioGroup").RadioGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & import("react").RefAttributes<any>>;

package/lib/es/tabs/TabBar.d.ts

@@ -5,6 +5,7 @@ export interface TabBarState {
     endInd: number;
     rePosKey: number;
     startInd: number;
+    uuid: string;
 }
 export interface OverflowItem extends PlainTab {
     key: string;
@@ -25,8 +26,8 @@ declare class TabBar extends React.Component<TabBarProps, TabBarState> {
         closable: PropTypes.Requireable<boolean>;
         deleteTabItem: PropTypes.Requireable<(...args: any[]) => any>;
     };
-    uuid: string;
     constructor(props: TabBarProps);
+    componentDidMount(): void;
     renderIcon(icon: ReactNode): ReactNode;
     renderExtra(): ReactNode;
     handleItemClick: (itemKey: string, e: MouseEvent<Element>) => void;

package/lib/es/tabs/TabBar.js

@@ -19,9 +19,8 @@ import getDataAttr from '@douyinfe/semi-foundation/lib/es/utils/getDataAttr';
 import OverflowList from '../overflowList';
 import Dropdown from '../dropdown';
 import Button from '../button';
-import { IconChevronRight, IconChevronLeft } from '@douyinfe/semi-icons';
+import { IconChevronRight, IconChevronLeft, IconClose } from '@douyinfe/semi-icons';
 import { getUuidv4 } from '@douyinfe/semi-foundation/lib/es/utils/uuid';
-import TabItem from './TabItem';
 
 class TabBar extends React.Component {
   constructor(props) {
@@ -34,7 +33,7 @@ class TabBar extends React.Component {
         const key = this._getItemKey(itemKey); // eslint-disable-next-line max-len
 
 
-        const tabItem = document.querySelector("[data-uuid=\"".concat(this.uuid, "\"] .").concat(cssClasses.TABS_TAB, "[data-scrollkey=\"").concat(key, "\"]"));
+        const tabItem = document.querySelector("[data-uuid=\"".concat(this.state.uuid, "\"] .").concat(cssClasses.TABS_TAB, "[data-scrollkey=\"").concat(key, "\"]"));
         tabItem.scrollIntoView({
           behavior: 'smooth',
           block: 'nearest',
@@ -51,23 +50,45 @@ class TabBar extends React.Component {
       const {
         size,
         type,
-        deleteTabItem,
-        handleKeyDown,
-        tabPosition
+        deleteTabItem
       } = this.props;
+      const panelIcon = panel.icon ? this.renderIcon(panel.icon) : null;
+      const closableIcon = type === 'card' && panel.closable ? /*#__PURE__*/React.createElement(IconClose, {
+        "aria-label": "Close",
+        role: "button",
+        className: "".concat(cssClasses.TABS_TAB, "-icon-close"),
+        onClick: e => deleteTabItem(panel.itemKey, e)
+      }) : null;
+      let events = {};
+      const key = panel.itemKey;
+
+      if (!panel.disabled) {
+        events = {
+          onClick: e => this.handleItemClick(key, e)
+        };
+      }
 
-      const isSelected = this._isActive(panel.itemKey);
-
-      return /*#__PURE__*/React.createElement(TabItem, Object.assign({}, panel, {
-        key: this._getItemKey(panel.itemKey),
-        selected: isSelected,
-        size: size,
-        type: type,
-        tabPosition: tabPosition,
-        handleKeyDown: handleKeyDown,
-        deleteTabItem: deleteTabItem,
-        onClick: this.handleItemClick
-      }));
+      const isSelected = this._isActive(key);
+
+      const className = cls(cssClasses.TABS_TAB, {
+        [cssClasses.TABS_TAB_ACTIVE]: isSelected,
+        [cssClasses.TABS_TAB_DISABLED]: panel.disabled,
+        ["".concat(cssClasses.TABS_TAB, "-small")]: size === 'small',
+        ["".concat(cssClasses.TABS_TAB, "-medium")]: size === 'medium'
+      });
+      return /*#__PURE__*/React.createElement("div", Object.assign({
+        role: "tab",
+        id: "semiTab".concat(key),
+        "data-tabkey": "semiTab".concat(key),
+        "aria-controls": "semiTabPanel".concat(key),
+        "aria-disabled": panel.disabled ? 'true' : 'false',
+        "aria-selected": isSelected ? 'true' : 'false',
+        tabIndex: isSelected ? 0 : -1,
+        onKeyDown: e => this.handleKeyDown(e, key, panel.closable)
+      }, events, {
+        className: className,
+        key: this._getItemKey(key)
+      }), panelIcon, panel.tab, closableIcon);
     };
 
     this.renderTabComponents = list => list.map(panel => this.renderTabItem(panel));
@@ -82,7 +103,7 @@ class TabBar extends React.Component {
       const key = this._getItemKey(lastItem.itemKey); // eslint-disable-next-line max-len
 
 
-      const tabItem = document.querySelector("[data-uuid=\"".concat(this.uuid, "\"] .").concat(cssClasses.TABS_TAB, "[data-scrollkey=\"").concat(key, "\"]"));
+      const tabItem = document.querySelector("[data-uuid=\"".concat(this.state.uuid, "\"] .").concat(cssClasses.TABS_TAB, "[data-scrollkey=\"").concat(key, "\"]"));
       tabItem.scrollIntoView({
         behavior: 'smooth',
         block: 'nearest',
@@ -184,9 +205,15 @@ class TabBar extends React.Component {
     this.state = {
       endInd: props.list.length,
       rePosKey: 0,
-      startInd: 0
+      startInd: 0,
+      uuid: ''
     };
-    this.uuid = getUuidv4();
+  }
+
+  componentDidMount() {
+    this.setState({
+      uuid: getUuidv4()
+    });
   }
 
   renderIcon(icon) {
@@ -248,7 +275,7 @@ class TabBar extends React.Component {
       className: classNames,
       style: style
     }, getDataAttr(restProps), {
-      "data-uuid": this.uuid
+      "data-uuid": this.state.uuid
     }), contents, extra);
   }
 

package/lib/es/tabs/index.d.ts

@@ -1,4 +1,4 @@
-import React, { MouseEvent, ReactElement, ReactNode, RefCallback, RefObject } from 'react';
+import { MouseEvent, ReactElement, ReactNode, RefCallback, RefObject } from 'react';
 import PropTypes from 'prop-types';
 import TabsFoundation, { TabsAdapter } from '@douyinfe/semi-foundation/lib/es/tabs/foundation';
 import BaseComponent from '../_base/baseComponent';
@@ -14,7 +14,6 @@ export interface TabsState {
 }
 declare class Tabs extends BaseComponent<TabsProps, TabsState> {
     static TabPane: typeof TabPane;
-    static TabItem: React.ForwardRefExoticComponent<import("./TabItem").TabItemProps & React.RefAttributes<HTMLDivElement>>;
     static propTypes: {
         activeKey: PropTypes.Requireable<string>;
         className: PropTypes.Requireable<string>;

package/lib/es/tabs/index.js

@@ -23,7 +23,6 @@ import BaseComponent from '../_base/baseComponent';
 import '@douyinfe/semi-foundation/lib/es/tabs/tabs.css';
 import TabBar from './TabBar';
 import TabPane from './TabPane';
-import TabItem from './TabItem';
 import TabsContext from './tabs-context';
 const panePickKeys = ['className', 'style', 'disabled', 'itemKey', 'tab', 'icon'];
 export * from './interface';
@@ -336,7 +335,6 @@ class Tabs extends BaseComponent {
 }
 
 Tabs.TabPane = TabPane;
-Tabs.TabItem = TabItem;
 Tabs.propTypes = {
   activeKey: PropTypes.string,
   className: PropTypes.string,

package/lib/es/typography/base.d.ts

@@ -64,7 +64,7 @@ export default class Base extends Component<BaseTypographyProps, BaseTypographyS
         spacing: PropTypes.Requireable<"normal" | "extended">;
         strong: PropTypes.Requireable<boolean>;
         size: PropTypes.Requireable<"small" | "normal">;
-        type: PropTypes.Requireable<"warning" | "success" | "primary" | "secondary" | "tertiary" | "danger" | "quaternary">;
+        type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;
         icon: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;

package/lib/es/typography/numeral.d.ts

@@ -38,7 +38,7 @@ export default class Numeral extends PureComponent<NumeralProps> {
         underline: PropTypes.Requireable<boolean>;
         link: PropTypes.Requireable<NonNullable<boolean | object>>;
         strong: PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"warning" | "success" | "primary" | "secondary" | "tertiary" | "danger" | "quaternary">;
+        type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
         size: PropTypes.Requireable<"small" | "normal">;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;

package/lib/es/typography/paragraph.d.ts

@@ -29,7 +29,7 @@ export default class Paragraph extends PureComponent<ParagraphProps> {
         link: PropTypes.Requireable<NonNullable<boolean | object>>;
         underline: PropTypes.Requireable<boolean>;
         strong: PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"warning" | "success" | "primary" | "secondary" | "tertiary" | "danger" | "quaternary">;
+        type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
         size: PropTypes.Requireable<"small" | "normal">;
         spacing: PropTypes.Requireable<"normal" | "extended">;
         style: PropTypes.Requireable<object>;

package/lib/es/typography/text.d.ts

@@ -32,7 +32,7 @@ export default class Text extends PureComponent<TextProps> {
         underline: PropTypes.Requireable<boolean>;
         link: PropTypes.Requireable<NonNullable<boolean | object>>;
         strong: PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"warning" | "success" | "primary" | "secondary" | "tertiary" | "danger" | "quaternary">;
+        type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
         size: PropTypes.Requireable<"small" | "normal">;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;

package/lib/es/typography/title.d.ts

@@ -36,7 +36,7 @@ export default class Title extends PureComponent<TitleProps> {
         link: PropTypes.Requireable<NonNullable<boolean | object>>;
         underline: PropTypes.Requireable<boolean>;
         strong: PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"warning" | "success" | "primary" | "secondary" | "tertiary" | "danger" | "quaternary">;
+        type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
         heading: PropTypes.Requireable<1 | 2 | 3 | 4 | 6 | 5>;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;