@arco-design/mobile-react 2.38.4 → 2.39.0

package/cjs/tabs/style/css/index.js

@@ -1,5 +1,4 @@
 "use strict";
 
 require("../../../../style/css/public.css");
-
 require("./index.css");

package/cjs/tabs/style/index.js

@@ -1,5 +1,4 @@
 "use strict";
 
 require("../../../style/public.less");
-
 require("./index.less");

package/cjs/tabs/tab-cell-underline.js

@@ -1,63 +1,49 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 exports.__esModule = true;
 exports.default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _mobileUtils = require("@arco-design/mobile-utils");
-
 var _helpers = require("../_helpers");
-
 var _contextProvider = require("../context-provider");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 var TabCellUnderline = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var prefix = props.prefix,
-      useCaterpillar = props.useCaterpillar,
-      distance = props.distance,
-      tabDirection = props.tabDirection,
-      underlineInnerStyle = props.underlineInnerStyle,
-      duration = props.duration,
-      cellTrans = props.cellTrans,
-      showLine = props.showLine,
-      activeIndex = props.activeIndex,
-      wrapWidth = props.wrapWidth,
-      wrapHeight = props.wrapHeight,
-      jumpingDis = props.jumpingDis,
-      translateZ = props.translateZ,
-      caterpillarMaxScale = props.caterpillarMaxScale,
-      caterpillarProperty = props.caterpillarProperty,
-      underlineSize = props.underlineSize,
-      underlineThick = props.underlineThick,
-      underlineAdaptive = props.underlineAdaptive,
-      renderUnderline = props.renderUnderline,
-      getTabRect = props.getTabRect,
-      getTabCenterLeft = props.getTabCenterLeft;
-
+    useCaterpillar = props.useCaterpillar,
+    distance = props.distance,
+    tabDirection = props.tabDirection,
+    underlineInnerStyle = props.underlineInnerStyle,
+    duration = props.duration,
+    cellTrans = props.cellTrans,
+    showLine = props.showLine,
+    activeIndex = props.activeIndex,
+    wrapWidth = props.wrapWidth,
+    wrapHeight = props.wrapHeight,
+    jumpingDis = props.jumpingDis,
+    translateZ = props.translateZ,
+    caterpillarMaxScale = props.caterpillarMaxScale,
+    caterpillarProperty = props.caterpillarProperty,
+    underlineSize = props.underlineSize,
+    underlineThick = props.underlineThick,
+    underlineAdaptive = props.underlineAdaptive,
+    renderUnderline = props.renderUnderline,
+    getTabRect = props.getTabRect,
+    getTabCenterLeft = props.getTabCenterLeft;
   var _useContext = (0, _react.useContext)(_contextProvider.GlobalContext),
-      useRtl = _useContext.useRtl;
-
+    useRtl = _useContext.useRtl;
   var _useState = (0, _react.useState)({}),
-      underlineStyle = _useState[0],
-      setUnderlineStyle = _useState[1];
-
+    underlineStyle = _useState[0],
+    setUnderlineStyle = _useState[1];
   var _useRefState = (0, _helpers.useRefState)(false),
-      caterpillar = _useRefState[0],
-      caterpillarRef = _useRefState[1],
-      setCaterpillar = _useRefState[2];
-
+    caterpillar = _useRefState[0],
+    caterpillarRef = _useRefState[1],
+    setCaterpillar = _useRefState[2];
   var _useState2 = (0, _react.useState)(0),
-      caterpillarDelay = _useState2[0],
-      setCaterpillarDelay = _useState2[1];
-
+    caterpillarDelay = _useState2[0],
+    setCaterpillarDelay = _useState2[1];
   var lineRef = (0, _react.useRef)(null);
   var timeRef = (0, _react.useRef)(0);
   var system = (0, _helpers.useSystem)();
@@ -75,30 +61,24 @@ var TabCellUnderline = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
     if (!useCaterpillar) {
       return '';
     }
-
     if (caterpillarProperty === 'size') {
       return "tabsCaterpillar" + (isVertical ? 'W' : 'H') + maxScaleWithDefault;
     }
-
     if (caterpillarMaxScale) {
       return "tabsCaterpillar" + (isVertical ? 'X' : 'Y') + caterpillarMaxScale;
     }
-
     return '';
   }, [useCaterpillar, isVertical, caterpillarMaxScale, caterpillarProperty]);
   (0, _react.useEffect)(function () {
     if (!animationKey) {
       return;
     }
-
     var dir = isVertical ? 'X' : 'Y';
-
     if (caterpillarProperty === 'size') {
       var attr = isVertical ? 'width' : 'height';
       (0, _mobileUtils.addCssKeyframes)(animationKey, "{\n                        0% {\n                            " + attr + ": 100%;\n                        }\n                        50% {\n                            " + attr + ": " + 100 * maxScaleWithDefault + "%;\n                        }\n                        100% {\n                            " + attr + ": 100%;\n                        }\n                    }");
       return;
     }
-
     (0, _mobileUtils.addCssKeyframes)(animationKey, "{\n                    0% {\n                        transform: scale" + dir + "(1)" + translateZStr + ";\n                        -webkit-transform: scale" + dir + "(1)" + translateZStr + ";\n                    }\n                    50% {\n                        transform: scale" + dir + "(" + caterpillarMaxScale + ")" + translateZStr + ";\n                        -webkit-transform: scale" + dir + "(" + caterpillarMaxScale + ")" + translateZStr + ";\n                    }\n                    100% {\n                        transform: scale" + dir + "(1)" + translateZStr + ";\n                        -webkit-transform: scale" + dir + "(1)" + translateZStr + ";\n                    }\n                }");
     return function () {
       (0, _mobileUtils.removeCssStyleDom)(animationKey);
@@ -113,54 +93,41 @@ var TabCellUnderline = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
   (0, _react.useEffect)(function () {
     resetUnderlineStyle();
   }, [useCaterpillar, caterpillar, cellTrans, duration, tabDirection, wrapWidth, wrapHeight, distance, animationKey, caterpillarDelay, underlineSize, underlineThick, underlineAdaptive]);
-
   function getLineWidth(index) {
     var _lineRef$current, _lineRef$current2;
-
     if (underlineAdaptive) {
       return getTabRect(index).width;
     }
-
     var offsetSize = isVertical ? (_lineRef$current = lineRef.current) == null ? void 0 : _lineRef$current.offsetWidth : (_lineRef$current2 = lineRef.current) == null ? void 0 : _lineRef$current2.offsetHeight;
     var lineWidth = offsetSize || 0;
     return lineWidth;
   }
-
   function getLineLeft(index) {
     if (underlineAdaptive) {
       return getTabRect(index).left;
     }
-
     var lineWidth = getLineWidth(index);
     return getTabCenterLeft(index) - lineWidth / 2;
   }
-
   function getDescIndex() {
     var comparedDis = distance * rtlRatio;
-
     if (comparedDis > 0) {
       return activeIndex - 1;
     }
-
     if (comparedDis < 0) {
       return activeIndex + 1;
     }
-
     return activeIndex;
   }
-
   function getLineScale(ratio) {
     var absRatio = Math.abs(ratio);
     return absRatio > 0.5 ? (1 - absRatio) * 2 * (maxScaleWithDefault - 1) + 1 : absRatio * 2 * (maxScaleWithDefault - 1) + 1;
   }
-
   function getLineStyle() {
     var _ref;
-
     if (!lineRef.current) {
       return {};
     }
-
     var currentLeft = getLineLeft(activeIndex);
     var descIndex = getDescIndex();
     var descLeft = getLineLeft(descIndex);
@@ -173,10 +140,8 @@ var TabCellUnderline = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
     } : {};
     var adaptiveStyle = {};
     var adaptiveOuterStyle = {};
-
     if (underlineAdaptive) {
       var _adaptiveStyle;
-
       var currentWidth = getLineWidth(activeIndex);
       var descWidth = getLineWidth(descIndex);
       var widthOffset = moveRatio * (currentWidth - descWidth);
@@ -187,7 +152,6 @@ var TabCellUnderline = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
         height: 'auto'
       };
     }
-
     var outerSize = isVertical ? {
       width: underlineSize,
       height: underlineThick
@@ -202,24 +166,19 @@ var TabCellUnderline = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
       inner: (0, _extends2.default)({}, transStyle, adaptiveStyle)
     };
   }
-
   function getUnderlineStyle() {
     var transStyle = {};
-
     if (!underlineAdaptive) {
       if (useCaterpillar) {
         transStyle.animationDuration = duration + "ms";
       }
-
       if (caterpillarRef.current && animationKey) {
         transStyle.animationName = animationKey;
       }
-
       if (caterpillarDelay) {
         transStyle.animationDelay = "-" + caterpillarDelay + "ms";
       }
     }
-
     var lineStyle = getLineStyle();
     return {
       outer: (0, _helpers.getStyleWithVendor)((0, _extends2.default)({
@@ -228,36 +187,29 @@ var TabCellUnderline = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
       inner: (0, _helpers.getStyleWithVendor)((0, _extends2.default)({}, transStyle, lineStyle.inner || {}))
     };
   }
-
   function resetUnderlineStyle() {
     setUnderlineStyle(getUnderlineStyle());
   }
-
   function setCaterpillarAnimate(movedRatio) {
     if (movedRatio === void 0) {
       movedRatio = 0;
     }
-
     if (!duration) {
       return;
     }
-
     var movedTime = (duration || 0) * Math.abs(movedRatio);
     setCaterpillarDelay(movedTime);
     (0, _mobileUtils.nextTick)(function () {
       setCaterpillar(true);
     });
-
     if (timeRef.current) {
       clearTimeout(timeRef.current);
     }
-
     timeRef.current = window.setTimeout(function () {
       setCaterpillar(false);
       setCaterpillarDelay(0);
     }, (duration || 0) - movedTime + 20);
   }
-
   return renderUnderline ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, renderUnderline(underlineStyle, showLine, lineRef)) : /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _mobileUtils.cls)(prefix + "-underline", {
       show: showLine

package/cjs/tabs/tab-cell.js

@@ -1,109 +1,91 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 exports.__esModule = true;
 exports.default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _mobileUtils = require("@arco-design/mobile-utils");
-
 var _helpers = require("../_helpers");
-
 var _tabCellUnderline = _interopRequireDefault(require("./tab-cell-underline"));
-
 var _contextProvider = require("../context-provider");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var tabs = props.tabs,
-      prefixCls = props.prefixCls,
-      activeIndex = props.activeIndex,
-      activeIndexRef = props.activeIndexRef,
-      tabDirection = props.tabDirection,
-      type = props.type,
-      onTabClick = props.onTabClick,
-      changeIndex = props.changeIndex,
-      tabBarPosition = props.tabBarPosition,
-      tabBarArrange = props.tabBarArrange,
-      tabBarScroll = props.tabBarScroll,
-      tabBarFixed = props.tabBarFixed,
-      renderUnderline = props.renderUnderline,
-      duration = props.duration,
-      transitionDuration = props.transitionDuration,
-      useCaterpillar = props.useCaterpillar,
-      wrapWidth = props.wrapWidth,
-      wrapHeight = props.wrapHeight,
-      cellTrans = props.cellTrans,
-      distance = props.distance,
-      jumpingDis = props.jumpingDis,
-      tabBarExtra = props.tabBarExtra,
-      onTabBarOverflowChange = props.onTabBarOverflowChange,
-      tabBarGutter = props.tabBarGutter,
-      tabBarPadding = props.tabBarPadding,
-      underlineSize = props.underlineSize,
-      underlineThick = props.underlineThick,
-      underlineInnerStyle = props.underlineInnerStyle,
-      caterpillarMaxScale = props.caterpillarMaxScale,
-      caterpillarProperty = props.caterpillarProperty,
-      onTabBarScroll = props.onTabBarScroll,
-      hideTabBarBeforeMounted = props.hideTabBarBeforeMounted,
-      _props$overflowThresh = props.overflowThreshold,
-      overflowThreshold = _props$overflowThresh === void 0 ? 5 : _props$overflowThresh,
-      tabBarScrollBezier = props.tabBarScrollBezier,
-      tabBarScrollDuration = props.tabBarScrollDuration,
-      tabBarScrollChance = props.tabBarScrollChance,
-      tabBarHasDivider = props.tabBarHasDivider,
-      showUnderline = props.showUnderline,
-      underlineAdaptive = props.underlineAdaptive,
-      disabled = props.disabled,
-      renderTabBarItem = props.renderTabBarItem,
-      renderTabBarInner = props.renderTabBarInner,
-      tabBarStyle = props.tabBarStyle,
-      tabBarClass = props.tabBarClass,
-      translateZ = props.translateZ,
-      tabBarStopPropagation = props.tabBarStopPropagation,
-      onUnderlineFirstShow = props.onUnderlineFirstShow;
+    prefixCls = props.prefixCls,
+    activeIndex = props.activeIndex,
+    activeIndexRef = props.activeIndexRef,
+    tabDirection = props.tabDirection,
+    type = props.type,
+    onTabClick = props.onTabClick,
+    changeIndex = props.changeIndex,
+    tabBarPosition = props.tabBarPosition,
+    tabBarArrange = props.tabBarArrange,
+    tabBarScroll = props.tabBarScroll,
+    tabBarFixed = props.tabBarFixed,
+    renderUnderline = props.renderUnderline,
+    duration = props.duration,
+    transitionDuration = props.transitionDuration,
+    useCaterpillar = props.useCaterpillar,
+    wrapWidth = props.wrapWidth,
+    wrapHeight = props.wrapHeight,
+    cellTrans = props.cellTrans,
+    distance = props.distance,
+    jumpingDis = props.jumpingDis,
+    tabBarExtra = props.tabBarExtra,
+    onTabBarOverflowChange = props.onTabBarOverflowChange,
+    tabBarGutter = props.tabBarGutter,
+    tabBarPadding = props.tabBarPadding,
+    underlineSize = props.underlineSize,
+    underlineThick = props.underlineThick,
+    underlineInnerStyle = props.underlineInnerStyle,
+    caterpillarMaxScale = props.caterpillarMaxScale,
+    caterpillarProperty = props.caterpillarProperty,
+    onTabBarScroll = props.onTabBarScroll,
+    hideTabBarBeforeMounted = props.hideTabBarBeforeMounted,
+    _props$overflowThresh = props.overflowThreshold,
+    overflowThreshold = _props$overflowThresh === void 0 ? 5 : _props$overflowThresh,
+    tabBarScrollBezier = props.tabBarScrollBezier,
+    tabBarScrollDuration = props.tabBarScrollDuration,
+    tabBarScrollChance = props.tabBarScrollChance,
+    tabBarHasDivider = props.tabBarHasDivider,
+    showUnderline = props.showUnderline,
+    underlineAdaptive = props.underlineAdaptive,
+    disabled = props.disabled,
+    renderTabBarItem = props.renderTabBarItem,
+    renderTabBarInner = props.renderTabBarInner,
+    tabBarStyle = props.tabBarStyle,
+    tabBarClass = props.tabBarClass,
+    translateZ = props.translateZ,
+    tabBarStopPropagation = props.tabBarStopPropagation,
+    onUnderlineFirstShow = props.onUnderlineFirstShow;
   var prefix = prefixCls + "-tab-cell";
-
   var _useContext = (0, _react.useContext)(_contextProvider.GlobalContext),
-      useRtl = _useContext.useRtl;
-
+    useRtl = _useContext.useRtl;
   var domRef = (0, _react.useRef)(null);
   var underlineRef = (0, _react.useRef)(null);
   var allCellRectRef = (0, _react.useRef)([]);
-
   var _useState = (0, _react.useState)(false),
-      showLine = _useState[0],
-      setShowLine = _useState[1];
-
+    showLine = _useState[0],
+    setShowLine = _useState[1];
   var _useState2 = (0, _react.useState)(false),
-      hasOverflow = _useState2[0],
-      setHasOverflow = _useState2[1];
-
+    hasOverflow = _useState2[0],
+    setHasOverflow = _useState2[1];
   var _useState3 = (0, _react.useState)(function () {
-    return tabs.length < overflowThreshold ? tabBarArrange : 'start';
-  }),
-      originArrange = _useState3[0],
-      setOriginArrange = _useState3[1];
-
+      return tabs.length < overflowThreshold ? tabBarArrange : 'start';
+    }),
+    originArrange = _useState3[0],
+    setOriginArrange = _useState3[1];
   var _useState4 = (0, _react.useState)(false),
-      forceUpdate = _useState4[0],
-      setForceUpdate = _useState4[1]; // 默认tab小于overflowThreshold个时不开启加载前隐藏，大于overflowThreshold个时开启
-
-
+    forceUpdate = _useState4[0],
+    setForceUpdate = _useState4[1];
+  // 默认tab小于overflowThreshold个时不开启加载前隐藏，大于overflowThreshold个时开启
   var _useState5 = (0, _react.useState)(function () {
-    return hideTabBarBeforeMounted === void 0 ? tabs.length < overflowThreshold || activeIndex === 0 : !hideTabBarBeforeMounted;
-  }),
-      showTab = _useState5[0],
-      setShowTab = _useState5[1];
-
+      return hideTabBarBeforeMounted === void 0 ? tabs.length < overflowThreshold || activeIndex === 0 : !hideTabBarBeforeMounted;
+    }),
+    showTab = _useState5[0],
+    setShowTab = _useState5[1];
   var isVertical = tabDirection === 'vertical';
   var isLine = (type || '').indexOf('line') !== -1;
   var isCard = type === 'card';
@@ -111,13 +93,11 @@ var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
    * 非card类型才有间隙和两侧留白
    * @en Non-card types have gaps and blank on both sides
    */
-
   var cellPadding = isCard ? void 0 : tabBarPadding;
   var cellGutter = isCard ? void 0 : tabBarGutter;
   var hasDivider = tabBarHasDivider === void 0 ? isLine : tabBarHasDivider;
   var wrapSize = isVertical ? wrapWidth : wrapHeight;
   var system = (0, _helpers.useSystem)();
-
   var updateScrollPosition = function updateScrollPosition() {
     if (wrapSize && tabBarScrollChance !== 'none') {
       setTimeout(function () {
@@ -125,15 +105,14 @@ var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       }, tabBarScrollChance === 'after-jump' ? Math.max(transitionDuration || 0, duration || 0) : 0);
     }
   };
-
   (0, _react.useEffect)(function () {
     (0, _mobileUtils.nextTick)(function () {
-      setCellOverflow(); // dom出来之后originArrange置空，交由tabBarArrange控制
+      setCellOverflow();
+      // dom出来之后originArrange置空，交由tabBarArrange控制
       // @en After the dom comes out, originArrange is left empty and controlled by tabBarArrange
-
-      setOriginArrange(void 0); // dom出来了才知道布局，计算完成后展示出来防止跳动的情况
+      setOriginArrange(void 0);
+      // dom出来了才知道布局，计算完成后展示出来防止跳动的情况
       // @en The layout is determined only when the dom comes out. It is displayed to prevent the jumping after the calculation is completed
-
       setShowTab(true);
       setShowLine(true);
     });
@@ -141,7 +120,6 @@ var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   (0, _react.useEffect)(function () {
     (0, _mobileUtils.nextTick)(function () {
       var _underlineRef$current;
-
       (_underlineRef$current = underlineRef.current) == null ? void 0 : _underlineRef$current.resetUnderlineStyle();
     });
   }, [activeIndex, tabs, getCellPadding('left'), getCellPadding('right'), tabBarGutter, tabDirection]);
@@ -157,24 +135,21 @@ var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   }, [showLine]);
   (0, _helpers.useUpdateEffect)(function () {
     var _underlineRef$current2;
-
     setCellOverflow();
     (_underlineRef$current2 = underlineRef.current) == null ? void 0 : _underlineRef$current2.resetUnderlineStyle();
     updateScrollPosition();
   }, [forceUpdate]);
   (0, _react.useEffect)(function () {
-    tabBarScrollChance !== 'none' && scrollToCenter(true); // TabCell左右可滚动时，防止触发父级touchmove事件导致滚不动
+    tabBarScrollChance !== 'none' && scrollToCenter(true);
+    // TabCell左右可滚动时，防止触发父级touchmove事件导致滚不动
     // @en When the TabCell can be scrolled left and right, prevent the parent touchmove event from being triggered which result in inability to scroll
-
     var stopFunc = function stopFunc(e) {
       return e.stopPropagation();
     };
-
     if (isVertical && hasOverflow && domRef.current && tabBarStopPropagation) {
       domRef.current.addEventListener('touchstart', stopFunc);
       domRef.current.addEventListener('touchmove', stopFunc);
     }
-
     return function () {
       if (isVertical && hasOverflow && domRef.current && tabBarStopPropagation) {
         domRef.current.removeEventListener('touchstart', stopFunc);
@@ -182,43 +157,35 @@ var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       }
     };
   }, [hasOverflow]);
-
   function setCellOverflow() {
     var overflow = false;
-
     if (domRef.current) {
       overflow = isVertical ? domRef.current.scrollWidth > domRef.current.offsetWidth : domRef.current.scrollHeight > domRef.current.offsetHeight;
     }
-
     if (overflow !== hasOverflow) {
       onTabBarOverflowChange && onTabBarOverflowChange(overflow);
     }
-
     setHasOverflow(overflow);
   }
-
   function scrollToCenter(rightNow) {
     if (!wrapSize || !hasOverflow) {
       return;
     }
-
     var currentTabLeft = getTabCenterLeft(activeIndexRef.current);
     var newLeft = currentTabLeft - wrapSize / 2;
     scrollTo(newLeft, rightNow);
   }
-
   function scrollTo(position, rightNow) {
     if (!domRef.current) {
       return;
     }
-
-    var needRafScroll = false; // 部分安卓机在动画和raf同时执行时会卡顿
+    var needRafScroll = false;
+    // 部分安卓机在动画和raf同时执行时会卡顿
     // @en Some Android machines will freeze when animation and raf are executed at the same time
     // 如果是安卓机，且对滚动的时长和变化曲线无要求时，优先用原生顺滑滚动
     // @en If it is an Android device, and there is no requirement for the scrolling duration and change curve, the native smooth scrolling is preferred
     // 当浏览器不支持原生顺滑滚动，或对上述滚动参数有要求时，用raf滚动兜底
     // @en When the browser does not support native smooth scrolling, or there are requirements for the above scrolling parameters, use raf to scroll the bottom line
-
     if (system === 'android' && tabBarScrollBezier === void 0 && tabBarScrollDuration === void 0) {
       try {
         var disObj = isVertical ? {
@@ -235,7 +202,6 @@ var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     } else {
       needRafScroll = true;
     }
-
     if (needRafScroll) {
       (0, _mobileUtils.scrollWithAnimation)(isVertical ? domRef.current.scrollLeft : domRef.current.scrollTop, position, function (top) {
         if (domRef.current) {
@@ -248,7 +214,6 @@ var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       }, rightNow ? 0 : tabBarScrollDuration, tabBarScrollBezier);
     }
   }
-
   function getTabRect(index) {
     var currentTab = allCellRectRef.current[index] || {};
     return {
@@ -256,57 +221,43 @@ var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       width: (isVertical ? currentTab.width : currentTab.height) || 0
     };
   }
-
   function getTabCenterLeft(index) {
     var _getTabRect = getTabRect(index),
-        currentTabLeft = _getTabRect.left,
-        currentTabWidth = _getTabRect.width;
-
+      currentTabLeft = _getTabRect.left,
+      currentTabWidth = _getTabRect.width;
     return currentTabLeft + currentTabWidth / 2;
   }
-
   function getCellPadding(pType) {
     if (typeof cellPadding === 'object') {
       return cellPadding[pType];
     }
-
     return cellPadding;
   }
-
   function getCellStyle(index) {
     var _ref2;
-
     if (!isVertical) {
       return {};
     }
-
     var marginStart = useRtl ? 'marginRight' : 'marginLeft';
     var marginEnd = useRtl ? 'marginLeft' : 'marginRight';
-
     if (index === 0) {
       var _ref;
-
       return _ref = {}, _ref[marginEnd] = cellGutter, _ref[marginStart] = getCellPadding('left'), _ref;
     }
-
     return _ref2 = {}, _ref2[marginEnd] = index === tabs.length - 1 ? void 0 : cellGutter, _ref2;
   }
-
   function renderBarItem(tab, index) {
     if (renderTabBarItem) {
       return renderTabBarItem(tab, index, {
         active: index === activeIndex
       });
     }
-
     return typeof tab === 'string' ? tab : tab.title;
   }
-
   var renderTabUnderline = function renderTabUnderline() {
     if (!showUnderline || !isLine) {
       return null;
     }
-
     var lineProps = {
       prefix: prefix,
       showLine: showLine,
@@ -334,7 +285,6 @@ var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       getTabRect: getTabRect
     }, lineProps));
   };
-
   var cellInner = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, tabs.map(function (tab, index) {
     return /*#__PURE__*/_react.default.createElement("div", {
       key: index,
@@ -352,7 +302,6 @@ var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
         if (disabled) {
           return;
         }
-
         changeIndex(index, 'click');
         onTabClick && onTabClick(tab, index, e);
       },
@@ -375,13 +324,11 @@ var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       height: '100%'
     }
   }) : null);
-
   var _updateLayout = function updateLayout() {
     setForceUpdate(function (val) {
       return !val;
     });
   };
-
   (0, _react.useImperativeHandle)(ref, function () {
     return {
       dom: domRef.current,
@@ -390,12 +337,10 @@ var TabCell = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       hasOverflow: hasOverflow,
       setCaterpillarAnimate: function setCaterpillarAnimate(ratio) {
         var _underlineRef$current3;
-
         return (_underlineRef$current3 = underlineRef.current) == null ? void 0 : _underlineRef$current3.setCaterpillarAnimate(ratio);
       },
       resetUnderlineStyle: function resetUnderlineStyle() {
         var _underlineRef$current4;
-
         return (_underlineRef$current4 = underlineRef.current) == null ? void 0 : _underlineRef$current4.resetUnderlineStyle();
       },
       updateLayout: function updateLayout() {