@douyinfe/semi-ui 2.36.0-beta.0 → 2.36.0

package/lib/cjs/table/getColumns.js

@@ -4,17 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = getColumns;
-
 var _omit2 = _interopRequireDefault(require("lodash/omit"));
-
 var _get2 = _interopRequireDefault(require("lodash/get"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _Column = _interopRequireDefault(require("./Column"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 /**
  * Convert jsx children into object columns
  * @param {Node} children
@@ -23,23 +17,18 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function getColumns(children) {
   if (children) {
     const columns = [];
-
     _react.default.Children.forEach(children, child => {
       if ( /*#__PURE__*/_react.default.isValidElement(child) && (child.type === _Column.default || (0, _get2.default)(child, 'type.elementType') === 'Column')) {
         const col = (0, _omit2.default)(child.props, ['children']);
-
         if (Array.isArray(child.props.children) && child.props.children.length) {
           col.children = getColumns(child.props.children);
         }
-
         columns.push(Object.assign({
           key: child.key
         }, col));
       }
     });
-
     return columns;
   }
-
   return [];
 }

package/lib/cjs/table/index.js

@@ -5,23 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 var _exportNames = {};
 exports.default = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _Table = _interopRequireDefault(require("./Table"));
-
 var _ResizableTable = _interopRequireDefault(require("./ResizableTable"));
-
 var _Column = _interopRequireDefault(require("./Column"));
-
 var _constants = require("@douyinfe/semi-foundation/lib/cjs/table/constants");
-
 var _context = _interopRequireDefault(require("../configProvider/context"));
-
 var _interface = require("./interface");
-
 Object.keys(_interface).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
@@ -33,25 +24,18 @@ Object.keys(_interface).forEach(function (key) {
     }
   });
 });
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 class Table extends _react.default.PureComponent {
   constructor(props) {
     super(props);
-
     this.getCurrentPageData = () => this.tableRef.current && this.tableRef.current.getCurrentPageData();
-
     this.tableRef = /*#__PURE__*/_react.default.createRef();
   }
-
   render() {
-    var _a; // eslint-disable-next-line prefer-destructuring
-
-
+    var _a;
+    // eslint-disable-next-line prefer-destructuring
     const props = this.props;
     const direction = (_a = this.props.direction) !== null && _a !== void 0 ? _a : this.context.direction;
-
     if (props.resizable) {
       return /*#__PURE__*/_react.default.createElement(_ResizableTable.default, Object.assign({}, props, {
         ref: this.tableRef,
@@ -64,9 +48,7 @@ class Table extends _react.default.PureComponent {
       }));
     }
   }
-
 }
-
 Table.Column = _Column.default;
 Table.DEFAULT_KEY_COLUMN_SELECTION = _constants.strings.DEFAULT_KEY_COLUMN_SELECTION;
 Table.DEFAULT_KEY_COLUMN_EXPAND = _constants.strings.DEFAULT_KEY_COLUMN_EXPAND;

package/lib/cjs/table/interface.d.ts

@@ -91,30 +91,30 @@ export interface ColumnProps<RecordType extends Record<string, any> = any> {
     onHeaderCell?: OnHeaderCell<RecordType>;
     ellipsis?: BaseEllipsis;
 }
-export declare type Align = BaseAlign;
-export declare type SortOrder = BaseSortOrder;
-export declare type FilterIcon = boolean | React.ReactNode | FilterIconRenderFunction;
+export type Align = BaseAlign;
+export type SortOrder = BaseSortOrder;
+export type FilterIcon = boolean | React.ReactNode | FilterIconRenderFunction;
 export interface Filter extends BaseFilter {
     value?: any;
     text?: React.ReactNode;
     children?: Filter[];
 }
-export declare type Fixed = BaseFixed;
-export declare type OnCell<RecordType> = (record?: RecordType, rowIndex?: number) => OnCellReturnObject;
-export declare type OnFilter<RecordType> = (filteredValue?: any, record?: RecordType) => boolean;
-export declare type OnFilterDropdownVisibleChange = (visible?: boolean) => void;
-export declare type OnHeaderCell<RecordType> = (record?: RecordType, columnIndex?: number) => OnHeaderCellReturnObject;
-export declare type ColumnRender<RecordType> = (text: any, record: RecordType, index: number, options?: RenderOptions) => ColumnRenderReturnType;
-export declare type RenderFilterDropdownItem = (itemInfo?: FilterDropdownItem) => ReactNode;
-export declare type Sorter<RecordType> = BaseSorter<RecordType>;
-export declare type ColumnTitle = React.ReactNode | ((ColumnTitleProps?: ColumnTitleProps) => React.ReactNode);
-export declare type FilterIconRenderFunction = (filtered: boolean) => React.ReactNode;
-export declare type ColumnTitleProps = {
+export type Fixed = BaseFixed;
+export type OnCell<RecordType> = (record?: RecordType, rowIndex?: number) => OnCellReturnObject;
+export type OnFilter<RecordType> = (filteredValue?: any, record?: RecordType) => boolean;
+export type OnFilterDropdownVisibleChange = (visible?: boolean) => void;
+export type OnHeaderCell<RecordType> = (record?: RecordType, columnIndex?: number) => OnHeaderCellReturnObject;
+export type ColumnRender<RecordType> = (text: any, record: RecordType, index: number, options?: RenderOptions) => ColumnRenderReturnType;
+export type RenderFilterDropdownItem = (itemInfo?: FilterDropdownItem) => ReactNode;
+export type Sorter<RecordType> = BaseSorter<RecordType>;
+export type ColumnTitle = React.ReactNode | ((ColumnTitleProps?: ColumnTitleProps) => React.ReactNode);
+export type FilterIconRenderFunction = (filtered: boolean) => React.ReactNode;
+export type ColumnTitleProps = {
     sorter?: React.ReactNode;
     filter?: React.ReactNode;
     selection?: React.ReactNode;
 };
-export declare type ColumnRenderReturnType = React.ReactNode | RenderReturnObject;
+export type ColumnRenderReturnType = React.ReactNode | RenderReturnObject;
 export interface RenderReturnObject {
     [x: string]: any;
     children: React.ReactNode;
@@ -164,7 +164,7 @@ export interface OnGroupedRowReturnObject extends Omit<React.HTMLAttributes<HTML
     style?: React.CSSProperties;
     onClick?: (e: React.MouseEvent) => void;
 }
-export declare type OnHeaderRowReturnObject = Omit<React.HTMLAttributes<HTMLTableRowElement>, 'ref' | 'style'>;
+export type OnHeaderRowReturnObject = Omit<React.HTMLAttributes<HTMLTableRowElement>, 'ref' | 'style'>;
 export interface Scroll {
     x?: number | string;
     y?: number | string;
@@ -212,92 +212,92 @@ export interface RowSelectionProps<RecordType> {
     onSelect?: RowSelectionOnSelect<RecordType>;
     onSelectAll?: RowSelectionOnSelectAll<RecordType>;
 }
-export declare type GetCheckboxProps<RecordType> = (record: RecordType) => CheckboxProps;
-export declare type RowSelectionOnChange<RecordType> = (selectedRowKeys?: (string | number)[], selectedRows?: RecordType[]) => void;
-export declare type RowSelectionOnSelect<RecordType> = (record?: RecordType, selected?: boolean, selectedRows?: RecordType[], nativeEvent?: React.MouseEvent) => void;
-export declare type RowSelectionOnSelectAll<RecordType> = (selected?: boolean, selectedRows?: RecordType[], changedRows?: RecordType[]) => void;
-export declare type ExpandIcon = ((expanded?: boolean) => React.ReactNode) | React.ReactNode;
-export declare type ExpandedRowRender<RecordType> = (record?: RecordType, index?: number, expanded?: boolean) => React.ReactNode;
-export declare type Footer<RecordType> = ReactNode | ((pageData?: RecordType[]) => React.ReactNode);
-export declare type FormatPageText = ((pageInfo?: {
+export type GetCheckboxProps<RecordType> = (record: RecordType) => CheckboxProps;
+export type RowSelectionOnChange<RecordType> = (selectedRowKeys?: (string | number)[], selectedRows?: RecordType[]) => void;
+export type RowSelectionOnSelect<RecordType> = (record?: RecordType, selected?: boolean, selectedRows?: RecordType[], nativeEvent?: React.MouseEvent) => void;
+export type RowSelectionOnSelectAll<RecordType> = (selected?: boolean, selectedRows?: RecordType[], changedRows?: RecordType[]) => void;
+export type ExpandIcon = ((expanded?: boolean) => React.ReactNode) | React.ReactNode;
+export type ExpandedRowRender<RecordType> = (record?: RecordType, index?: number, expanded?: boolean) => React.ReactNode;
+export type Footer<RecordType> = ReactNode | ((pageData?: RecordType[]) => React.ReactNode);
+export type FormatPageText = ((pageInfo?: {
     currentStart?: number;
     currentEnd?: number;
     total?: number;
 }) => React.ReactNode) | boolean;
-export declare type GetVirtualizedListRef = (ref: MutableRefObject<any>) => void;
-export declare type GroupByFunction<RecordType> = BaseGroupByFn<RecordType>;
-export declare type GroupBy<RecordType> = BaseGroupBy<RecordType>;
-export declare type Size = ArrayElement<typeof strings.SIZES>;
-export declare type Title<RecordType> = React.ReactNode | ((pageData?: RecordType[]) => React.ReactNode);
-export declare type PaginationPosition = ArrayElement<typeof strings.PAGINATION_POSITIONS>;
-export declare type Pagination = TablePaginationProps | boolean;
-export declare type TablePagination = Pagination;
+export type GetVirtualizedListRef = (ref: MutableRefObject<any>) => void;
+export type GroupByFunction<RecordType> = BaseGroupByFn<RecordType>;
+export type GroupBy<RecordType> = BaseGroupBy<RecordType>;
+export type Size = ArrayElement<typeof strings.SIZES>;
+export type Title<RecordType> = React.ReactNode | ((pageData?: RecordType[]) => React.ReactNode);
+export type PaginationPosition = ArrayElement<typeof strings.PAGINATION_POSITIONS>;
+export type Pagination = TablePaginationProps | boolean;
+export type TablePagination = Pagination;
 export interface ChangeInfoFilter<RecordType> extends BaseChangeInfoFilter<RecordType> {
     filters?: Filter[];
     onFilter?: OnFilter<RecordType>;
 }
-export declare type ChangeInfoSorter<RecordType> = BaseChangeInfoSorter<RecordType>;
+export type ChangeInfoSorter<RecordType> = BaseChangeInfoSorter<RecordType>;
 export interface ChangeInfo<RecordType> {
     pagination?: TablePaginationProps;
     filters?: ChangeInfoFilter<RecordType>[];
     sorter?: ChangeInfoSorter<RecordType>;
     extra?: Record<string, any>;
 }
-export declare type OnChange<RecordType> = (changeInfo: ChangeInfo<RecordType>) => void;
-export declare type OnRow<RecordType> = (record?: RecordType, index?: number) => OnRowReturnObject;
-export declare type OnGroupedRow<RecordType> = (record?: RecordType, index?: number) => OnGroupedRowReturnObject;
-export declare type OnHeaderRow<RecordType> = (columns?: ColumnProps<RecordType>[], index?: number) => OnHeaderRowReturnObject;
-export declare type OnExpandedRowsChange<RecordType> = (expandedRows?: IncludeGroupRecord<RecordType>[]) => void;
-export declare type OnExpand<RecordType> = (expanded?: boolean, record?: IncludeGroupRecord<RecordType>, mouseEvent?: React.MouseEvent) => void;
-export declare type RenderGroupSection = (groupKey?: string | number, group?: (string | number)[]) => ReactNode | {
+export type OnChange<RecordType> = (changeInfo: ChangeInfo<RecordType>) => void;
+export type OnRow<RecordType> = (record?: RecordType, index?: number) => OnRowReturnObject;
+export type OnGroupedRow<RecordType> = (record?: RecordType, index?: number) => OnGroupedRowReturnObject;
+export type OnHeaderRow<RecordType> = (columns?: ColumnProps<RecordType>[], index?: number) => OnHeaderRowReturnObject;
+export type OnExpandedRowsChange<RecordType> = (expandedRows?: IncludeGroupRecord<RecordType>[]) => void;
+export type OnExpand<RecordType> = (expanded?: boolean, record?: IncludeGroupRecord<RecordType>, mouseEvent?: React.MouseEvent) => void;
+export type RenderGroupSection = (groupKey?: string | number, group?: (string | number)[]) => ReactNode | {
     [x: string]: any;
     children: ReactNode;
 };
-export declare type RenderPagination = (paginationProps: TablePaginationProps) => ReactNode;
-export declare type RowExpandable<RecordType> = (record?: RecordType) => boolean;
-export declare type RowKey<RecordType> = BaseRowKeyType | ((record?: RecordType) => string);
-export declare type RowSelection<RecordType> = RowSelectionProps<RecordType> | boolean;
-export declare type VirtualizedOnScrollArgs = {
+export type RenderPagination = (paginationProps: TablePaginationProps) => ReactNode;
+export type RowExpandable<RecordType> = (record?: RecordType) => boolean;
+export type RowKey<RecordType> = BaseRowKeyType | ((record?: RecordType) => string);
+export type RowSelection<RecordType> = RowSelectionProps<RecordType> | boolean;
+export type VirtualizedOnScrollArgs = {
     scrollDirection?: ScrollDirection;
     scrollOffset?: number;
     scrollUpdateWasRequested?: boolean;
 };
-export declare type VirtualizeItemSizeRow = {
+export type VirtualizeItemSizeRow = {
     sectionRow?: boolean;
     expandedRow?: boolean;
 };
-export declare type VirtualizedMode = 'list' | 'grid';
-export declare type VirtualizedItemSizeFn = (index?: number, row?: VirtualizeItemSizeRow) => number;
-export declare type VirtualizedItemSize = number | VirtualizedItemSizeFn;
-export declare type VirtualizedOnScroll = (object: VirtualizedOnScrollArgs) => void;
+export type VirtualizedMode = 'list' | 'grid';
+export type VirtualizedItemSizeFn = (index?: number, row?: VirtualizeItemSizeRow) => number;
+export type VirtualizedItemSize = number | VirtualizedItemSizeFn;
+export type VirtualizedOnScroll = (object: VirtualizedOnScrollArgs) => void;
 export interface VirtualizedProps {
     [x: string]: any;
     mode?: VirtualizedMode;
     itemSize?: VirtualizedItemSize;
     onScroll?: VirtualizedOnScroll;
 }
-export declare type Virtualized = boolean | VirtualizedProps;
+export type Virtualized = boolean | VirtualizedProps;
 export interface TablePaginationProps extends BaseProps, PaginationProps {
     position?: PaginationPosition;
     formatPageText?: FormatPageText;
 }
-export declare type Resizable<RecordType> = ResizableProps<RecordType> | boolean;
+export type Resizable<RecordType> = ResizableProps<RecordType> | boolean;
 export interface ResizableProps<RecordType> {
     onResize?: ResizeFn<RecordType>;
     onResizeStart?: ResizeFn<RecordType>;
     onResizeStop?: ResizeFn<RecordType>;
 }
-export declare type ResizeFn<RecordType> = (column: RecordType) => RecordType;
+export type ResizeFn<RecordType> = (column: RecordType) => RecordType;
 export interface BodyScrollEvent extends React.UIEvent {
     [x: string]: any;
     currentTarget: any;
     target: any;
 }
-export declare type BodyScrollPosition = 'both' | 'middle' | 'left' | 'right';
-export declare type TableLocale = Locale['Table'];
-export declare type Direction = CSSDirection;
-export declare type IncludeGroupRecord<RecordType> = BaseIncludeGroupRecord<RecordType>;
-export declare type Sticky = boolean | {
+export type BodyScrollPosition = 'both' | 'middle' | 'left' | 'right';
+export type TableLocale = Locale['Table'];
+export type Direction = CSSDirection;
+export type IncludeGroupRecord<RecordType> = BaseIncludeGroupRecord<RecordType>;
+export type Sticky = boolean | {
     top?: number;
 };
 export {};

package/lib/cjs/table/table-context.js

@@ -4,19 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _noop2 = _interopRequireDefault(require("lodash/noop"));
-
 var _react = _interopRequireDefault(require("react"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 /* eslint-disable max-len */
+
 const TableContext = /*#__PURE__*/_react.default.createContext({
   headWidths: [],
   setHeadWidths: _noop2.default,
   handleRowExpanded: _noop2.default
 });
-
 var _default = TableContext;
 exports.default = _default;

package/lib/cjs/table/utils.js

@@ -14,27 +14,17 @@ exports.logger = void 0;
 exports.measureScrollbar = measureScrollbar;
 exports.mergeColumns = mergeColumns;
 exports.mergeComponents = mergeComponents;
-
 var _map2 = _interopRequireDefault(require("lodash/map"));
-
 var _find2 = _interopRequireDefault(require("lodash/find"));
-
 var _clone2 = _interopRequireDefault(require("lodash/clone"));
-
 var _merge2 = _interopRequireDefault(require("lodash/merge"));
-
 var _Logger = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/utils/Logger"));
-
 var _constants = require("@douyinfe/semi-foundation/lib/cjs/table/constants");
-
 var _utils = require("../_utils");
-
 var _utils2 = require("@douyinfe/semi-foundation/lib/cjs/table/utils");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-let scrollbarVerticalSize, scrollbarHorizontalSize; // Measure scrollbar width for padding body during modal show/hide
-
+let scrollbarVerticalSize, scrollbarHorizontalSize;
+// Measure scrollbar width for padding body during modal show/hide
 const scrollbarMeasure = {
   position: 'absolute',
   top: '-9999px',
@@ -45,36 +35,29 @@ const scrollbarMeasure = {
  * @param {'vertical'|'horizontal'} [direction]
  * @returns {number}
  */
-
 function measureScrollbar() {
   let direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'vertical';
-
   if (typeof document === 'undefined' || typeof window === 'undefined') {
     return 0;
   }
-
   const isVertical = direction === 'vertical';
-
   if (isVertical && scrollbarVerticalSize) {
     return scrollbarVerticalSize;
   } else if (!isVertical && scrollbarHorizontalSize) {
     return scrollbarHorizontalSize;
   }
-
   const scrollDiv = document.createElement('div');
   Object.keys(scrollbarMeasure).forEach(scrollProp => {
     scrollDiv.style[scrollProp] = scrollbarMeasure[scrollProp];
-  }); // Append related overflow style
-
+  });
+  // Append related overflow style
   if (isVertical) {
     scrollDiv.style.overflowY = 'scroll';
   } else {
     scrollDiv.style.overflowX = 'scroll';
   }
-
   document.body.appendChild(scrollDiv);
   let size = 0;
-
   if (isVertical) {
     // clientWidth is the inner width (excluding borders and scrollbars)
     // offsetWidth is the outer width (including padding and borders)
@@ -84,12 +67,10 @@ function measureScrollbar() {
     size = scrollDiv.offsetHeight - scrollDiv.clientHeight;
     scrollbarHorizontalSize = size;
   }
-
-  document.body.removeChild(scrollDiv); // console.log(size);
-
+  document.body.removeChild(scrollDiv);
+  // console.log(size);
   return size;
 }
-
 function amendTableWidth(tableWidth) {
   return typeof tableWidth === 'number' ? tableWidth - _constants.numbers.DEFAULT_CELL_PADDING_LEFT - _constants.numbers.DEFAULT_CELL_PADDING_RIGHT - _constants.numbers.DEFAULT_CELL_BORDER_WIDTH_LEFT - _constants.numbers.DEFAULT_CELL_BORDER_WIDTH_RIGHT - measureScrollbar('vertical') : undefined;
 }
@@ -100,8 +81,6 @@ function amendTableWidth(tableWidth) {
  * @param {Boolean|Object} virtualized
  * @returns
  */
-
-
 function mergeComponents(components, virtualized) {
   return (0, _merge2.default)({}, {
     table: 'table',
@@ -137,10 +116,8 @@ function mergeComponents(components, virtualized) {
     }
   }, components);
 }
-
 const logger = new _Logger.default('[@douyinfe/semi-ui Table]');
 exports.logger = logger;
-
 function mergeColumns() {
   let oldColumns = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
   let newColumns = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
@@ -152,7 +129,6 @@ function mergeColumns() {
     newColumn = Object.assign({}, newColumn);
     const key = (0, _utils2.getColumnKey)(newColumn, keyPropNames);
     const oldColumn = key != null && (0, _find2.default)(oldColumns, item => (0, _utils2.getColumnKey)(item, keyPropNames) === key);
-
     if (oldColumn) {
       finalColumns.push(clone(Object.assign(Object.assign({}, oldColumn), newColumn)));
     } else {

package/lib/cjs/tabs/TabBar.js

@@ -4,57 +4,36 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _pick2 = _interopRequireDefault(require("lodash/pick"));
-
 var _isEmpty2 = _interopRequireDefault(require("lodash/isEmpty"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _constants = require("@douyinfe/semi-foundation/lib/cjs/tabs/constants");
-
 var _getDataAttr = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/utils/getDataAttr"));
-
 var _overflowList = _interopRequireDefault(require("../overflowList"));
-
 var _dropdown = _interopRequireDefault(require("../dropdown"));
-
 var _button = _interopRequireDefault(require("../button"));
-
 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) {
   var t = {};
-
   for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-
   if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
     if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
-
 class TabBar extends _react.default.Component {
   constructor(props) {
     super(props);
-
     this.handleItemClick = (itemKey, e) => {
       this.props.onTabClick(itemKey, e);
-
       if (this.props.collapsible) {
-        const key = this._getItemKey(itemKey); // eslint-disable-next-line max-len
-
-
+        const key = this._getItemKey(itemKey);
+        // eslint-disable-next-line max-len
         const tabItem = document.querySelector(`[data-uuid="${this.state.uuid}"] .${_constants.cssClasses.TABS_TAB}[data-scrollkey="${key}"]`);
         tabItem.scrollIntoView({
           behavior: 'smooth',
@@ -63,11 +42,9 @@ class TabBar extends _react.default.Component {
         });
       }
     };
-
     this.handleKeyDown = (event, itemKey, closable) => {
       this.props.handleKeyDown(event, itemKey, closable);
     };
-
     this.renderTabItem = panel => {
       const {
         size,
@@ -76,9 +53,7 @@ class TabBar extends _react.default.Component {
         handleKeyDown,
         tabPosition
       } = this.props;
-
       const isSelected = this._isActive(panel.itemKey);
-
       return /*#__PURE__*/_react.default.createElement(_TabItem.default, Object.assign({}, (0, _pick2.default)(panel, ['disabled', 'icon', 'itemKey', 'tab', 'closable']), {
         key: this._getItemKey(panel.itemKey),
         selected: isSelected,
@@ -90,19 +65,14 @@ class TabBar extends _react.default.Component {
         onClick: this.handleItemClick
       }));
     };
-
     this.renderTabComponents = list => list.map(panel => this.renderTabItem(panel));
-
     this.handleArrowClick = (items, pos) => {
       const lastItem = pos === 'start' ? items.pop() : items.shift();
-
       if (!lastItem) {
         return;
       }
-
-      const key = this._getItemKey(lastItem.itemKey); // eslint-disable-next-line max-len
-
-
+      const key = this._getItemKey(lastItem.itemKey);
+      // eslint-disable-next-line max-len
       const tabItem = document.querySelector(`[data-uuid="${this.state.uuid}"] .${_constants.cssClasses.TABS_TAB}[data-scrollkey="${key}"]`);
       tabItem.scrollIntoView({
         behavior: 'smooth',
@@ -110,7 +80,6 @@ class TabBar extends _react.default.Component {
         inline: 'nearest'
       });
     };
-
     this.renderCollapse = (items, icon, pos) => {
       if ((0, _isEmpty2.default)(items)) {
         return /*#__PURE__*/_react.default.createElement(_button.default, {
@@ -119,7 +88,6 @@ class TabBar extends _react.default.Component {
           theme: "borderless"
         });
       }
-
       const {
         dropdownClassName,
         dropdownStyle
@@ -128,7 +96,6 @@ class TabBar extends _react.default.Component {
         rePosKey
       } = this.state;
       const disabled = !items.length;
-
       const menu = /*#__PURE__*/_react.default.createElement(_dropdown.default.Menu, null, items.map(panel => {
         const {
           icon: i,
@@ -142,7 +109,6 @@ class TabBar extends _react.default.Component {
           active: this._isActive(itemKey)
         }, panelIcon, tab);
       }));
-
       const arrowCls = (0, _classnames.default)({
         [`${_constants.cssClasses.TABS_BAR}-arrow-${pos}`]: pos,
         [`${_constants.cssClasses.TABS_BAR}-arrow`]: true
@@ -173,13 +139,11 @@ class TabBar extends _react.default.Component {
         theme: "borderless"
       })));
     };
-
     this.renderOverflow = items => items.map((item, ind) => {
       const icon = ind === 0 ? /*#__PURE__*/_react.default.createElement(_semiIcons.IconChevronLeft, null) : /*#__PURE__*/_react.default.createElement(_semiIcons.IconChevronRight, null);
       const pos = ind === 0 ? 'start' : 'end';
       return this.renderCollapse(item, icon, pos);
     });
-
     this.renderCollapsedTab = () => {
       const {
         list
@@ -201,11 +165,8 @@ class TabBar extends _react.default.Component {
         visibleItemRenderer: this.renderTabItem
       });
     };
-
     this._isActive = key => key === this.props.activeKey;
-
     this._getItemKey = key => `${key}-bar`;
-
     this.state = {
       endInd: props.list.length,
       rePosKey: 0,
@@ -213,17 +174,14 @@ class TabBar extends _react.default.Component {
       uuid: ''
     };
   }
-
   componentDidMount() {
     this.setState({
       uuid: (0, _uuid.getUuidv4)()
     });
   }
-
   renderIcon(icon) {
     return /*#__PURE__*/_react.default.createElement("span", null, icon);
   }
-
   renderExtra() {
     const {
       tabBarExtraContent,
@@ -238,7 +196,6 @@ class TabBar extends _react.default.Component {
       [`${_constants.cssClasses.TABS_BAR}-${type}-extra`]: type,
       [`${_constants.cssClasses.TABS_BAR}-${type}-extra-${size}`]: size
     });
-
     if (tabBarExtraContent) {
       const tabBarStyle = Object.assign(Object.assign({}, tabBarExtraContentDefaultStyle), tabBarExtraContentStyle);
       return /*#__PURE__*/_react.default.createElement("div", {
@@ -247,22 +204,19 @@ class TabBar extends _react.default.Component {
         "x-semi-prop": "tabBarExtraContent"
       }, tabBarExtraContent);
     }
-
     return null;
   }
-
   render() {
     const _a = this.props,
-          {
-      type,
-      style,
-      className,
-      list,
-      tabPosition,
-      collapsible
-    } = _a,
-          restProps = __rest(_a, ["type", "style", "className", "list", "tabPosition", "collapsible"]);
-
+      {
+        type,
+        style,
+        className,
+        list,
+        tabPosition,
+        collapsible
+      } = _a,
+      restProps = __rest(_a, ["type", "style", "className", "list", "tabPosition", "collapsible"]);
     const classNames = (0, _classnames.default)(className, {
       [_constants.cssClasses.TABS_BAR]: true,
       [_constants.cssClasses.TABS_BAR_LINE]: type === 'line',
@@ -282,9 +236,7 @@ class TabBar extends _react.default.Component {
       "data-uuid": this.state.uuid
     }), contents, extra);
   }
-
 }
-
 TabBar.propTypes = {
   activeKey: _propTypes.default.string,
   className: _propTypes.default.string,