@hi-ui/tabs 4.1.0 → 4.1.2

package/CHANGELOG.md

@@ -1,5 +1,34 @@
 # @hi-ui/tabs
 
+## 4.1.2
+
+### Patch Changes
+
+- [#2672](https://github.com/XiaoMi/hiui/pull/2672) [`1ebe27830`](https://github.com/XiaoMi/hiui/commit/1ebe2783098b3a8cd980bd10076d67635463800e) Thanks [@zyprepare](https://github.com/zyprepare)! - build: 升级到 rollup3,重新构建发布组件
+
+- Updated dependencies [[`1ebe27830`](https://github.com/XiaoMi/hiui/commit/1ebe2783098b3a8cd980bd10076d67635463800e)]:
+  - @hi-ui/core@4.0.6
+  - @hi-ui/use-latest@4.0.2
+  - @hi-ui/use-uncontrolled-state@4.0.2
+  - @hi-ui/use-unmount-effect@4.0.2
+  - @hi-ui/icons@4.0.16
+  - @hi-ui/icon-button@4.0.6
+  - @hi-ui/classname@4.0.2
+  - @hi-ui/env@4.0.2
+  - @hi-ui/react-utils@4.0.2
+  - @hi-ui/type-assertion@4.0.2
+
+## 4.1.1
+
+### Patch Changes
+
+- [#2652](https://github.com/XiaoMi/hiui/pull/2652) [`d4f74c723`](https://github.com/XiaoMi/hiui/commit/d4f74c723d7fb619320dac5cdb4444480a3b7880) Thanks [@zyprepare](https://github.com/zyprepare)! - chore: 胶囊样式下标签之间增加竖线展示
+
+- [#2653](https://github.com/XiaoMi/hiui/pull/2653) [`b477d91db`](https://github.com/XiaoMi/hiui/commit/b477d91db15bbc92c8712a9a771af5b332779315) Thanks [@zyprepare](https://github.com/zyprepare)! - chore: 更新使用到的 G40 颜色值
+
+- Updated dependencies [[`b477d91db`](https://github.com/XiaoMi/hiui/commit/b477d91db15bbc92c8712a9a771af5b332779315)]:
+  - @hi-ui/icon-button@4.0.5
+
 ## 4.1.0
 
 ### Minor Changes

package/lib/cjs/TabInk.js

@@ -9,35 +9,17 @@
  */
 'use strict';
 
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, '__esModule', {
-  value: true
-});
-
 var React = require('react');
-
 var classname = require('@hi-ui/classname');
-
 var index = require('./hooks/index.js');
-
-function _interopDefaultLegacy(e) {
-  return e && _typeof(e) === 'object' && 'default' in e ? e : {
-    'default': e
-  };
-}
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
 var TabInk = function TabInk(_ref) {
   var _cx;
-
   var disabled = _ref.disabled,
-      prefixCls = _ref.prefixCls,
-      activeItemElement = _ref.activeItemElement,
-      activeTabId = _ref.activeTabId,
-      getTabOffset = _ref.getTabOffset,
-      showHorizontal = _ref.showHorizontal;
+    prefixCls = _ref.prefixCls,
+    activeItemElement = _ref.activeItemElement,
+    activeTabId = _ref.activeTabId,
+    getTabOffset = _ref.getTabOffset,
+    showHorizontal = _ref.showHorizontal;
   var inkRef = React.useRef(null);
   var setTabLnkPositionStyle = React.useCallback(function () {
     if (!inkRef.current) return;
@@ -45,9 +27,7 @@ var TabInk = function TabInk(_ref) {
     var computedStyle = getComputedStyle(activeItemElement);
     var itemRect = activeItemElement.getBoundingClientRect();
     var offset = getTabOffset(activeTabId);
-
     var _style;
-
     if (!showHorizontal) {
       var paddingTop = parseFloat(computedStyle.getPropertyValue('padding-top'));
       var paddingBottom = parseFloat(computedStyle.getPropertyValue('padding-bottom'));
@@ -68,7 +48,6 @@ var TabInk = function TabInk(_ref) {
         height: ''
       };
     }
-
     Object.assign(inkRef.current.style, _style);
   }, [activeItemElement, activeTabId, getTabOffset, showHorizontal]);
   React.useEffect(function () {
@@ -82,10 +61,9 @@ var TabInk = function TabInk(_ref) {
     },
     onResize: setTabLnkPositionStyle
   });
-  return /*#__PURE__*/React__default["default"].createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     className: classname.cx(prefixCls + "__ink", (_cx = {}, _cx[prefixCls + "__ink--disabled"] = disabled, _cx)),
     ref: inkRef
   });
 };
-
 exports.TabInk = TabInk;

package/lib/cjs/TabItem.js

@@ -9,71 +9,48 @@
  */
 'use strict';
 
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, '__esModule', {
-  value: true
-});
-
 var React = require('react');
-
 var classname = require('@hi-ui/classname');
-
 var env = require('@hi-ui/env');
-
 var icons = require('@hi-ui/icons');
-
-function _interopDefaultLegacy(e) {
-  return e && _typeof(e) === 'object' && 'default' in e ? e : {
-    'default': e
-  };
-}
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
 var TabItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _cx;
-
   var className = _ref.className,
-      style = _ref.style,
-      disabled = _ref.disabled,
-      tabTitle = _ref.tabTitle,
-      tabDesc = _ref.tabDesc,
-      prefixCls = _ref.prefixCls,
-      tabId = _ref.tabId,
-      onTabClick = _ref.onTabClick,
-      active = _ref.active,
-      editable = _ref.editable,
-      onDelete = _ref.onDelete,
-      index = _ref.index,
-      _onDragStart = _ref.onDragStart,
-      _onDragOver = _ref.onDragOver,
-      _onDrop = _ref.onDrop,
-      _onDragEnd = _ref.onDragEnd,
-      itemRef = _ref.itemRef,
-      draggable = _ref.draggable,
-      _ref$type = _ref.type,
-      type = _ref$type === void 0 ? 'line' : _ref$type,
-      _ref$closeable = _ref.closeable,
-      closeable = _ref$closeable === void 0 ? true : _ref$closeable,
-      _ref$direction = _ref.direction,
-      layout = _ref$direction === void 0 ? 'horizontal' : _ref$direction;
-
+    style = _ref.style,
+    disabled = _ref.disabled,
+    tabTitle = _ref.tabTitle,
+    tabDesc = _ref.tabDesc,
+    prefixCls = _ref.prefixCls,
+    tabId = _ref.tabId,
+    onTabClick = _ref.onTabClick,
+    active = _ref.active,
+    editable = _ref.editable,
+    onDelete = _ref.onDelete,
+    index = _ref.index,
+    _onDragStart = _ref.onDragStart,
+    _onDragOver = _ref.onDragOver,
+    _onDrop = _ref.onDrop,
+    _onDragEnd = _ref.onDragEnd,
+    itemRef = _ref.itemRef,
+    draggable = _ref.draggable,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'line' : _ref$type,
+    _ref$closeable = _ref.closeable,
+    closeable = _ref$closeable === void 0 ? true : _ref$closeable,
+    _ref$direction = _ref.direction,
+    layout = _ref$direction === void 0 ? 'horizontal' : _ref$direction;
   var _useState = React.useState(null),
-      dragId = _useState[0],
-      setDragId = _useState[1];
-
+    dragId = _useState[0],
+    setDragId = _useState[1];
   var _useState2 = React.useState(null),
-      direction = _useState2[0],
-      setDirection = _useState2[1];
-
+    direction = _useState2[0],
+    setDirection = _useState2[1];
   var _onClick = React.useCallback(function (e) {
     if (onTabClick) {
       onTabClick(tabId, e);
     }
   }, [onTabClick, tabId]);
-
-  return /*#__PURE__*/React__default["default"].createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     style: style,
     className: classname.cx(prefixCls + "__item", className, (_cx = {}, _cx[prefixCls + "__item--active"] = active, _cx[prefixCls + "__item--disabled"] = disabled, _cx[prefixCls + "__item--" + direction] = direction, _cx)),
     ref: ref,
@@ -87,7 +64,6 @@ var TabItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         tabTitle: tabTitle
       }));
       setDragId(tabId);
-
       if (_onDragStart) {
         _onDragStart(e, {
           dragNode: {
@@ -102,7 +78,6 @@ var TabItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       e.stopPropagation();
       e.dataTransfer.clearData();
       setDragId(null);
-
       if (_onDragEnd) {
         _onDragEnd(e, {
           dragNode: {
@@ -120,15 +95,13 @@ var TabItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     onDragOver: function onDragOver(e) {
       e.preventDefault();
       e.stopPropagation();
-
       if (dragId !== tabId && itemRef) {
         var targetBoundingRect = itemRef.getBoundingClientRect();
         var hoverTargetSortY = (targetBoundingRect.bottom - targetBoundingRect.top) / 2;
-        var hoverTargetSortX = (targetBoundingRect.right - targetBoundingRect.left) / 2; // 鼠标垂直移动距离
-
+        var hoverTargetSortX = (targetBoundingRect.right - targetBoundingRect.left) / 2;
+        // 鼠标垂直移动距离
         var hoverClientY = e.clientY - targetBoundingRect.top;
         var hoverClientX = e.clientX - targetBoundingRect.left;
-
         if (layout === 'vertical') {
           if (hoverClientY < hoverTargetSortY) {
             setDirection('prev');
@@ -143,7 +116,6 @@ var TabItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
           }
         }
       }
-
       if (_onDragOver) {
         _onDragOver(e, {
           targetNode: {
@@ -157,10 +129,8 @@ var TabItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       e.preventDefault();
       e.stopPropagation();
       setDirection(null);
-
       if (_onDrop && dragId !== tabId) {
         var passedData = JSON.parse(e.dataTransfer.getData('tab'));
-
         _onDrop(e, {
           dragNode: {
             tabId: tabId,
@@ -174,15 +144,14 @@ var TabItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         });
       }
     }
-  }, /*#__PURE__*/React__default["default"].createElement("span", {
+  }, /*#__PURE__*/React.createElement("span", {
     className: prefixCls + "-item__title"
-  }, tabTitle), type === 'desc' && /*#__PURE__*/React__default["default"].createElement("span", {
+  }, tabTitle), type === 'desc' && /*#__PURE__*/React.createElement("span", {
     className: prefixCls + "-item__desc"
-  }, tabDesc), editable && closeable && /*#__PURE__*/React__default["default"].createElement("span", {
+  }, tabDesc), editable && closeable && /*#__PURE__*/React.createElement("span", {
     className: prefixCls + "__close-btn",
     onClick: function onClick(e) {
       e.stopPropagation();
-
       if (onDelete) {
         onDelete({
           tabId: tabId,
@@ -190,11 +159,9 @@ var TabItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         }, index);
       }
     }
-  }, /*#__PURE__*/React__default["default"].createElement(icons.CloseOutlined, null)));
+  }, /*#__PURE__*/React.createElement(icons.CloseOutlined, null)));
 });
-
 if (env.__DEV__) {
   TabItem.displayName = 'TabItem';
 }
-
 exports.TabItem = TabItem;

package/lib/cjs/TabList.js

@@ -9,129 +9,85 @@
  */
 'use strict';
 
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, '__esModule', {
-  value: true
-});
-
 var tslib = require('tslib');
-
 var React = require('react');
-
 var env = require('@hi-ui/env');
-
 var TabItem = require('./TabItem.js');
-
 var useUncontrolledState = require('@hi-ui/use-uncontrolled-state');
-
 var classname = require('@hi-ui/classname');
-
 var TabInk = require('./TabInk.js');
-
 var icons = require('@hi-ui/icons');
-
 var typeAssertion = require('@hi-ui/type-assertion');
-
 var iconButton = require('@hi-ui/icon-button');
-
 var index = require('./hooks/index.js');
-
 var useLatest = require('@hi-ui/use-latest');
-
 var index$1 = require('./utils/index.js');
-
-function _interopDefaultLegacy(e) {
-  return e && _typeof(e) === 'object' && 'default' in e ? e : {
-    'default': e
-  };
-}
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
 var _role = 'tabs';
-
 var _prefix = classname.getPrefixCls(_role);
-
 var TabList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
   var _cx;
-
   var _b;
-
   var data = _a.data,
-      className = _a.className,
-      style = _a.style,
-      activeId = _a.activeId,
-      defaultActiveId = _a.defaultActiveId,
-      onChange = _a.onChange,
-      onTabClick = _a.onTabClick,
-      _a$prefixCls = _a.prefixCls,
-      prefixCls = _a$prefixCls === void 0 ? _prefix : _a$prefixCls,
-      directionProp = _a.direction,
-      _a$placement = _a.placement,
-      placement = _a$placement === void 0 ? 'horizontal' : _a$placement,
-      editable = _a.editable,
-      onAdd = _a.onAdd,
-      onDelete = _a.onDelete,
-      draggable = _a.draggable,
-      onDragStart = _a.onDragStart,
-      onDragOver = _a.onDragOver,
-      onDrop = _a.onDrop,
-      onDragEnd = _a.onDragEnd,
-      _a$type = _a.type,
-      type = _a$type === void 0 ? 'line' : _a$type,
-      extra = _a.extra,
-      rest = tslib.__rest(_a, ["data", "className", "style", "activeId", "defaultActiveId", "onChange", "onTabClick", "prefixCls", "direction", "placement", "editable", "onAdd", "onDelete", "draggable", "onDragStart", "onDragOver", "onDrop", "onDragEnd", "type", "extra"]);
-
+    className = _a.className,
+    style = _a.style,
+    activeId = _a.activeId,
+    defaultActiveId = _a.defaultActiveId,
+    onChange = _a.onChange,
+    onTabClick = _a.onTabClick,
+    _a$prefixCls = _a.prefixCls,
+    prefixCls = _a$prefixCls === void 0 ? _prefix : _a$prefixCls,
+    directionProp = _a.direction,
+    _a$placement = _a.placement,
+    placement = _a$placement === void 0 ? 'horizontal' : _a$placement,
+    editable = _a.editable,
+    onAdd = _a.onAdd,
+    onDelete = _a.onDelete,
+    draggable = _a.draggable,
+    onDragStart = _a.onDragStart,
+    onDragOver = _a.onDragOver,
+    onDrop = _a.onDrop,
+    onDragEnd = _a.onDragEnd,
+    _a$type = _a.type,
+    type = _a$type === void 0 ? 'line' : _a$type,
+    extra = _a.extra,
+    rest = tslib.__rest(_a, ["data", "className", "style", "activeId", "defaultActiveId", "onChange", "onTabClick", "prefixCls", "direction", "placement", "editable", "onAdd", "onDelete", "draggable", "onDragStart", "onDragOver", "onDrop", "onDragEnd", "type", "extra"]);
   var direction = (_b = placement !== null && placement !== void 0 ? placement : directionProp) !== null && _b !== void 0 ? _b : 'horizontal';
-
   var _useUncontrolledState = useUncontrolledState.useUncontrolledState(function () {
-    if (typeAssertion.isUndef(defaultActiveId)) {
-      return data[0] ? data[0].tabId : '';
-    }
-
-    return defaultActiveId;
-  }, activeId, onChange, Object.is),
-      activeTabId = _useUncontrolledState[0],
-      setActiveTabId = _useUncontrolledState[1];
-
+      if (typeAssertion.isUndef(defaultActiveId)) {
+        return data[0] ? data[0].tabId : '';
+      }
+      return defaultActiveId;
+    }, activeId, onChange, Object.is),
+    activeTabId = _useUncontrolledState[0],
+    setActiveTabId = _useUncontrolledState[1];
   var _useState = React.useState(null),
-      innerElement = _useState[0],
-      setInnerElement = _useState[1];
-
+    innerElement = _useState[0],
+    setInnerElement = _useState[1];
   var _useState2 = React.useState(null),
-      scrollElement = _useState2[0],
-      setScrollElement = _useState2[1];
-
+    scrollElement = _useState2[0],
+    setScrollElement = _useState2[1];
   var showHorizontal = direction === 'horizontal';
   var getClientSize = React.useCallback(function (element) {
     return showHorizontal ? element.clientWidth : element.clientHeight;
   }, [showHorizontal]);
-
   var _useState3 = React.useState(0),
-      translatePos = _useState3[0],
-      setTranslatePos = _useState3[1];
-
+    translatePos = _useState3[0],
+    setTranslatePos = _useState3[1];
   var _useState4 = React.useState(0),
-      translateBoundPos = _useState4[0],
-      setTranslateBoundPos = _useState4[1];
-
+    translateBoundPos = _useState4[0],
+    setTranslateBoundPos = _useState4[1];
   var itemsRef = React.useRef({});
-
   var _useState5 = React.useState(false),
-      showScrollBtn = _useState5[0],
-      setShowScrollBtn = _useState5[1];
-
+    showScrollBtn = _useState5[0],
+    setShowScrollBtn = _useState5[1];
   var resizeScroll = function resizeScroll(scrollSize, innerSize) {
     var showScrollBtn = scrollSize > innerSize;
     setShowScrollBtn(showScrollBtn);
-
     if (showScrollBtn) {
       setTranslateBoundPos(scrollSize - innerSize);
     }
-  }; // 响应式滚动按钮展示
-
-
+  };
+  // 响应式滚动按钮展示
   index.useResizeObserver({
     element: innerElement,
     getSize: getClientSize,
@@ -148,36 +104,32 @@ var TabList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
     onResize: function onResize(_, scrollSize) {
       if (innerElement) {
         var innerSize = getClientSize(innerElement);
-        resizeScroll(scrollSize, innerSize); // 每次滚动容器大小改变后，需要同步更新滚动位置
-
+        resizeScroll(scrollSize, innerSize);
+        // 每次滚动容器大小改变后，需要同步更新滚动位置
         initScrollPosition(activeId);
       }
     }
   });
   var getTabPos = React.useCallback(function (tabId) {
-    var target = 0; // 获取目标元素的位置
-
+    var target = 0;
+    // 获取目标元素的位置
     var targetElement = itemsRef.current[tabId];
-
     if (targetElement) {
       var rect = targetElement.getBoundingClientRect();
       target = showHorizontal ? rect.left : rect.top;
     }
-
     return target;
   }, [showHorizontal]);
   var getTabOffset = React.useCallback(function (tabId) {
     // 获取目标元素的位置
-    var targetPos = getTabPos(tabId); // 获取基准元素的位置（第一个）
-
+    var targetPos = getTabPos(tabId);
+    // 获取基准元素的位置（第一个）
     var basePos = 0;
-
     if (typeAssertion.isArrayNonEmpty(data)) {
       var baseItem = data[0];
       basePos = getTabPos(baseItem.tabId);
-    } // 返回目标元素相对基准元素的偏移量
-
-
+    }
+    // 返回目标元素相对基准元素的偏移量
     return targetPos ? targetPos - basePos : 0;
   }, [data, getTabPos]);
   var syncScrollPosition = React.useCallback(function (tabId) {
@@ -185,19 +137,16 @@ var TabList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
     if (!scrollElement) return;
     var scrollSize = getClientSize(scrollElement);
     var innerSize = getClientSize(innerElement);
-    var offsetValue = getTabOffset(tabId); // 左边或上半部内容展示不全
-
+    var offsetValue = getTabOffset(tabId);
+    // 左边或上半部内容展示不全
     var currentOffset = -translatePos;
-
     if (offsetValue < currentOffset) {
       setTranslatePos(-offsetValue);
     } else {
       // 右边或下半部内容展示不全
       var nextTabId = index$1.getNextTabId(data, tabId);
       var nextOffsetValue = nextTabId !== null ? getTabOffset(nextTabId) : scrollSize;
-
       var _currentOffset = -translatePos + innerSize;
-
       if (nextOffsetValue > _currentOffset) {
         setTranslatePos(translatePos - (nextOffsetValue - _currentOffset));
       }
@@ -215,19 +164,19 @@ var TabList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
     // activeId 受控模式下改变后，同步更新滚动位置
     initScrollPosition(activeId);
   }, [activeId, initScrollPosition]);
-  return /*#__PURE__*/React__default["default"].createElement("div", Object.assign({
+  return /*#__PURE__*/React.createElement("div", Object.assign({
     style: style,
     className: classname.cx(prefixCls + "__list", prefixCls + "__list--placement-" + direction, (_cx = {}, _cx[prefixCls + "__list--" + type] = type, _cx), className),
     ref: ref
-  }, rest), showScrollBtn ? /*#__PURE__*/React__default["default"].createElement(iconButton.IconButton, {
+  }, rest), showScrollBtn ? /*#__PURE__*/React.createElement(iconButton.IconButton, {
     className: showHorizontal ? prefixCls + "__left-btn" : prefixCls + "__up-btn",
     effect: true,
     disabled: translatePos === 0,
-    icon: showHorizontal ? /*#__PURE__*/React__default["default"].createElement(icons.LeftOutlined, null) : /*#__PURE__*/React__default["default"].createElement(icons.UpOutlined, null),
+    icon: showHorizontal ? /*#__PURE__*/React.createElement(icons.LeftOutlined, null) : /*#__PURE__*/React.createElement(icons.UpOutlined, null),
     onClick: function onClick() {
       if (!scrollElement) return;
-      if (!innerElement) return; // 向前面滚动
-
+      if (!innerElement) return;
+      // 向前面滚动
       var clientSize = getClientSize(innerElement);
       var canScroll = -translatePos - clientSize;
       var moveWidth = canScroll >= 0 ? clientSize : -translatePos;
@@ -235,17 +184,17 @@ var TabList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
         return prev + moveWidth;
       });
     }
-  }) : null, /*#__PURE__*/React__default["default"].createElement("div", {
+  }) : null, /*#__PURE__*/React.createElement("div", {
     className: classname.cx(prefixCls + "__list--inner"),
     ref: setInnerElement
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: classname.cx(prefixCls + "__list--scroll"),
     ref: setScrollElement,
     style: showScrollBtn ? {
       transform: direction === 'horizontal' ? "translateX(" + translatePos + "px)" : "translateY(" + translatePos + "px)"
     } : undefined
   }, data.map(function (item, index) {
-    return /*#__PURE__*/React__default["default"].createElement(TabItem.TabItem, Object.assign({
+    return /*#__PURE__*/React.createElement(TabItem.TabItem, Object.assign({
       key: index
     }, item, {
       ref: function ref(node) {
@@ -266,21 +215,21 @@ var TabList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
       onDragEnd: onDragEnd,
       direction: direction
     }));
-  }), type === 'line' ? /*#__PURE__*/React__default["default"].createElement(TabInk.TabInk, {
+  }), type === 'line' ? /*#__PURE__*/React.createElement(TabInk.TabInk, {
     prefixCls: prefixCls,
     showHorizontal: showHorizontal,
     activeItemElement: itemsRef.current[activeTabId],
     activeTabId: activeTabId,
     getTabOffset: getTabOffset
-  }) : null)), showScrollBtn ? /*#__PURE__*/React__default["default"].createElement(iconButton.IconButton, {
+  }) : null)), showScrollBtn ? /*#__PURE__*/React.createElement(iconButton.IconButton, {
     effect: true,
     className: showHorizontal ? prefixCls + "__right-btn" : prefixCls + "__down-btn",
     disabled: translateBoundPos === -translatePos,
-    icon: showHorizontal ? /*#__PURE__*/React__default["default"].createElement(icons.RightOutlined, null) : /*#__PURE__*/React__default["default"].createElement(icons.DownOutlined, null),
+    icon: showHorizontal ? /*#__PURE__*/React.createElement(icons.RightOutlined, null) : /*#__PURE__*/React.createElement(icons.DownOutlined, null),
     onClick: function onClick() {
       if (!scrollElement) return;
-      if (!innerElement) return; // 向后面滚动
-
+      if (!innerElement) return;
+      // 向后面滚动
       var scrollSize = getClientSize(scrollElement);
       var innerSize = getClientSize(innerElement);
       var canScrollWidth = scrollSize - innerSize + translatePos;
@@ -289,15 +238,13 @@ var TabList = /*#__PURE__*/React.forwardRef(function (_a, ref) {
         return prev - moveWidth;
       });
     }
-  }) : null, editable ? /*#__PURE__*/React__default["default"].createElement(iconButton.IconButton, {
-    icon: /*#__PURE__*/React__default["default"].createElement(icons.PlusOutlined, null),
+  }) : null, editable ? /*#__PURE__*/React.createElement(iconButton.IconButton, {
+    icon: /*#__PURE__*/React.createElement(icons.PlusOutlined, null),
     className: prefixCls + "__add-btn",
     onClick: onAdd
   }) : null, extra);
 });
-
 if (env.__DEV__) {
   TabList.displayName = 'TabList';
 }
-
 exports.TabList = TabList;