rc-tabs - npm Package Compare versions

Comparing version 12.3.0 to 12.4.1

es/hooks/useAnimateConfig.js

@@ -10,3 +10,2 @@ import _typeof from "@babel/runtime/helpers/esm/typeof";
   var mergedAnimated;
-
   if (animated === false) {
@@ -26,9 +25,7 @@ mergedAnimated = {
     }, _typeof(animated) === 'object' ? animated : {});
-  } // Enable tabPane animation if provide motion
-
-
+  }
+  // Enable tabPane animation if provide motion
   if (mergedAnimated.tabPaneMotion && mergedAnimated.tabPane === undefined) {
     mergedAnimated.tabPane = true;
   }
-
   if (!mergedAnimated.tabPaneMotion && mergedAnimated.tabPane) {
@@ -38,7 +35,5 @@ if (process.env.NODE_ENV !== 'production') {
     }
-
     mergedAnimated.tabPane = false;
   }
-
   return mergedAnimated;
 }

es/hooks/useOffsets.js

@@ -12,25 +12,19 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
     var _tabs$;
-
     var map = new Map();
     var lastOffset = tabSizes.get((_tabs$ = tabs[0]) === null || _tabs$ === void 0 ? void 0 : _tabs$.key) || DEFAULT_SIZE;
     var rightOffset = lastOffset.left + lastOffset.width;
-
     for (var i = 0; i < tabs.length; i += 1) {
       var key = tabs[i].key;
-      var data = tabSizes.get(key); // Reuse last one when not exist yet
-
+      var data = tabSizes.get(key);
+      // Reuse last one when not exist yet
       if (!data) {
         var _tabs;
-
         data = tabSizes.get((_tabs = tabs[i - 1]) === null || _tabs === void 0 ? void 0 : _tabs.key) || DEFAULT_SIZE;
       }
-
-      var entity = map.get(key) || _objectSpread({}, data); // Right
-
-
-      entity.right = rightOffset - entity.left - entity.width; // Update entity
-
+      var entity = map.get(key) || _objectSpread({}, data);
+      // Right
+      entity.right = rightOffset - entity.left - entity.width;
+      // Update entity
       map.set(key, entity);
     }
-
     return map;
@@ -37,0 +31,0 @@ }, [tabs.map(function (tab) {

es/hooks/useRaf.d.ts

 export default function useRaf<Callback extends Function>(callback: Callback): (...args: any[]) => void;
-declare type Callback<T> = (ori: T) => T;
+type Callback<T> = (ori: T) => T;
 export declare function useRafState<T>(defaultState: T | (() => T)): [T, (updater: Callback<T>) => void];
 export {};

es/hooks/useRaf.js

@@ -7,3 +7,2 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
   var removedRef = useRef(false);
-
   function trigger() {
@@ -13,3 +12,2 @@ for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
     }
-
     if (!removedRef.current) {
@@ -22,3 +20,2 @@ raf.cancel(rafRef.current);
   }
-
   useEffect(function () {
@@ -36,7 +33,5 @@ //be compatible with react 18 StrictMode in dev
   var batchRef = useRef([]);
-
   var _useState = useState({}),
-      _useState2 = _slicedToArray(_useState, 2),
-      forceUpdate = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    forceUpdate = _useState2[1];
   var state = useRef(typeof defaultState === 'function' ? defaultState() : defaultState);
@@ -52,3 +47,2 @@ var flushUpdate = useRaf(function () {
   });
-
   function updater(callback) {
@@ -58,4 +52,3 @@ batchRef.current.push(callback);
   }
-
   return [state.current, updater];
 }

es/hooks/useRefs.js

@@ -5,3 +5,2 @@ import * as React from 'react';
   var cacheRefs = useRef(new Map());
-
   function getRef(key) {
@@ -11,11 +10,8 @@ if (!cacheRefs.current.has(key)) {
     }
-
     return cacheRefs.current.get(key);
   }
-
   function removeRef(key) {
     cacheRefs.current.delete(key);
   }
-
   return [getRef, removeRef];
 }

es/hooks/useSyncState.d.ts

@@ -1,3 +0,3 @@
-declare type Updater<T> = (prev: T) => T;
+type Updater<T> = (prev: T) => T;
 export default function useSyncState<T>(defaultState: T, onChange: (newValue: T, prevValue: T) => void): [T, (updater: T | Updater<T>) => void];
 export {};

es/hooks/useSyncState.js

@@ -5,19 +5,14 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
   var stateRef = React.useRef(defaultState);
-
   var _React$useState = React.useState({}),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      forceUpdate = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    forceUpdate = _React$useState2[1];
   function setState(updater) {
     var newValue = typeof updater === 'function' ? updater(stateRef.current) : updater;
-
     if (newValue !== stateRef.current) {
       onChange(newValue, stateRef.current);
     }
-
     stateRef.current = newValue;
     forceUpdate({});
   }
-
   return [stateRef.current, setState];
 }

es/hooks/useTouchMove.js

@@ -7,32 +7,28 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 var REFRESH_INTERVAL = 20;
-var SPEED_OFF_MULTIPLE = Math.pow(0.995, REFRESH_INTERVAL); // ================================= Hook =================================
-
+var SPEED_OFF_MULTIPLE = Math.pow(0.995, REFRESH_INTERVAL);
+// ================================= Hook =================================
 export default function useTouchMove(ref, onOffset) {
   var _useState = useState(),
-      _useState2 = _slicedToArray(_useState, 2),
-      touchPosition = _useState2[0],
-      setTouchPosition = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    touchPosition = _useState2[0],
+    setTouchPosition = _useState2[1];
   var _useState3 = useState(0),
-      _useState4 = _slicedToArray(_useState3, 2),
-      lastTimestamp = _useState4[0],
-      setLastTimestamp = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    lastTimestamp = _useState4[0],
+    setLastTimestamp = _useState4[1];
   var _useState5 = useState(0),
-      _useState6 = _slicedToArray(_useState5, 2),
-      lastTimeDiff = _useState6[0],
-      setLastTimeDiff = _useState6[1];
-
+    _useState6 = _slicedToArray(_useState5, 2),
+    lastTimeDiff = _useState6[0],
+    setLastTimeDiff = _useState6[1];
   var _useState7 = useState(),
-      _useState8 = _slicedToArray(_useState7, 2),
-      lastOffset = _useState8[0],
-      setLastOffset = _useState8[1];
-
-  var motionRef = useRef(); // ========================= Events =========================
+    _useState8 = _slicedToArray(_useState7, 2),
+    lastOffset = _useState8[0],
+    setLastOffset = _useState8[1];
+  var motionRef = useRef();
+  // ========================= Events =========================
   // >>> Touch events
-
   function onTouchStart(e) {
     var _e$touches$ = e.touches[0],
-        screenX = _e$touches$.screenX,
-        screenY = _e$touches$.screenY;
+      screenX = _e$touches$.screenX,
+      screenY = _e$touches$.screenY;
     setTouchPosition({
@@ -44,3 +40,2 @@ x: screenX,
   }
-
   function onTouchMove(e) {
@@ -50,4 +45,4 @@ if (!touchPosition) return;
     var _e$touches$2 = e.touches[0],
-        screenX = _e$touches$2.screenX,
-        screenY = _e$touches$2.screenY;
+      screenX = _e$touches$2.screenX,
+      screenY = _e$touches$2.screenY;
     setTouchPosition({
@@ -68,8 +63,7 @@ x: screenX,
   }
-
   function onTouchEnd() {
     if (!touchPosition) return;
     setTouchPosition(null);
-    setLastOffset(null); // Swipe if needed
-
+    setLastOffset(null);
+    // Swipe if needed
     if (lastOffset) {
@@ -79,4 +73,4 @@ var distanceX = lastOffset.x / lastTimeDiff;
       var absX = Math.abs(distanceX);
-      var absY = Math.abs(distanceY); // Skip swipe if low distance
-
+      var absY = Math.abs(distanceY);
+      // Skip swipe if low distance
       if (Math.max(absX, absY) < MIN_SWIPE_DISTANCE) return;
@@ -90,3 +84,2 @@ var currentX = distanceX;
         }
-
         currentX *= SPEED_OFF_MULTIPLE;
@@ -97,15 +90,12 @@ currentY *= SPEED_OFF_MULTIPLE;
     }
-  } // >>> Wheel event
-
-
+  }
+  // >>> Wheel event
   var lastWheelDirectionRef = useRef();
-
   function onWheel(e) {
     var deltaX = e.deltaX,
-        deltaY = e.deltaY; // Convert both to x & y since wheel only happened on PC
-
+      deltaY = e.deltaY;
+    // Convert both to x & y since wheel only happened on PC
     var mixed = 0;
     var absX = Math.abs(deltaX);
     var absY = Math.abs(deltaY);
-
     if (absX === absY) {
@@ -120,9 +110,7 @@ mixed = lastWheelDirectionRef.current === 'x' ? deltaX : deltaY;
     }
-
     if (onOffset(-mixed, -mixed)) {
       e.preventDefault();
     }
-  } // ========================= Effect =========================
-
-
+  }
+  // ========================= Effect =========================
   var touchEventsRef = useRef(null);
@@ -139,15 +127,11 @@ touchEventsRef.current = {
     }
-
     function onProxyTouchMove(e) {
       touchEventsRef.current.onTouchMove(e);
     }
-
     function onProxyTouchEnd(e) {
       touchEventsRef.current.onTouchEnd(e);
     }
-
     function onProxyWheel(e) {
       touchEventsRef.current.onWheel(e);
     }
-
     document.addEventListener('touchmove', onProxyTouchMove, {
@@ -158,4 +142,4 @@ passive: false
       passive: false
-    }); // No need to clean up since element removed
-
+    });
+    // No need to clean up since element removed
     ref.current.addEventListener('touchstart', onProxyTouchStart, {
@@ -162,0 +146,0 @@ passive: false

es/hooks/useVisibleRange.d.ts

 import type { Tab, TabOffsetMap } from '../interface';
 import type { TabNavListProps } from '../TabNavList';
-export declare type ContainerSizeInfo = [width: number, height: number, left: number, top: number];
+export type ContainerSizeInfo = [width: number, height: number, left: number, top: number];
 export default function useVisibleRange(tabOffsets: TabOffsetMap, visibleTabContentValue: number, transform: number, tabContentSizeValue: number, addNodeSizeValue: number, operationNodeSizeValue: number, { tabs, tabPosition, rtl }: {
     tabs: Tab[];
 } & TabNavListProps): [visibleStart: number, visibleEnd: number];

es/hooks/useVisibleRange.js

@@ -11,8 +11,7 @@ import { useMemo } from 'react';
   var tabs = _ref.tabs,
-      tabPosition = _ref.tabPosition,
-      rtl = _ref.rtl;
+    tabPosition = _ref.tabPosition,
+    rtl = _ref.rtl;
   var charUnit;
   var position;
   var transformSize;
-
   if (['top', 'bottom'].includes(tabPosition)) {
@@ -27,3 +26,2 @@ charUnit = 'width';
   }
-
   return useMemo(function () {
@@ -33,9 +31,6 @@ if (!tabs.length) {
     }
-
     var len = tabs.length;
     var endIndex = len;
-
     for (var i = 0; i < len; i += 1) {
       var offset = tabOffsets.get(tabs[i].key) || DEFAULT_SIZE;
-
       if (offset[position] + offset[charUnit] > transformSize + visibleTabContentValue) {
@@ -46,8 +41,5 @@ endIndex = i - 1;
     }
-
     var startIndex = 0;
-
     for (var _i = len - 1; _i >= 0; _i -= 1) {
       var _offset = tabOffsets.get(tabs[_i].key) || DEFAULT_SIZE;
-
       if (_offset[position] < transformSize) {
@@ -58,3 +50,2 @@ startIndex = _i + 1;
     }
-
     return [startIndex, endIndex];
@@ -61,0 +52,0 @@ }, [tabOffsets, visibleTabContentValue, tabContentSizeValue, addNodeSizeValue, operationNodeSizeValue, transformSize, tabPosition, tabs.map(function (tab) {

es/interface.d.ts

@@ -5,4 +5,4 @@ import type React from 'react';
 import type { TabPaneProps } from './TabPanelList/TabPane';
-export declare type SizeInfo = [width: number, height: number];
-export declare type TabSizeMap = Map<React.Key, {
+export type SizeInfo = [width: number, height: number];
+export type TabSizeMap = Map<React.Key, {
     width: number;
@@ -20,4 +20,4 @@ height: number;
 }
-export declare type TabOffsetMap = Map<React.Key, TabOffset>;
-export declare type TabPosition = 'left' | 'right' | 'top' | 'bottom';
+export type TabOffsetMap = Map<React.Key, TabOffset>;
+export type TabPosition = 'left' | 'right' | 'top' | 'bottom';
 export interface Tab extends Omit<TabPaneProps, 'tab'> {
@@ -27,3 +27,3 @@ key: string;
 }
-declare type RenderTabBarProps = {
+type RenderTabBarProps = {
     id: string;
@@ -47,3 +47,3 @@ activeKey: string;
 };
-export declare type RenderTabBar = (props: RenderTabBarProps, DefaultTabBar: React.ComponentType<TabNavListProps>) => React.ReactElement;
+export type RenderTabBar = (props: RenderTabBarProps, DefaultTabBar: React.ComponentType<TabNavListProps>) => React.ReactElement;
 export interface TabsLocale {
@@ -68,8 +68,8 @@ dropdownAriaLabel?: string;
 }
-export declare type OnTabScroll = (info: {
+export type OnTabScroll = (info: {
     direction: 'left' | 'right' | 'top' | 'bottom';
 }) => void;
-export declare type TabBarExtraPosition = 'left' | 'right';
-export declare type TabBarExtraMap = Partial<Record<TabBarExtraPosition, React.ReactNode>>;
-export declare type TabBarExtraContent = React.ReactNode | TabBarExtraMap;
+export type TabBarExtraPosition = 'left' | 'right';
+export type TabBarExtraMap = Partial<Record<TabBarExtraPosition, React.ReactNode>>;
+export type TabBarExtraContent = React.ReactNode | TabBarExtraMap;
 export {};

es/TabNavList/AddButton.js

 import * as React from 'react';
-
 function AddButton(_ref, ref) {
   var prefixCls = _ref.prefixCls,
-      editable = _ref.editable,
-      locale = _ref.locale,
-      style = _ref.style;
-
+    editable = _ref.editable,
+    locale = _ref.locale,
+    style = _ref.style;
   if (!editable || editable.showAdd === false) {
     return null;
   }
-
   return /*#__PURE__*/React.createElement("button", {
@@ -26,3 +23,2 @@ ref: ref,
 }
-
 export default /*#__PURE__*/React.forwardRef(AddButton);

es/TabNavList/ExtraContent.js

@@ -5,9 +5,8 @@ import _typeof from "@babel/runtime/helpers/esm/typeof";
   var position = _ref.position,
-      prefixCls = _ref.prefixCls,
-      extra = _ref.extra;
+    prefixCls = _ref.prefixCls,
+    extra = _ref.extra;
   if (!extra) return null;
-  var content; // Parse extra
-
+  var content;
+  // Parse extra
   var assertExtra = {};
-
   if (_typeof(extra) === 'object' && ! /*#__PURE__*/React.isValidElement(extra)) {
@@ -18,11 +17,8 @@ assertExtra = extra;
   }
-
   if (position === 'right') {
     content = assertExtra.right;
   }
-
   if (position === 'left') {
     content = assertExtra.left;
   }
-
   return content ? /*#__PURE__*/React.createElement("div", {
@@ -33,7 +29,5 @@ className: "".concat(prefixCls, "-extra-content"),
 });
-
 if (process.env.NODE_ENV !== 'production') {
   ExtraContent.displayName = 'ExtraContent';
 }
-
 export default ExtraContent;

es/TabNavList/index.js

@@ -24,10 +24,8 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import ExtraContent from './ExtraContent';
-
 var getSize = function getSize(refObj) {
   var _ref = refObj.current || {},
-      _ref$offsetWidth = _ref.offsetWidth,
-      offsetWidth = _ref$offsetWidth === void 0 ? 0 : _ref$offsetWidth,
-      _ref$offsetHeight = _ref.offsetHeight,
-      offsetHeight = _ref$offsetHeight === void 0 ? 0 : _ref$offsetHeight;
-
+    _ref$offsetWidth = _ref.offsetWidth,
+    offsetWidth = _ref$offsetWidth === void 0 ? 0 : _ref$offsetWidth,
+    _ref$offsetHeight = _ref.offsetHeight,
+    offsetHeight = _ref$offsetHeight === void 0 ? 0 : _ref$offsetHeight;
   return [offsetWidth, offsetHeight];
@@ -38,29 +36,24 @@ };
  */
-
-
 var getUnitValue = function getUnitValue(size, tabPositionTopOrBottom) {
   return size[tabPositionTopOrBottom ? 0 : 1];
 };
-
 function TabNavList(props, ref) {
   var _classNames;
-
   var _React$useContext = React.useContext(TabContext),
-      prefixCls = _React$useContext.prefixCls,
-      tabs = _React$useContext.tabs;
-
+    prefixCls = _React$useContext.prefixCls,
+    tabs = _React$useContext.tabs;
   var className = props.className,
-      style = props.style,
-      id = props.id,
-      animated = props.animated,
-      activeKey = props.activeKey,
-      rtl = props.rtl,
-      extra = props.extra,
-      editable = props.editable,
-      locale = props.locale,
-      tabPosition = props.tabPosition,
-      tabBarGutter = props.tabBarGutter,
-      children = props.children,
-      onTabClick = props.onTabClick,
-      onTabScroll = props.onTabScroll;
+    style = props.style,
+    id = props.id,
+    animated = props.animated,
+    activeKey = props.activeKey,
+    rtl = props.rtl,
+    extra = props.extra,
+    editable = props.editable,
+    locale = props.locale,
+    tabPosition = props.tabPosition,
+    tabBarGutter = props.tabBarGutter,
+    children = props.children,
+    onTabClick = props.onTabClick,
+    onTabScroll = props.onTabScroll;
   var containerRef = useRef();
@@ -73,59 +66,49 @@ var extraLeftRef = useRef();
   var innerAddButtonRef = useRef();
-
   var _useRefs = useRefs(),
-      _useRefs2 = _slicedToArray(_useRefs, 2),
-      getBtnRef = _useRefs2[0],
-      removeBtnRef = _useRefs2[1];
-
+    _useRefs2 = _slicedToArray(_useRefs, 2),
+    getBtnRef = _useRefs2[0],
+    removeBtnRef = _useRefs2[1];
   var tabPositionTopOrBottom = tabPosition === 'top' || tabPosition === 'bottom';
-
   var _useSyncState = useSyncState(0, function (next, prev) {
-    if (tabPositionTopOrBottom && onTabScroll) {
-      onTabScroll({
-        direction: next > prev ? 'left' : 'right'
-      });
-    }
-  }),
-      _useSyncState2 = _slicedToArray(_useSyncState, 2),
-      transformLeft = _useSyncState2[0],
-      setTransformLeft = _useSyncState2[1];
-
+      if (tabPositionTopOrBottom && onTabScroll) {
+        onTabScroll({
+          direction: next > prev ? 'left' : 'right'
+        });
+      }
+    }),
+    _useSyncState2 = _slicedToArray(_useSyncState, 2),
+    transformLeft = _useSyncState2[0],
+    setTransformLeft = _useSyncState2[1];
   var _useSyncState3 = useSyncState(0, function (next, prev) {
-    if (!tabPositionTopOrBottom && onTabScroll) {
-      onTabScroll({
-        direction: next > prev ? 'top' : 'bottom'
-      });
-    }
-  }),
-      _useSyncState4 = _slicedToArray(_useSyncState3, 2),
-      transformTop = _useSyncState4[0],
-      setTransformTop = _useSyncState4[1];
-
+      if (!tabPositionTopOrBottom && onTabScroll) {
+        onTabScroll({
+          direction: next > prev ? 'top' : 'bottom'
+        });
+      }
+    }),
+    _useSyncState4 = _slicedToArray(_useSyncState3, 2),
+    transformTop = _useSyncState4[0],
+    setTransformTop = _useSyncState4[1];
   var _useState = useState([0, 0]),
-      _useState2 = _slicedToArray(_useState, 2),
-      containerExcludeExtraSize = _useState2[0],
-      setContainerExcludeExtraSize = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    containerExcludeExtraSize = _useState2[0],
+    setContainerExcludeExtraSize = _useState2[1];
   var _useState3 = useState([0, 0]),
-      _useState4 = _slicedToArray(_useState3, 2),
-      tabContentSize = _useState4[0],
-      setTabContentSize = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    tabContentSize = _useState4[0],
+    setTabContentSize = _useState4[1];
   var _useState5 = useState([0, 0]),
-      _useState6 = _slicedToArray(_useState5, 2),
-      addSize = _useState6[0],
-      setAddSize = _useState6[1];
-
+    _useState6 = _slicedToArray(_useState5, 2),
+    addSize = _useState6[0],
+    setAddSize = _useState6[1];
   var _useState7 = useState([0, 0]),
-      _useState8 = _slicedToArray(_useState7, 2),
-      operationSize = _useState8[0],
-      setOperationSize = _useState8[1];
-
+    _useState8 = _slicedToArray(_useState7, 2),
+    operationSize = _useState8[0],
+    setOperationSize = _useState8[1];
   var _useRafState = useRafState(new Map()),
-      _useRafState2 = _slicedToArray(_useRafState, 2),
-      tabSizes = _useRafState2[0],
-      setTabSizes = _useRafState2[1];
-
-  var tabOffsets = useOffsets(tabs, tabSizes, tabContentSize[0]); // ========================== Unit =========================
-
+    _useRafState2 = _slicedToArray(_useRafState, 2),
+    tabSizes = _useRafState2[0],
+    setTabSizes = _useRafState2[1];
+  var tabOffsets = useOffsets(tabs, tabSizes, tabContentSize[0]);
+  // ========================== Unit =========================
   var containerExcludeExtraSizeValue = getUnitValue(containerExcludeExtraSize, tabPositionTopOrBottom);
@@ -136,8 +119,7 @@ var tabContentSizeValue = getUnitValue(tabContentSize, tabPositionTopOrBottom);
   var needScroll = containerExcludeExtraSizeValue < tabContentSizeValue + addSizeValue;
-  var visibleTabContentValue = needScroll ? containerExcludeExtraSizeValue - operationSizeValue : containerExcludeExtraSizeValue - addSizeValue; // ========================== Util =========================
-
+  var visibleTabContentValue = needScroll ? containerExcludeExtraSizeValue - operationSizeValue : containerExcludeExtraSizeValue - addSizeValue;
+  // ========================== Util =========================
   var operationsHiddenClassName = "".concat(prefixCls, "-nav-operations-hidden");
   var transformMin = 0;
   var transformMax = 0;
-
   if (!tabPositionTopOrBottom) {
@@ -153,3 +135,2 @@ transformMin = Math.min(0, visibleTabContentValue - tabContentSizeValue);
   }
-
   function alignInRange(value) {
@@ -159,26 +140,19 @@ if (value < transformMin) {
     }
-
     if (value > transformMax) {
       return transformMax;
     }
-
     return value;
-  } // ========================= Mobile ========================
-
-
+  }
+  // ========================= Mobile ========================
   var touchMovingRef = useRef();
-
   var _useState9 = useState(),
-      _useState10 = _slicedToArray(_useState9, 2),
-      lockAnimation = _useState10[0],
-      setLockAnimation = _useState10[1];
-
+    _useState10 = _slicedToArray(_useState9, 2),
+    lockAnimation = _useState10[0],
+    setLockAnimation = _useState10[1];
   function doLockAnimation() {
     setLockAnimation(Date.now());
   }
-
   function clearTouchMoving() {
     window.clearTimeout(touchMovingRef.current);
   }
-
   useTouchMove(tabsWrapperRef, function (offsetX, offsetY) {
@@ -190,9 +164,7 @@ function doMove(setState, offset) {
       });
-    } // Skip scroll if place is enough
-
-
+    }
+    // Skip scroll if place is enough
     if (containerExcludeExtraSizeValue >= tabContentSizeValue) {
       return false;
     }
-
     if (tabPositionTopOrBottom) {
@@ -203,3 +175,2 @@ doMove(setTransformLeft, offsetX);
     }
-
     clearTouchMoving();
@@ -211,3 +182,2 @@ doLockAnimation();
     clearTouchMoving();
-
     if (lockAnimation) {
@@ -218,20 +188,23 @@ touchMovingRef.current = window.setTimeout(function () {
     }
-
     return clearTouchMoving;
-  }, [lockAnimation]); // ===================== Visible Range =====================
+  }, [lockAnimation]);
+  // ===================== Visible Range =====================
   // Render tab node & collect tab offset
-
-  var _useVisibleRange = useVisibleRange(tabOffsets, // Container
-  visibleTabContentValue, // Transform
-  tabPositionTopOrBottom ? transformLeft : transformTop, // Tabs
-  tabContentSizeValue, // Add
-  addSizeValue, // Operation
-  operationSizeValue, _objectSpread(_objectSpread({}, props), {}, {
-    tabs: tabs
-  })),
-      _useVisibleRange2 = _slicedToArray(_useVisibleRange, 2),
-      visibleStart = _useVisibleRange2[0],
-      visibleEnd = _useVisibleRange2[1]; // ========================= Scroll ========================
-
-
+  var _useVisibleRange = useVisibleRange(tabOffsets,
+    // Container
+    visibleTabContentValue,
+    // Transform
+    tabPositionTopOrBottom ? transformLeft : transformTop,
+    // Tabs
+    tabContentSizeValue,
+    // Add
+    addSizeValue,
+    // Operation
+    operationSizeValue, _objectSpread(_objectSpread({}, props), {}, {
+      tabs: tabs
+    })),
+    _useVisibleRange2 = _slicedToArray(_useVisibleRange, 2),
+    visibleStart = _useVisibleRange2[0],
+    visibleEnd = _useVisibleRange2[1];
+  // ========================= Scroll ========================
   var scrollToTab = function scrollToTab() {
@@ -246,7 +219,6 @@ var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : activeKey;
     };
-
     if (tabPositionTopOrBottom) {
       // ============ Align with top & bottom ============
-      var newTransform = transformLeft; // RTL
-
+      var newTransform = transformLeft;
+      // RTL
       if (rtl) {
@@ -258,3 +230,4 @@ if (tabOffset.right < transformLeft) {
         }
-      } // LTR
+      }
+      // LTR
       else if (tabOffset.left < -transformLeft) {
@@ -265,3 +238,2 @@ newTransform = -tabOffset.left;
       }
-
       setTransformTop(0);
@@ -272,3 +244,2 @@ setTransformLeft(alignInRange(newTransform));
       var _newTransform = transformTop;
-
       if (tabOffset.top < -transformTop) {
@@ -279,11 +250,8 @@ _newTransform = -tabOffset.top;
       }
-
       setTransformLeft(0);
       setTransformTop(alignInRange(_newTransform));
     }
-  }; // ========================== Tab ==========================
-
-
+  };
+  // ========================== Tab ==========================
   var tabNodeStyle = {};
-
   if (tabPosition === 'top' || tabPosition === 'bottom') {
@@ -294,3 +262,2 @@ tabNodeStyle[rtl ? 'marginRight' : 'marginLeft'] = tabBarGutter;
   }
-
   var tabNodes = tabs.map(function (tab, i) {
@@ -303,4 +270,3 @@ var key = tab.key;
       tab: tab
-      /* first node should not have margin left */
-      ,
+      /* first node should not have margin left */,
       style: i === 0 ? undefined : tabNodeStyle,
@@ -322,12 +288,9 @@ closable: tab.closable,
         doLockAnimation();
-
         if (!tabsWrapperRef.current) {
           return;
-        } // Focus element will make scrollLeft change which we should reset back
-
-
+        }
+        // Focus element will make scrollLeft change which we should reset back
         if (!rtl) {
           tabsWrapperRef.current.scrollLeft = 0;
         }
-
         tabsWrapperRef.current.scrollTop = 0;
@@ -346,7 +309,7 @@ }
     var newOperationSize = getSize(operationsRef);
-    setOperationSize(newOperationSize); // Which includes add button size
-
+    setOperationSize(newOperationSize);
+    // Which includes add button size
     var tabContentFullSize = getSize(tabListRef);
-    setTabContentSize([tabContentFullSize[0] - newAddSize[0], tabContentFullSize[1] - newAddSize[1]]); // Update buttons records
-
+    setTabContentSize([tabContentFullSize[0] - newAddSize[0], tabContentFullSize[1] - newAddSize[1]]);
+    // Update buttons records
     setTabSizes(function () {
@@ -357,3 +320,2 @@ var newSizes = new Map();
         var btnNode = getBtnRef(key).current;
-
         if (btnNode) {
@@ -370,24 +332,20 @@ newSizes.set(key, {
     });
-  }); // ======================== Dropdown =======================
-
+  });
+  // ======================== Dropdown =======================
   var startHiddenTabs = tabs.slice(0, visibleStart);
   var endHiddenTabs = tabs.slice(visibleEnd + 1);
-  var hiddenTabs = [].concat(_toConsumableArray(startHiddenTabs), _toConsumableArray(endHiddenTabs)); // =================== Link & Operations ===================
-
+  var hiddenTabs = [].concat(_toConsumableArray(startHiddenTabs), _toConsumableArray(endHiddenTabs));
+  // =================== Link & Operations ===================
   var _useState11 = useState(),
-      _useState12 = _slicedToArray(_useState11, 2),
-      inkStyle = _useState12[0],
-      setInkStyle = _useState12[1];
-
-  var activeTabOffset = tabOffsets.get(activeKey); // Delay set ink style to avoid remove tab blink
-
+    _useState12 = _slicedToArray(_useState11, 2),
+    inkStyle = _useState12[0],
+    setInkStyle = _useState12[1];
+  var activeTabOffset = tabOffsets.get(activeKey);
+  // Delay set ink style to avoid remove tab blink
   var inkBarRafRef = useRef();
-
   function cleanInkBarRaf() {
     raf.cancel(inkBarRafRef.current);
   }
-
   useEffect(function () {
     var newInkStyle = {};
-
     if (activeTabOffset) {
@@ -400,3 +358,2 @@ if (tabPositionTopOrBottom) {
         }
-
         newInkStyle.width = activeTabOffset.width;
@@ -408,3 +365,2 @@ } else {
     }
-
     cleanInkBarRaf();
@@ -415,12 +371,14 @@ inkBarRafRef.current = raf(function () {
     return cleanInkBarRaf;
-  }, [activeTabOffset, tabPositionTopOrBottom, rtl]); // ========================= Effect ========================
-
+  }, [activeTabOffset, tabPositionTopOrBottom, rtl]);
+  // ========================= Effect ========================
   useEffect(function () {
-    scrollToTab(); // eslint-disable-next-line
-  }, [activeKey, stringify(activeTabOffset), stringify(tabOffsets), tabPositionTopOrBottom]); // Should recalculate when rtl changed
-
+    scrollToTab();
+    // eslint-disable-next-line
+  }, [activeKey, stringify(activeTabOffset), stringify(tabOffsets), tabPositionTopOrBottom]);
+  // Should recalculate when rtl changed
   useEffect(function () {
-    onListHolderResize(); // eslint-disable-next-line
-  }, [rtl]); // ========================= Render ========================
-
+    onListHolderResize();
+    // eslint-disable-next-line
+  }, [rtl]);
+  // ========================= Render ========================
   var hasDropdown = !!hiddenTabs.length;
@@ -432,3 +390,2 @@ var wrapPrefix = "".concat(prefixCls, "-nav-wrap");
   var pingBottom;
-
   if (tabPositionTopOrBottom) {
@@ -446,3 +403,2 @@ if (rtl) {
   }
-
   return /*#__PURE__*/React.createElement(ResizeObserver, {
@@ -449,0 +405,0 @@ onResize: onListHolderResize

es/TabNavList/OperationNode.js

@@ -10,33 +10,29 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import AddButton from './AddButton';
-
 function OperationNode(_ref, ref) {
   var prefixCls = _ref.prefixCls,
-      id = _ref.id,
-      tabs = _ref.tabs,
-      locale = _ref.locale,
-      mobile = _ref.mobile,
-      _ref$moreIcon = _ref.moreIcon,
-      moreIcon = _ref$moreIcon === void 0 ? 'More' : _ref$moreIcon,
-      moreTransitionName = _ref.moreTransitionName,
-      style = _ref.style,
-      className = _ref.className,
-      editable = _ref.editable,
-      tabBarGutter = _ref.tabBarGutter,
-      rtl = _ref.rtl,
-      removeAriaLabel = _ref.removeAriaLabel,
-      onTabClick = _ref.onTabClick,
-      getPopupContainer = _ref.getPopupContainer,
-      popupClassName = _ref.popupClassName;
-
+    id = _ref.id,
+    tabs = _ref.tabs,
+    locale = _ref.locale,
+    mobile = _ref.mobile,
+    _ref$moreIcon = _ref.moreIcon,
+    moreIcon = _ref$moreIcon === void 0 ? 'More' : _ref$moreIcon,
+    moreTransitionName = _ref.moreTransitionName,
+    style = _ref.style,
+    className = _ref.className,
+    editable = _ref.editable,
+    tabBarGutter = _ref.tabBarGutter,
+    rtl = _ref.rtl,
+    removeAriaLabel = _ref.removeAriaLabel,
+    onTabClick = _ref.onTabClick,
+    getPopupContainer = _ref.getPopupContainer,
+    popupClassName = _ref.popupClassName;
   // ======================== Dropdown ========================
   var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      open = _useState2[0],
-      setOpen = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    open = _useState2[0],
+    setOpen = _useState2[1];
   var _useState3 = useState(null),
-      _useState4 = _slicedToArray(_useState3, 2),
-      selectedKey = _useState4[0],
-      setSelectedKey = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    selectedKey = _useState4[0],
+    setSelectedKey = _useState4[1];
   var popupId = "".concat(id, "-more-popup");
@@ -46,3 +42,2 @@ var dropdownPrefix = "".concat(prefixCls, "-dropdown");
   var dropdownAriaLabel = locale === null || locale === void 0 ? void 0 : locale.dropdownAriaLabel;
-
   function onRemoveTab(event, key) {
@@ -56,7 +51,6 @@ event.preventDefault();
   }
-
   var menu = /*#__PURE__*/React.createElement(Menu, {
     onClick: function onClick(_ref2) {
       var key = _ref2.key,
-          domEvent = _ref2.domEvent;
+        domEvent = _ref2.domEvent;
       onTabClick(key, domEvent);
@@ -91,3 +85,2 @@ setOpen(false);
   }));
-
   function selectOffset(offset) {
@@ -101,7 +94,5 @@ var enabledTabs = tabs.filter(function (tab) {
     var len = enabledTabs.length;
-
     for (var i = 0; i < len; i += 1) {
       selectedIndex = (selectedIndex + offset + len) % len;
       var tab = enabledTabs[selectedIndex];
-
       if (!tab.disabled) {
@@ -113,6 +104,4 @@ setSelectedKey(tab.key);
   }
-
   function onKeyDown(e) {
     var which = e.which;
-
     if (!open) {
@@ -123,6 +112,4 @@ if ([KeyCode.DOWN, KeyCode.SPACE, KeyCode.ENTER].includes(which)) {
       }
-
       return;
     }
-
     switch (which) {
@@ -133,3 +120,2 @@ case KeyCode.UP:
         break;
-
       case KeyCode.DOWN:
@@ -139,7 +125,5 @@ selectOffset(1);
         break;
-
       case KeyCode.ESC:
         setOpen(false);
         break;
-
       case KeyCode.SPACE:
@@ -150,9 +134,7 @@ case KeyCode.ENTER:
     }
-  } // ========================= Effect =========================
-
-
+  }
+  // ========================= Effect =========================
   useEffect(function () {
     // We use query element here to avoid React strict warning
     var ele = document.getElementById(selectedItemId);
-
     if (ele && ele.scrollIntoView) {
@@ -166,6 +148,5 @@ ele.scrollIntoView(false);
     }
-  }, [open]); // ========================= Render =========================
-
+  }, [open]);
+  // ========================= Render =========================
   var moreStyle = _defineProperty({}, rtl ? 'marginRight' : 'marginLeft', tabBarGutter);
-
   if (!tabs.length) {
@@ -175,3 +156,2 @@ moreStyle.visibility = 'hidden';
   }
-
   var overlayClassName = classNames(_defineProperty({}, "".concat(dropdownPrefix, "-rtl"), rtl));
@@ -211,5 +191,5 @@ var moreNode = mobile ? null : /*#__PURE__*/React.createElement(Dropdown, {
 }
-
 export default /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(OperationNode), function (_, next) {
-  return (// https://github.com/ant-design/ant-design/issues/32544
+  return (
+    // https://github.com/ant-design/ant-design/issues/32544
     // We'd better remove syntactic sugar in `rc-menu` since this has perf issue
@@ -216,0 +196,0 @@ next.tabMoving

es/TabNavList/TabNode.js

@@ -5,22 +5,20 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import KeyCode from "rc-util/es/KeyCode";
-
 function TabNode(_ref, ref) {
   var _classNames;
-
   var prefixCls = _ref.prefixCls,
-      id = _ref.id,
-      active = _ref.active,
-      _ref$tab = _ref.tab,
-      key = _ref$tab.key,
-      label = _ref$tab.label,
-      disabled = _ref$tab.disabled,
-      closeIcon = _ref$tab.closeIcon,
-      closable = _ref.closable,
-      renderWrapper = _ref.renderWrapper,
-      removeAriaLabel = _ref.removeAriaLabel,
-      editable = _ref.editable,
-      onClick = _ref.onClick,
-      onRemove = _ref.onRemove,
-      onFocus = _ref.onFocus,
-      style = _ref.style;
+    id = _ref.id,
+    active = _ref.active,
+    _ref$tab = _ref.tab,
+    key = _ref$tab.key,
+    label = _ref$tab.label,
+    disabled = _ref$tab.disabled,
+    closeIcon = _ref$tab.closeIcon,
+    closable = _ref.closable,
+    renderWrapper = _ref.renderWrapper,
+    removeAriaLabel = _ref.removeAriaLabel,
+    editable = _ref.editable,
+    onClick = _ref.onClick,
+    onRemove = _ref.onRemove,
+    onFocus = _ref.onFocus,
+    style = _ref.style;
   var tabPrefix = "".concat(prefixCls, "-tab");
@@ -31,3 +29,2 @@ React.useEffect(function () {
   var removable = editable && closable !== false && !disabled;
-
   function onInternalClick(e) {
@@ -37,6 +34,4 @@ if (disabled) {
     }
-
     onClick(e);
   }
-
   function onRemoveTab(event) {
@@ -50,3 +45,2 @@ event.preventDefault();
   }
-
   var node = /*#__PURE__*/React.createElement("div", {
@@ -89,3 +83,2 @@ key: key,
 }
-
 export default /*#__PURE__*/React.forwardRef(TabNode);

es/TabNavList/Wrapper.d.ts

 import type { TabNavListProps } from '.';
-export declare type TabNavListWrapperProps = Required<Omit<TabNavListProps, 'children' | 'className'>> & TabNavListProps;
+export type TabNavListWrapperProps = Required<Omit<TabNavListProps, 'children' | 'className'>> & TabNavListProps;
 export default function TabNavListWrapper({ renderTabBar, ...restProps }: TabNavListWrapperProps): JSX.Element;

es/TabNavList/Wrapper.js

@@ -5,3 +5,3 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 var _excluded = ["renderTabBar"],
-    _excluded2 = ["label", "key"];
+  _excluded2 = ["label", "key"];
 import React from "react";
@@ -12,11 +12,9 @@ // zombieJ: To compatible with `renderTabBar` usage.
 import TabContext from '../TabContext';
-import TabPane from '../TabPanelList/TabPane'; // We have to create a TabNavList components.
-
+import TabPane from '../TabPanelList/TabPane';
+// We have to create a TabNavList components.
 export default function TabNavListWrapper(_ref) {
   var renderTabBar = _ref.renderTabBar,
-      restProps = _objectWithoutProperties(_ref, _excluded);
-
+    restProps = _objectWithoutProperties(_ref, _excluded);
   var _useContext = useContext(TabContext),
-      tabs = _useContext.tabs;
-
+    tabs = _useContext.tabs;
   if (renderTabBar) {
@@ -27,5 +25,4 @@ var tabNavBarProps = _objectSpread(_objectSpread({}, restProps), {}, {
         var label = _ref2.label,
-            key = _ref2.key,
-            restTabProps = _objectWithoutProperties(_ref2, _excluded2);
-
+          key = _ref2.key,
+          restTabProps = _objectWithoutProperties(_ref2, _excluded2);
         return /*#__PURE__*/React.createElement(TabPane, _extends({
@@ -38,7 +35,5 @@ tab: label,
     });
-
     return renderTabBar(tabNavBarProps, TabNavList);
   }
-
   return /*#__PURE__*/React.createElement(TabNavList, restProps);
 }

es/TabPanelList/index.js

@@ -13,11 +13,9 @@ import _extends from "@babel/runtime/helpers/esm/extends";
   var id = _ref.id,
-      activeKey = _ref.activeKey,
-      animated = _ref.animated,
-      tabPosition = _ref.tabPosition,
-      destroyInactiveTabPane = _ref.destroyInactiveTabPane;
-
+    activeKey = _ref.activeKey,
+    animated = _ref.animated,
+    tabPosition = _ref.tabPosition,
+    destroyInactiveTabPane = _ref.destroyInactiveTabPane;
   var _React$useContext = React.useContext(TabContext),
-      prefixCls = _React$useContext.prefixCls,
-      tabs = _React$useContext.tabs;
-
+    prefixCls = _React$useContext.prefixCls,
+    tabs = _React$useContext.tabs;
   var tabPaneAnimated = animated.tabPane;
@@ -31,7 +29,6 @@ var tabPanePrefixCls = "".concat(prefixCls, "-tabpane");
     var key = _ref2.key,
-        forceRender = _ref2.forceRender,
-        paneStyle = _ref2.style,
-        paneClassName = _ref2.className,
-        restTabProps = _objectWithoutProperties(_ref2, _excluded);
-
+      forceRender = _ref2.forceRender,
+      paneStyle = _ref2.style,
+      paneClassName = _ref2.className,
+      restTabProps = _objectWithoutProperties(_ref2, _excluded);
     var active = key === activeKey;
@@ -46,3 +43,3 @@ return /*#__PURE__*/React.createElement(CSSMotion, _extends({
       var motionStyle = _ref3.style,
-          motionClassName = _ref3.className;
+        motionClassName = _ref3.className;
       return /*#__PURE__*/React.createElement(TabPane, _extends({}, restTabProps, {
@@ -49,0 +46,0 @@ prefixCls: tabPanePrefixCls,

es/TabPanelList/TabPane.js

@@ -5,8 +5,8 @@ import * as React from 'react';
   var prefixCls = _ref.prefixCls,
-      className = _ref.className,
-      style = _ref.style,
-      id = _ref.id,
-      active = _ref.active,
-      tabKey = _ref.tabKey,
-      children = _ref.children;
+    className = _ref.className,
+    style = _ref.style,
+    id = _ref.id,
+    active = _ref.active,
+    tabKey = _ref.tabKey,
+    children = _ref.children;
   return /*#__PURE__*/React.createElement("div", {
@@ -23,7 +23,5 @@ id: id && "".concat(id, "-panel-").concat(tabKey),
 });
-
 if (process.env.NODE_ENV !== 'production') {
   TabPane.displayName = 'TabPane';
 }
-
 export default TabPane;

es/Tabs.js

@@ -28,35 +28,31 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 // Used for accessibility
-
 var uuid = 0;
-
 function Tabs(_ref, ref) {
   var _classNames;
-
   var id = _ref.id,
-      _ref$prefixCls = _ref.prefixCls,
-      prefixCls = _ref$prefixCls === void 0 ? 'rc-tabs' : _ref$prefixCls,
-      className = _ref.className,
-      items = _ref.items,
-      direction = _ref.direction,
-      activeKey = _ref.activeKey,
-      defaultActiveKey = _ref.defaultActiveKey,
-      editable = _ref.editable,
-      animated = _ref.animated,
-      _ref$tabPosition = _ref.tabPosition,
-      tabPosition = _ref$tabPosition === void 0 ? 'top' : _ref$tabPosition,
-      tabBarGutter = _ref.tabBarGutter,
-      tabBarStyle = _ref.tabBarStyle,
-      tabBarExtraContent = _ref.tabBarExtraContent,
-      locale = _ref.locale,
-      moreIcon = _ref.moreIcon,
-      moreTransitionName = _ref.moreTransitionName,
-      destroyInactiveTabPane = _ref.destroyInactiveTabPane,
-      renderTabBar = _ref.renderTabBar,
-      onChange = _ref.onChange,
-      onTabClick = _ref.onTabClick,
-      onTabScroll = _ref.onTabScroll,
-      getPopupContainer = _ref.getPopupContainer,
-      popupClassName = _ref.popupClassName,
-      restProps = _objectWithoutProperties(_ref, _excluded);
-
+    _ref$prefixCls = _ref.prefixCls,
+    prefixCls = _ref$prefixCls === void 0 ? 'rc-tabs' : _ref$prefixCls,
+    className = _ref.className,
+    items = _ref.items,
+    direction = _ref.direction,
+    activeKey = _ref.activeKey,
+    defaultActiveKey = _ref.defaultActiveKey,
+    editable = _ref.editable,
+    animated = _ref.animated,
+    _ref$tabPosition = _ref.tabPosition,
+    tabPosition = _ref$tabPosition === void 0 ? 'top' : _ref$tabPosition,
+    tabBarGutter = _ref.tabBarGutter,
+    tabBarStyle = _ref.tabBarStyle,
+    tabBarExtraContent = _ref.tabBarExtraContent,
+    locale = _ref.locale,
+    moreIcon = _ref.moreIcon,
+    moreTransitionName = _ref.moreTransitionName,
+    destroyInactiveTabPane = _ref.destroyInactiveTabPane,
+    renderTabBar = _ref.renderTabBar,
+    onChange = _ref.onChange,
+    onTabClick = _ref.onTabClick,
+    onTabScroll = _ref.onTabScroll,
+    getPopupContainer = _ref.getPopupContainer,
+    popupClassName = _ref.popupClassName,
+    restProps = _objectWithoutProperties(_ref, _excluded);
   var tabs = React.useMemo(function () {
@@ -68,36 +64,32 @@ return (items || []).filter(function (item) {
   var rtl = direction === 'rtl';
-  var mergedAnimated = useAnimateConfig(animated); // ======================== Mobile ========================
-
+  var mergedAnimated = useAnimateConfig(animated);
+  // ======================== Mobile ========================
   var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      mobile = _useState2[0],
-      setMobile = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    mobile = _useState2[0],
+    setMobile = _useState2[1];
   useEffect(function () {
     // Only update on the client side
     setMobile(isMobile());
-  }, []); // ====================== Active Key ======================
-
+  }, []);
+  // ====================== Active Key ======================
   var _useMergedState = useMergedState(function () {
-    var _tabs$;
-
-    return (_tabs$ = tabs[0]) === null || _tabs$ === void 0 ? void 0 : _tabs$.key;
-  }, {
-    value: activeKey,
-    defaultValue: defaultActiveKey
-  }),
-      _useMergedState2 = _slicedToArray(_useMergedState, 2),
-      mergedActiveKey = _useMergedState2[0],
-      setMergedActiveKey = _useMergedState2[1];
-
+      var _tabs$;
+      return (_tabs$ = tabs[0]) === null || _tabs$ === void 0 ? void 0 : _tabs$.key;
+    }, {
+      value: activeKey,
+      defaultValue: defaultActiveKey
+    }),
+    _useMergedState2 = _slicedToArray(_useMergedState, 2),
+    mergedActiveKey = _useMergedState2[0],
+    setMergedActiveKey = _useMergedState2[1];
   var _useState3 = useState(function () {
-    return tabs.findIndex(function (tab) {
-      return tab.key === mergedActiveKey;
-    });
-  }),
-      _useState4 = _slicedToArray(_useState3, 2),
-      activeIndex = _useState4[0],
-      setActiveIndex = _useState4[1]; // Reset active key if not exist anymore
-
-
+      return tabs.findIndex(function (tab) {
+        return tab.key === mergedActiveKey;
+      });
+    }),
+    _useState4 = _slicedToArray(_useState3, 2),
+    activeIndex = _useState4[0],
+    setActiveIndex = _useState4[1];
+  // Reset active key if not exist anymore
   useEffect(function () {
@@ -107,23 +99,19 @@ var newActiveIndex = tabs.findIndex(function (tab) {
     });
-
     if (newActiveIndex === -1) {
       var _tabs$newActiveIndex;
-
       newActiveIndex = Math.max(0, Math.min(activeIndex, tabs.length - 1));
       setMergedActiveKey((_tabs$newActiveIndex = tabs[newActiveIndex]) === null || _tabs$newActiveIndex === void 0 ? void 0 : _tabs$newActiveIndex.key);
     }
-
     setActiveIndex(newActiveIndex);
   }, [tabs.map(function (tab) {
     return tab.key;
-  }).join('_'), mergedActiveKey, activeIndex]); // ===================== Accessibility ====================
-
+  }).join('_'), mergedActiveKey, activeIndex]);
+  // ===================== Accessibility ====================
   var _useMergedState3 = useMergedState(null, {
-    value: id
-  }),
-      _useMergedState4 = _slicedToArray(_useMergedState3, 2),
-      mergedId = _useMergedState4[0],
-      setMergedId = _useMergedState4[1]; // Async generate id to avoid ssr mapping failed
-
-
+      value: id
+    }),
+    _useMergedState4 = _slicedToArray(_useMergedState3, 2),
+    mergedId = _useMergedState4[0],
+    setMergedId = _useMergedState4[1];
+  // Async generate id to avoid ssr mapping failed
   useEffect(function () {
@@ -134,4 +122,4 @@ if (!id) {
     }
-  }, []); // ======================== Events ========================
-
+  }, []);
+  // ======================== Events ========================
   function onInternalTabClick(key, e) {
@@ -141,9 +129,7 @@ onTabClick === null || onTabClick === void 0 ? void 0 : onTabClick(key, e);
     setMergedActiveKey(key);
-
     if (isActiveChanged) {
       onChange === null || onChange === void 0 ? void 0 : onChange(key);
     }
-  } // ======================== Render ========================
-
-
+  }
+  // ======================== Render ========================
   var sharedProps = {
@@ -158,3 +144,2 @@ id: mergedId,
   var tabNavBar;
-
   var tabNavBarProps = _objectSpread(_objectSpread({}, sharedProps), {}, {
@@ -174,3 +159,2 @@ editable: editable,
   });
-
   return /*#__PURE__*/React.createElement(TabContext.Provider, {
@@ -193,9 +177,6 @@ value: {
 }
-
 var ForwardTabs = /*#__PURE__*/React.forwardRef(Tabs);
-
 if (process.env.NODE_ENV !== 'production') {
   ForwardTabs.displayName = 'Tabs';
 }
-
 export default ForwardTabs;

es/util.js

@@ -7,3 +7,2 @@ /**
   var tgt;
-
   if (obj instanceof Map) {
@@ -17,4 +16,3 @@ tgt = {};
   }
-
   return JSON.stringify(tgt);
 }

lib/hooks/useAnimateConfig.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -9,9 +8,5 @@ value: true
 exports.default = useAnimateConfig;
-
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _warning = _interopRequireDefault(require("rc-util/lib/warning"));
-
 function useAnimateConfig() {
@@ -23,3 +18,2 @@ var animated = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
   var mergedAnimated;
-
   if (animated === false) {
@@ -39,9 +33,7 @@ mergedAnimated = {
     }, (0, _typeof2.default)(animated) === 'object' ? animated : {});
-  } // Enable tabPane animation if provide motion
-
-
+  }
+  // Enable tabPane animation if provide motion
   if (mergedAnimated.tabPaneMotion && mergedAnimated.tabPane === undefined) {
     mergedAnimated.tabPane = true;
   }
-
   if (!mergedAnimated.tabPaneMotion && mergedAnimated.tabPane) {
@@ -51,7 +43,5 @@ if (process.env.NODE_ENV !== 'production') {
     }
-
     mergedAnimated.tabPane = false;
   }
-
   return mergedAnimated;
 }

lib/hooks/useOffsets.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -9,7 +8,4 @@ value: true
 exports.default = useOffsets;
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _react = require("react");
-
 var DEFAULT_SIZE = {
@@ -21,28 +17,22 @@ width: 0,
 };
-
 function useOffsets(tabs, tabSizes, holderScrollWidth) {
   return (0, _react.useMemo)(function () {
     var _tabs$;
-
     var map = new Map();
     var lastOffset = tabSizes.get((_tabs$ = tabs[0]) === null || _tabs$ === void 0 ? void 0 : _tabs$.key) || DEFAULT_SIZE;
     var rightOffset = lastOffset.left + lastOffset.width;
-
     for (var i = 0; i < tabs.length; i += 1) {
       var key = tabs[i].key;
-      var data = tabSizes.get(key); // Reuse last one when not exist yet
-
+      var data = tabSizes.get(key);
+      // Reuse last one when not exist yet
       if (!data) {
         var _tabs;
-
         data = tabSizes.get((_tabs = tabs[i - 1]) === null || _tabs === void 0 ? void 0 : _tabs.key) || DEFAULT_SIZE;
       }
-
-      var entity = map.get(key) || (0, _objectSpread2.default)({}, data); // Right
-
-      entity.right = rightOffset - entity.left - entity.width; // Update entity
-
+      var entity = map.get(key) || (0, _objectSpread2.default)({}, data);
+      // Right
+      entity.right = rightOffset - entity.left - entity.width;
+      // Update entity
       map.set(key, entity);
     }
-
     return map;
@@ -49,0 +39,0 @@ }, [tabs.map(function (tab) {

lib/hooks/useRaf.d.ts

 export default function useRaf<Callback extends Function>(callback: Callback): (...args: any[]) => void;
-declare type Callback<T> = (ori: T) => T;
+type Callback<T> = (ori: T) => T;
 export declare function useRafState<T>(defaultState: T | (() => T)): [T, (updater: Callback<T>) => void];
 export {};

lib/hooks/useRaf.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -10,13 +9,8 @@ value: true
 exports.useRafState = useRafState;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _react = require("react");
-
 var _raf = _interopRequireDefault(require("rc-util/lib/raf"));
-
 function useRaf(callback) {
   var rafRef = (0, _react.useRef)();
   var removedRef = (0, _react.useRef)(false);
-
   function trigger() {
@@ -26,6 +20,4 @@ for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
     }
-
     if (!removedRef.current) {
       _raf.default.cancel(rafRef.current);
-
       rafRef.current = (0, _raf.default)(function () {
@@ -36,3 +28,2 @@ callback.apply(void 0, args);
   }
-
   (0, _react.useEffect)(function () {
@@ -43,3 +34,2 @@ //be compatible with react 18 StrictMode in dev
       removedRef.current = true;
-
       _raf.default.cancel(rafRef.current);
@@ -50,10 +40,7 @@ };
 }
-
 function useRafState(defaultState) {
   var batchRef = (0, _react.useRef)([]);
-
   var _useState = (0, _react.useState)({}),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      forceUpdate = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    forceUpdate = _useState2[1];
   var state = (0, _react.useRef)(typeof defaultState === 'function' ? defaultState() : defaultState);
@@ -69,3 +56,2 @@ var flushUpdate = useRaf(function () {
   });
-
   function updater(callback) {
@@ -75,4 +61,3 @@ batchRef.current.push(callback);
   }
-
   return [state.current, updater];
 }

lib/hooks/useRefs.js

 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -9,12 +8,7 @@ value: true
 exports.default = useRefs;
-
 var React = _interopRequireWildcard(require("react"));
-
 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; }
-
 function useRefs() {
   var cacheRefs = (0, React.useRef)(new Map());
-
   function getRef(key) {
@@ -24,11 +18,8 @@ if (!cacheRefs.current.has(key)) {
     }
-
     return cacheRefs.current.get(key);
   }
-
   function removeRef(key) {
     cacheRefs.current.delete(key);
   }
-
   return [getRef, removeRef];
 }

lib/hooks/useSyncState.d.ts

@@ -1,3 +0,3 @@
-declare type Updater<T> = (prev: T) => T;
+type Updater<T> = (prev: T) => T;
 export default function useSyncState<T>(defaultState: T, onChange: (newValue: T, prevValue: T) => void): [T, (updater: T | Updater<T>) => void];
 export {};

lib/hooks/useSyncState.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,30 +9,20 @@ value: true
 exports.default = useSyncState;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var React = _interopRequireWildcard(require("react"));
-
 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; }
-
 function useSyncState(defaultState, onChange) {
   var stateRef = React.useRef(defaultState);
-
   var _React$useState = React.useState({}),
-      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      forceUpdate = _React$useState2[1];
-
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    forceUpdate = _React$useState2[1];
   function setState(updater) {
     var newValue = typeof updater === 'function' ? updater(stateRef.current) : updater;
-
     if (newValue !== stateRef.current) {
       onChange(newValue, stateRef.current);
     }
-
     stateRef.current = newValue;
     forceUpdate({});
   }
-
   return [stateRef.current, setState];
 }

lib/hooks/useTouchMove.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,44 +9,35 @@ value: true
 exports.default = useTouchMove;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var React = _interopRequireWildcard(require("react"));
-
 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 MIN_SWIPE_DISTANCE = 0.1;
 var STOP_SWIPE_DISTANCE = 0.01;
 var REFRESH_INTERVAL = 20;
-var SPEED_OFF_MULTIPLE = Math.pow(0.995, REFRESH_INTERVAL); // ================================= Hook =================================
-
+var SPEED_OFF_MULTIPLE = Math.pow(0.995, REFRESH_INTERVAL);
+// ================================= Hook =================================
 function useTouchMove(ref, onOffset) {
   var _useState = (0, React.useState)(),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      touchPosition = _useState2[0],
-      setTouchPosition = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    touchPosition = _useState2[0],
+    setTouchPosition = _useState2[1];
   var _useState3 = (0, React.useState)(0),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      lastTimestamp = _useState4[0],
-      setLastTimestamp = _useState4[1];
-
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    lastTimestamp = _useState4[0],
+    setLastTimestamp = _useState4[1];
   var _useState5 = (0, React.useState)(0),
-      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      lastTimeDiff = _useState6[0],
-      setLastTimeDiff = _useState6[1];
-
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    lastTimeDiff = _useState6[0],
+    setLastTimeDiff = _useState6[1];
   var _useState7 = (0, React.useState)(),
-      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-      lastOffset = _useState8[0],
-      setLastOffset = _useState8[1];
-
-  var motionRef = (0, React.useRef)(); // ========================= Events =========================
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    lastOffset = _useState8[0],
+    setLastOffset = _useState8[1];
+  var motionRef = (0, React.useRef)();
+  // ========================= Events =========================
   // >>> Touch events
-
   function onTouchStart(e) {
     var _e$touches$ = e.touches[0],
-        screenX = _e$touches$.screenX,
-        screenY = _e$touches$.screenY;
+      screenX = _e$touches$.screenX,
+      screenY = _e$touches$.screenY;
     setTouchPosition({
@@ -60,3 +49,2 @@ x: screenX,
   }
-
   function onTouchMove(e) {
@@ -66,4 +54,4 @@ if (!touchPosition) return;
     var _e$touches$2 = e.touches[0],
-        screenX = _e$touches$2.screenX,
-        screenY = _e$touches$2.screenY;
+      screenX = _e$touches$2.screenX,
+      screenY = _e$touches$2.screenY;
     setTouchPosition({
@@ -84,8 +72,7 @@ x: screenX,
   }
-
   function onTouchEnd() {
     if (!touchPosition) return;
     setTouchPosition(null);
-    setLastOffset(null); // Swipe if needed
-
+    setLastOffset(null);
+    // Swipe if needed
     if (lastOffset) {
@@ -95,4 +82,4 @@ var distanceX = lastOffset.x / lastTimeDiff;
       var absX = Math.abs(distanceX);
-      var absY = Math.abs(distanceY); // Skip swipe if low distance
-
+      var absY = Math.abs(distanceY);
+      // Skip swipe if low distance
       if (Math.max(absX, absY) < MIN_SWIPE_DISTANCE) return;
@@ -106,3 +93,2 @@ var currentX = distanceX;
         }
-
         currentX *= SPEED_OFF_MULTIPLE;
@@ -113,15 +99,12 @@ currentY *= SPEED_OFF_MULTIPLE;
     }
-  } // >>> Wheel event
-
-
+  }
+  // >>> Wheel event
   var lastWheelDirectionRef = (0, React.useRef)();
-
   function onWheel(e) {
     var deltaX = e.deltaX,
-        deltaY = e.deltaY; // Convert both to x & y since wheel only happened on PC
-
+      deltaY = e.deltaY;
+    // Convert both to x & y since wheel only happened on PC
     var mixed = 0;
     var absX = Math.abs(deltaX);
     var absY = Math.abs(deltaY);
-
     if (absX === absY) {
@@ -136,9 +119,7 @@ mixed = lastWheelDirectionRef.current === 'x' ? deltaX : deltaY;
     }
-
     if (onOffset(-mixed, -mixed)) {
       e.preventDefault();
     }
-  } // ========================= Effect =========================
-
-
+  }
+  // ========================= Effect =========================
   var touchEventsRef = (0, React.useRef)(null);
@@ -155,15 +136,11 @@ touchEventsRef.current = {
     }
-
     function onProxyTouchMove(e) {
       touchEventsRef.current.onTouchMove(e);
     }
-
     function onProxyTouchEnd(e) {
       touchEventsRef.current.onTouchEnd(e);
     }
-
     function onProxyWheel(e) {
       touchEventsRef.current.onWheel(e);
     }
-
     document.addEventListener('touchmove', onProxyTouchMove, {
@@ -174,4 +151,4 @@ passive: false
       passive: false
-    }); // No need to clean up since element removed
-
+    });
+    // No need to clean up since element removed
     ref.current.addEventListener('touchstart', onProxyTouchStart, {
@@ -178,0 +155,0 @@ passive: false

lib/hooks/useVisibleRange.d.ts

 import type { Tab, TabOffsetMap } from '../interface';
 import type { TabNavListProps } from '../TabNavList';
-export declare type ContainerSizeInfo = [width: number, height: number, left: number, top: number];
+export type ContainerSizeInfo = [width: number, height: number, left: number, top: number];
 export default function useVisibleRange(tabOffsets: TabOffsetMap, visibleTabContentValue: number, transform: number, tabContentSizeValue: number, addNodeSizeValue: number, operationNodeSizeValue: number, { tabs, tabPosition, rtl }: {
     tabs: Tab[];
 } & TabNavListProps): [visibleStart: number, visibleEnd: number];

lib/hooks/useVisibleRange.js

@@ -7,5 +7,3 @@ "use strict";
 exports.default = useVisibleRange;
-
 var _react = require("react");
-
 var DEFAULT_SIZE = {
@@ -18,11 +16,9 @@ width: 0,
 };
-
 function useVisibleRange(tabOffsets, visibleTabContentValue, transform, tabContentSizeValue, addNodeSizeValue, operationNodeSizeValue, _ref) {
   var tabs = _ref.tabs,
-      tabPosition = _ref.tabPosition,
-      rtl = _ref.rtl;
+    tabPosition = _ref.tabPosition,
+    rtl = _ref.rtl;
   var charUnit;
   var position;
   var transformSize;
-
   if (['top', 'bottom'].includes(tabPosition)) {
@@ -37,3 +33,2 @@ charUnit = 'width';
   }
-
   return (0, _react.useMemo)(function () {
@@ -43,9 +38,6 @@ if (!tabs.length) {
     }
-
     var len = tabs.length;
     var endIndex = len;
-
     for (var i = 0; i < len; i += 1) {
       var offset = tabOffsets.get(tabs[i].key) || DEFAULT_SIZE;
-
       if (offset[position] + offset[charUnit] > transformSize + visibleTabContentValue) {
@@ -56,8 +48,5 @@ endIndex = i - 1;
     }
-
     var startIndex = 0;
-
     for (var _i = len - 1; _i >= 0; _i -= 1) {
       var _offset = tabOffsets.get(tabs[_i].key) || DEFAULT_SIZE;
-
       if (_offset[position] < transformSize) {
@@ -68,3 +57,2 @@ startIndex = _i + 1;
     }
-
     return [startIndex, endIndex];
@@ -71,0 +59,0 @@ }, [tabOffsets, visibleTabContentValue, tabContentSizeValue, addNodeSizeValue, operationNodeSizeValue, transformSize, tabPosition, tabs.map(function (tab) {

lib/index.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -9,6 +8,4 @@ value: true
 exports.default = void 0;
-
 var _Tabs = _interopRequireDefault(require("./Tabs"));
-
 var _default = _Tabs.default;
 exports.default = _default;

lib/interface.d.ts

@@ -5,4 +5,4 @@ import type React from 'react';
 import type { TabPaneProps } from './TabPanelList/TabPane';
-export declare type SizeInfo = [width: number, height: number];
-export declare type TabSizeMap = Map<React.Key, {
+export type SizeInfo = [width: number, height: number];
+export type TabSizeMap = Map<React.Key, {
     width: number;
@@ -20,4 +20,4 @@ height: number;
 }
-export declare type TabOffsetMap = Map<React.Key, TabOffset>;
-export declare type TabPosition = 'left' | 'right' | 'top' | 'bottom';
+export type TabOffsetMap = Map<React.Key, TabOffset>;
+export type TabPosition = 'left' | 'right' | 'top' | 'bottom';
 export interface Tab extends Omit<TabPaneProps, 'tab'> {
@@ -27,3 +27,3 @@ key: string;
 }
-declare type RenderTabBarProps = {
+type RenderTabBarProps = {
     id: string;
@@ -47,3 +47,3 @@ activeKey: string;
 };
-export declare type RenderTabBar = (props: RenderTabBarProps, DefaultTabBar: React.ComponentType<TabNavListProps>) => React.ReactElement;
+export type RenderTabBar = (props: RenderTabBarProps, DefaultTabBar: React.ComponentType<TabNavListProps>) => React.ReactElement;
 export interface TabsLocale {
@@ -68,8 +68,8 @@ dropdownAriaLabel?: string;
 }
-export declare type OnTabScroll = (info: {
+export type OnTabScroll = (info: {
     direction: 'left' | 'right' | 'top' | 'bottom';
 }) => void;
-export declare type TabBarExtraPosition = 'left' | 'right';
-export declare type TabBarExtraMap = Partial<Record<TabBarExtraPosition, React.ReactNode>>;
-export declare type TabBarExtraContent = React.ReactNode | TabBarExtraMap;
+export type TabBarExtraPosition = 'left' | 'right';
+export type TabBarExtraMap = Partial<Record<TabBarExtraPosition, React.ReactNode>>;
+export type TabBarExtraContent = React.ReactNode | TabBarExtraMap;
 export {};

lib/TabContext.js

@@ -7,7 +7,4 @@ "use strict";
 exports.default = void 0;
-
 var _react = require("react");
-
 var _default = /*#__PURE__*/(0, _react.createContext)(null);
-
 exports.default = _default;

lib/TabNavList/AddButton.js

 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -9,19 +8,13 @@ value: true
 exports.default = void 0;
-
 var React = _interopRequireWildcard(require("react"));
-
 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; }
-
 function AddButton(_ref, ref) {
   var prefixCls = _ref.prefixCls,
-      editable = _ref.editable,
-      locale = _ref.locale,
-      style = _ref.style;
-
+    editable = _ref.editable,
+    locale = _ref.locale,
+    style = _ref.style;
   if (!editable || editable.showAdd === false) {
     return null;
   }
-
   return /*#__PURE__*/React.createElement("button", {
@@ -40,5 +33,3 @@ ref: ref,
 }
-
 var _default = /*#__PURE__*/React.forwardRef(AddButton);
-
 exports.default = _default;

lib/TabNavList/ExtraContent.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof3 = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,20 +9,14 @@ value: true
 exports.default = void 0;
-
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
 var React = _interopRequireWildcard(require("react"));
-
 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 || _typeof3(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 ExtraContent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var position = _ref.position,
-      prefixCls = _ref.prefixCls,
-      extra = _ref.extra;
+    prefixCls = _ref.prefixCls,
+    extra = _ref.extra;
   if (!extra) return null;
-  var content; // Parse extra
-
+  var content;
+  // Parse extra
   var assertExtra = {};
-
   if ((0, _typeof2.default)(extra) === 'object' && ! /*#__PURE__*/React.isValidElement(extra)) {
@@ -35,11 +27,8 @@ assertExtra = extra;
   }
-
   if (position === 'right') {
     content = assertExtra.right;
   }
-
   if (position === 'left') {
     content = assertExtra.left;
   }
-
   return content ? /*#__PURE__*/React.createElement("div", {
@@ -50,8 +39,6 @@ className: "".concat(prefixCls, "-extra-content"),
 });
-
 if (process.env.NODE_ENV !== 'production') {
   ExtraContent.displayName = 'ExtraContent';
 }
-
 var _default = ExtraContent;
 exports.default = _default;

lib/TabNavList/index.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,58 +9,32 @@ value: true
 exports.default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _raf = _interopRequireDefault(require("rc-util/lib/raf"));
-
 var _ref3 = require("rc-util/lib/ref");
-
 var _rcResizeObserver = _interopRequireDefault(require("rc-resize-observer"));
-
 var _useRaf = _interopRequireWildcard(require("../hooks/useRaf"));
-
 var _TabNode = _interopRequireDefault(require("./TabNode"));
-
 var _useOffsets = _interopRequireDefault(require("../hooks/useOffsets"));
-
 var _useVisibleRange3 = _interopRequireDefault(require("../hooks/useVisibleRange"));
-
 var _OperationNode = _interopRequireDefault(require("./OperationNode"));
-
 var _TabContext = _interopRequireDefault(require("../TabContext"));
-
 var _useTouchMove = _interopRequireDefault(require("../hooks/useTouchMove"));
-
 var _useRefs3 = _interopRequireDefault(require("../hooks/useRefs"));
-
 var _AddButton = _interopRequireDefault(require("./AddButton"));
-
 var _useSyncState5 = _interopRequireDefault(require("../hooks/useSyncState"));
-
 var _util = require("../util");
-
 var _ExtraContent = _interopRequireDefault(require("./ExtraContent"));
-
 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 getSize = function getSize(refObj) {
   var _ref = refObj.current || {},
-      _ref$offsetWidth = _ref.offsetWidth,
-      offsetWidth = _ref$offsetWidth === void 0 ? 0 : _ref$offsetWidth,
-      _ref$offsetHeight = _ref.offsetHeight,
-      offsetHeight = _ref$offsetHeight === void 0 ? 0 : _ref$offsetHeight;
-
+    _ref$offsetWidth = _ref.offsetWidth,
+    offsetWidth = _ref$offsetWidth === void 0 ? 0 : _ref$offsetWidth,
+    _ref$offsetHeight = _ref.offsetHeight,
+    offsetHeight = _ref$offsetHeight === void 0 ? 0 : _ref$offsetHeight;
   return [offsetWidth, offsetHeight];
@@ -73,29 +45,24 @@ };
  */
-
-
 var getUnitValue = function getUnitValue(size, tabPositionTopOrBottom) {
   return size[tabPositionTopOrBottom ? 0 : 1];
 };
-
 function TabNavList(props, ref) {
   var _classNames;
-
   var _React$useContext = React.useContext(_TabContext.default),
-      prefixCls = _React$useContext.prefixCls,
-      tabs = _React$useContext.tabs;
-
+    prefixCls = _React$useContext.prefixCls,
+    tabs = _React$useContext.tabs;
   var className = props.className,
-      style = props.style,
-      id = props.id,
-      animated = props.animated,
-      activeKey = props.activeKey,
-      rtl = props.rtl,
-      extra = props.extra,
-      editable = props.editable,
-      locale = props.locale,
-      tabPosition = props.tabPosition,
-      tabBarGutter = props.tabBarGutter,
-      children = props.children,
-      onTabClick = props.onTabClick,
-      onTabScroll = props.onTabScroll;
+    style = props.style,
+    id = props.id,
+    animated = props.animated,
+    activeKey = props.activeKey,
+    rtl = props.rtl,
+    extra = props.extra,
+    editable = props.editable,
+    locale = props.locale,
+    tabPosition = props.tabPosition,
+    tabBarGutter = props.tabBarGutter,
+    children = props.children,
+    onTabClick = props.onTabClick,
+    onTabScroll = props.onTabScroll;
   var containerRef = (0, React.useRef)();
@@ -108,59 +75,49 @@ var extraLeftRef = (0, React.useRef)();
   var innerAddButtonRef = (0, React.useRef)();
-
   var _useRefs = (0, _useRefs3.default)(),
-      _useRefs2 = (0, _slicedToArray2.default)(_useRefs, 2),
-      getBtnRef = _useRefs2[0],
-      removeBtnRef = _useRefs2[1];
-
+    _useRefs2 = (0, _slicedToArray2.default)(_useRefs, 2),
+    getBtnRef = _useRefs2[0],
+    removeBtnRef = _useRefs2[1];
   var tabPositionTopOrBottom = tabPosition === 'top' || tabPosition === 'bottom';
-
   var _useSyncState = (0, _useSyncState5.default)(0, function (next, prev) {
-    if (tabPositionTopOrBottom && onTabScroll) {
-      onTabScroll({
-        direction: next > prev ? 'left' : 'right'
-      });
-    }
-  }),
-      _useSyncState2 = (0, _slicedToArray2.default)(_useSyncState, 2),
-      transformLeft = _useSyncState2[0],
-      setTransformLeft = _useSyncState2[1];
-
+      if (tabPositionTopOrBottom && onTabScroll) {
+        onTabScroll({
+          direction: next > prev ? 'left' : 'right'
+        });
+      }
+    }),
+    _useSyncState2 = (0, _slicedToArray2.default)(_useSyncState, 2),
+    transformLeft = _useSyncState2[0],
+    setTransformLeft = _useSyncState2[1];
   var _useSyncState3 = (0, _useSyncState5.default)(0, function (next, prev) {
-    if (!tabPositionTopOrBottom && onTabScroll) {
-      onTabScroll({
-        direction: next > prev ? 'top' : 'bottom'
-      });
-    }
-  }),
-      _useSyncState4 = (0, _slicedToArray2.default)(_useSyncState3, 2),
-      transformTop = _useSyncState4[0],
-      setTransformTop = _useSyncState4[1];
-
+      if (!tabPositionTopOrBottom && onTabScroll) {
+        onTabScroll({
+          direction: next > prev ? 'top' : 'bottom'
+        });
+      }
+    }),
+    _useSyncState4 = (0, _slicedToArray2.default)(_useSyncState3, 2),
+    transformTop = _useSyncState4[0],
+    setTransformTop = _useSyncState4[1];
   var _useState = (0, React.useState)([0, 0]),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      containerExcludeExtraSize = _useState2[0],
-      setContainerExcludeExtraSize = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    containerExcludeExtraSize = _useState2[0],
+    setContainerExcludeExtraSize = _useState2[1];
   var _useState3 = (0, React.useState)([0, 0]),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      tabContentSize = _useState4[0],
-      setTabContentSize = _useState4[1];
-
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    tabContentSize = _useState4[0],
+    setTabContentSize = _useState4[1];
   var _useState5 = (0, React.useState)([0, 0]),
-      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      addSize = _useState6[0],
-      setAddSize = _useState6[1];
-
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    addSize = _useState6[0],
+    setAddSize = _useState6[1];
   var _useState7 = (0, React.useState)([0, 0]),
-      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-      operationSize = _useState8[0],
-      setOperationSize = _useState8[1];
-
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    operationSize = _useState8[0],
+    setOperationSize = _useState8[1];
   var _useRafState = (0, _useRaf.useRafState)(new Map()),
-      _useRafState2 = (0, _slicedToArray2.default)(_useRafState, 2),
-      tabSizes = _useRafState2[0],
-      setTabSizes = _useRafState2[1];
-
-  var tabOffsets = (0, _useOffsets.default)(tabs, tabSizes, tabContentSize[0]); // ========================== Unit =========================
-
+    _useRafState2 = (0, _slicedToArray2.default)(_useRafState, 2),
+    tabSizes = _useRafState2[0],
+    setTabSizes = _useRafState2[1];
+  var tabOffsets = (0, _useOffsets.default)(tabs, tabSizes, tabContentSize[0]);
+  // ========================== Unit =========================
   var containerExcludeExtraSizeValue = getUnitValue(containerExcludeExtraSize, tabPositionTopOrBottom);
@@ -171,8 +128,7 @@ var tabContentSizeValue = getUnitValue(tabContentSize, tabPositionTopOrBottom);
   var needScroll = containerExcludeExtraSizeValue < tabContentSizeValue + addSizeValue;
-  var visibleTabContentValue = needScroll ? containerExcludeExtraSizeValue - operationSizeValue : containerExcludeExtraSizeValue - addSizeValue; // ========================== Util =========================
-
+  var visibleTabContentValue = needScroll ? containerExcludeExtraSizeValue - operationSizeValue : containerExcludeExtraSizeValue - addSizeValue;
+  // ========================== Util =========================
   var operationsHiddenClassName = "".concat(prefixCls, "-nav-operations-hidden");
   var transformMin = 0;
   var transformMax = 0;
-
   if (!tabPositionTopOrBottom) {
@@ -188,3 +144,2 @@ transformMin = Math.min(0, visibleTabContentValue - tabContentSizeValue);
   }
-
   function alignInRange(value) {
@@ -194,26 +149,19 @@ if (value < transformMin) {
     }
-
     if (value > transformMax) {
       return transformMax;
     }
-
     return value;
-  } // ========================= Mobile ========================
-
-
+  }
+  // ========================= Mobile ========================
   var touchMovingRef = (0, React.useRef)();
-
   var _useState9 = (0, React.useState)(),
-      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-      lockAnimation = _useState10[0],
-      setLockAnimation = _useState10[1];
-
+    _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
+    lockAnimation = _useState10[0],
+    setLockAnimation = _useState10[1];
   function doLockAnimation() {
     setLockAnimation(Date.now());
   }
-
   function clearTouchMoving() {
     window.clearTimeout(touchMovingRef.current);
   }
-
   (0, _useTouchMove.default)(tabsWrapperRef, function (offsetX, offsetY) {
@@ -225,9 +173,7 @@ function doMove(setState, offset) {
       });
-    } // Skip scroll if place is enough
-
-
+    }
+    // Skip scroll if place is enough
     if (containerExcludeExtraSizeValue >= tabContentSizeValue) {
       return false;
     }
-
     if (tabPositionTopOrBottom) {
@@ -238,3 +184,2 @@ doMove(setTransformLeft, offsetX);
     }
-
     clearTouchMoving();
@@ -246,3 +191,2 @@ doLockAnimation();
     clearTouchMoving();
-
     if (lockAnimation) {
@@ -253,20 +197,23 @@ touchMovingRef.current = window.setTimeout(function () {
     }
-
     return clearTouchMoving;
-  }, [lockAnimation]); // ===================== Visible Range =====================
+  }, [lockAnimation]);
+  // ===================== Visible Range =====================
   // Render tab node & collect tab offset
-
-  var _useVisibleRange = (0, _useVisibleRange3.default)(tabOffsets, // Container
-  visibleTabContentValue, // Transform
-  tabPositionTopOrBottom ? transformLeft : transformTop, // Tabs
-  tabContentSizeValue, // Add
-  addSizeValue, // Operation
-  operationSizeValue, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
-    tabs: tabs
-  })),
-      _useVisibleRange2 = (0, _slicedToArray2.default)(_useVisibleRange, 2),
-      visibleStart = _useVisibleRange2[0],
-      visibleEnd = _useVisibleRange2[1]; // ========================= Scroll ========================
-
-
+  var _useVisibleRange = (0, _useVisibleRange3.default)(tabOffsets,
+    // Container
+    visibleTabContentValue,
+    // Transform
+    tabPositionTopOrBottom ? transformLeft : transformTop,
+    // Tabs
+    tabContentSizeValue,
+    // Add
+    addSizeValue,
+    // Operation
+    operationSizeValue, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
+      tabs: tabs
+    })),
+    _useVisibleRange2 = (0, _slicedToArray2.default)(_useVisibleRange, 2),
+    visibleStart = _useVisibleRange2[0],
+    visibleEnd = _useVisibleRange2[1];
+  // ========================= Scroll ========================
   var scrollToTab = function scrollToTab() {
@@ -281,7 +228,6 @@ var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : activeKey;
     };
-
     if (tabPositionTopOrBottom) {
       // ============ Align with top & bottom ============
-      var newTransform = transformLeft; // RTL
-
+      var newTransform = transformLeft;
+      // RTL
       if (rtl) {
@@ -293,3 +239,4 @@ if (tabOffset.right < transformLeft) {
         }
-      } // LTR
+      }
+      // LTR
       else if (tabOffset.left < -transformLeft) {
@@ -300,3 +247,2 @@ newTransform = -tabOffset.left;
       }
-
       setTransformTop(0);
@@ -307,3 +253,2 @@ setTransformLeft(alignInRange(newTransform));
       var _newTransform = transformTop;
-
       if (tabOffset.top < -transformTop) {
@@ -314,11 +259,8 @@ _newTransform = -tabOffset.top;
       }
-
       setTransformLeft(0);
       setTransformTop(alignInRange(_newTransform));
     }
-  }; // ========================== Tab ==========================
-
-
+  };
+  // ========================== Tab ==========================
   var tabNodeStyle = {};
-
   if (tabPosition === 'top' || tabPosition === 'bottom') {
@@ -329,3 +271,2 @@ tabNodeStyle[rtl ? 'marginRight' : 'marginLeft'] = tabBarGutter;
   }
-
   var tabNodes = tabs.map(function (tab, i) {
@@ -338,4 +279,3 @@ var key = tab.key;
       tab: tab
-      /* first node should not have margin left */
-      ,
+      /* first node should not have margin left */,
       style: i === 0 ? undefined : tabNodeStyle,
@@ -357,12 +297,9 @@ closable: tab.closable,
         doLockAnimation();
-
         if (!tabsWrapperRef.current) {
           return;
-        } // Focus element will make scrollLeft change which we should reset back
-
-
+        }
+        // Focus element will make scrollLeft change which we should reset back
         if (!rtl) {
           tabsWrapperRef.current.scrollLeft = 0;
         }
-
         tabsWrapperRef.current.scrollTop = 0;
@@ -381,7 +318,7 @@ }
     var newOperationSize = getSize(operationsRef);
-    setOperationSize(newOperationSize); // Which includes add button size
-
+    setOperationSize(newOperationSize);
+    // Which includes add button size
     var tabContentFullSize = getSize(tabListRef);
-    setTabContentSize([tabContentFullSize[0] - newAddSize[0], tabContentFullSize[1] - newAddSize[1]]); // Update buttons records
-
+    setTabContentSize([tabContentFullSize[0] - newAddSize[0], tabContentFullSize[1] - newAddSize[1]]);
+    // Update buttons records
     setTabSizes(function () {
@@ -392,3 +329,2 @@ var newSizes = new Map();
         var btnNode = getBtnRef(key).current;
-
         if (btnNode) {
@@ -405,24 +341,20 @@ newSizes.set(key, {
     });
-  }); // ======================== Dropdown =======================
-
+  });
+  // ======================== Dropdown =======================
   var startHiddenTabs = tabs.slice(0, visibleStart);
   var endHiddenTabs = tabs.slice(visibleEnd + 1);
-  var hiddenTabs = [].concat((0, _toConsumableArray2.default)(startHiddenTabs), (0, _toConsumableArray2.default)(endHiddenTabs)); // =================== Link & Operations ===================
-
+  var hiddenTabs = [].concat((0, _toConsumableArray2.default)(startHiddenTabs), (0, _toConsumableArray2.default)(endHiddenTabs));
+  // =================== Link & Operations ===================
   var _useState11 = (0, React.useState)(),
-      _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
-      inkStyle = _useState12[0],
-      setInkStyle = _useState12[1];
-
-  var activeTabOffset = tabOffsets.get(activeKey); // Delay set ink style to avoid remove tab blink
-
+    _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
+    inkStyle = _useState12[0],
+    setInkStyle = _useState12[1];
+  var activeTabOffset = tabOffsets.get(activeKey);
+  // Delay set ink style to avoid remove tab blink
   var inkBarRafRef = (0, React.useRef)();
-
   function cleanInkBarRaf() {
     _raf.default.cancel(inkBarRafRef.current);
   }
-
   (0, React.useEffect)(function () {
     var newInkStyle = {};
-
     if (activeTabOffset) {
@@ -435,3 +367,2 @@ if (tabPositionTopOrBottom) {
         }
-
         newInkStyle.width = activeTabOffset.width;
@@ -443,3 +374,2 @@ } else {
     }
-
     cleanInkBarRaf();
@@ -450,12 +380,14 @@ inkBarRafRef.current = (0, _raf.default)(function () {
     return cleanInkBarRaf;
-  }, [activeTabOffset, tabPositionTopOrBottom, rtl]); // ========================= Effect ========================
-
+  }, [activeTabOffset, tabPositionTopOrBottom, rtl]);
+  // ========================= Effect ========================
   (0, React.useEffect)(function () {
-    scrollToTab(); // eslint-disable-next-line
-  }, [activeKey, (0, _util.stringify)(activeTabOffset), (0, _util.stringify)(tabOffsets), tabPositionTopOrBottom]); // Should recalculate when rtl changed
-
+    scrollToTab();
+    // eslint-disable-next-line
+  }, [activeKey, (0, _util.stringify)(activeTabOffset), (0, _util.stringify)(tabOffsets), tabPositionTopOrBottom]);
+  // Should recalculate when rtl changed
   (0, React.useEffect)(function () {
-    onListHolderResize(); // eslint-disable-next-line
-  }, [rtl]); // ========================= Render ========================
-
+    onListHolderResize();
+    // eslint-disable-next-line
+  }, [rtl]);
+  // ========================= Render ========================
   var hasDropdown = !!hiddenTabs.length;
@@ -467,3 +399,2 @@ var wrapPrefix = "".concat(prefixCls, "-nav-wrap");
   var pingBottom;
-
   if (tabPositionTopOrBottom) {
@@ -481,3 +412,2 @@ if (rtl) {
   }
-
   return /*#__PURE__*/React.createElement(_rcResizeObserver.default, {
@@ -537,5 +467,3 @@ onResize: onListHolderResize
 }
-
 var _default = /*#__PURE__*/React.forwardRef(TabNavList);
-
 exports.default = _default;

lib/TabNavList/OperationNode.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,53 +9,39 @@ value: true
 exports.default = void 0;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _KeyCode = _interopRequireDefault(require("rc-util/lib/KeyCode"));
-
 var _rcMenu = _interopRequireWildcard(require("rc-menu"));
-
 var _rcDropdown = _interopRequireDefault(require("rc-dropdown"));
-
 var _AddButton = _interopRequireDefault(require("./AddButton"));
-
 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; }
-
 function OperationNode(_ref, ref) {
   var prefixCls = _ref.prefixCls,
-      id = _ref.id,
-      tabs = _ref.tabs,
-      locale = _ref.locale,
-      mobile = _ref.mobile,
-      _ref$moreIcon = _ref.moreIcon,
-      moreIcon = _ref$moreIcon === void 0 ? 'More' : _ref$moreIcon,
-      moreTransitionName = _ref.moreTransitionName,
-      style = _ref.style,
-      className = _ref.className,
-      editable = _ref.editable,
-      tabBarGutter = _ref.tabBarGutter,
-      rtl = _ref.rtl,
-      removeAriaLabel = _ref.removeAriaLabel,
-      onTabClick = _ref.onTabClick,
-      getPopupContainer = _ref.getPopupContainer,
-      popupClassName = _ref.popupClassName;
-
+    id = _ref.id,
+    tabs = _ref.tabs,
+    locale = _ref.locale,
+    mobile = _ref.mobile,
+    _ref$moreIcon = _ref.moreIcon,
+    moreIcon = _ref$moreIcon === void 0 ? 'More' : _ref$moreIcon,
+    moreTransitionName = _ref.moreTransitionName,
+    style = _ref.style,
+    className = _ref.className,
+    editable = _ref.editable,
+    tabBarGutter = _ref.tabBarGutter,
+    rtl = _ref.rtl,
+    removeAriaLabel = _ref.removeAriaLabel,
+    onTabClick = _ref.onTabClick,
+    getPopupContainer = _ref.getPopupContainer,
+    popupClassName = _ref.popupClassName;
   // ======================== Dropdown ========================
   var _useState = (0, React.useState)(false),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      open = _useState2[0],
-      setOpen = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    open = _useState2[0],
+    setOpen = _useState2[1];
   var _useState3 = (0, React.useState)(null),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      selectedKey = _useState4[0],
-      setSelectedKey = _useState4[1];
-
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    selectedKey = _useState4[0],
+    setSelectedKey = _useState4[1];
   var popupId = "".concat(id, "-more-popup");
@@ -67,3 +51,2 @@ var dropdownPrefix = "".concat(prefixCls, "-dropdown");
   var dropdownAriaLabel = locale === null || locale === void 0 ? void 0 : locale.dropdownAriaLabel;
-
   function onRemoveTab(event, key) {
@@ -77,7 +60,6 @@ event.preventDefault();
   }
-
   var menu = /*#__PURE__*/React.createElement(_rcMenu.default, {
     onClick: function onClick(_ref2) {
       var key = _ref2.key,
-          domEvent = _ref2.domEvent;
+        domEvent = _ref2.domEvent;
       onTabClick(key, domEvent);
@@ -112,3 +94,2 @@ setOpen(false);
   }));
-
   function selectOffset(offset) {
@@ -122,7 +103,5 @@ var enabledTabs = tabs.filter(function (tab) {
     var len = enabledTabs.length;
-
     for (var i = 0; i < len; i += 1) {
       selectedIndex = (selectedIndex + offset + len) % len;
       var tab = enabledTabs[selectedIndex];
-
       if (!tab.disabled) {
@@ -134,6 +113,4 @@ setSelectedKey(tab.key);
   }
-
   function onKeyDown(e) {
     var which = e.which;
-
     if (!open) {
@@ -144,6 +121,4 @@ if ([_KeyCode.default.DOWN, _KeyCode.default.SPACE, _KeyCode.default.ENTER].includes(which)) {
       }
-
       return;
     }
-
     switch (which) {
@@ -154,3 +129,2 @@ case _KeyCode.default.UP:
         break;
-
       case _KeyCode.default.DOWN:
@@ -160,7 +134,5 @@ selectOffset(1);
         break;
-
       case _KeyCode.default.ESC:
         setOpen(false);
         break;
-
       case _KeyCode.default.SPACE:
@@ -171,9 +143,7 @@ case _KeyCode.default.ENTER:
     }
-  } // ========================= Effect =========================
-
-
+  }
+  // ========================= Effect =========================
   (0, React.useEffect)(function () {
     // We use query element here to avoid React strict warning
     var ele = document.getElementById(selectedItemId);
-
     if (ele && ele.scrollIntoView) {
@@ -187,6 +157,5 @@ ele.scrollIntoView(false);
     }
-  }, [open]); // ========================= Render =========================
-
+  }, [open]);
+  // ========================= Render =========================
   var moreStyle = (0, _defineProperty2.default)({}, rtl ? 'marginRight' : 'marginLeft', tabBarGutter);
-
   if (!tabs.length) {
@@ -196,3 +165,2 @@ moreStyle.visibility = 'hidden';
   }
-
   var overlayClassName = (0, _classnames.default)((0, _defineProperty2.default)({}, "".concat(dropdownPrefix, "-rtl"), rtl));
@@ -232,5 +200,5 @@ var moreNode = mobile ? null : /*#__PURE__*/React.createElement(_rcDropdown.default, {
 }
-
 var _default = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(OperationNode), function (_, next) {
-  return (// https://github.com/ant-design/ant-design/issues/32544
+  return (
+    // https://github.com/ant-design/ant-design/issues/32544
     // We'd better remove syntactic sugar in `rc-menu` since this has perf issue
@@ -240,3 +208,2 @@ next.tabMoving
 });
-
 exports.default = _default;

lib/TabNavList/TabNode.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,34 +9,26 @@ value: true
 exports.default = void 0;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _KeyCode = _interopRequireDefault(require("rc-util/lib/KeyCode"));
-
 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; }
-
 function TabNode(_ref, ref) {
   var _classNames;
-
   var prefixCls = _ref.prefixCls,
-      id = _ref.id,
-      active = _ref.active,
-      _ref$tab = _ref.tab,
-      key = _ref$tab.key,
-      label = _ref$tab.label,
-      disabled = _ref$tab.disabled,
-      closeIcon = _ref$tab.closeIcon,
-      closable = _ref.closable,
-      renderWrapper = _ref.renderWrapper,
-      removeAriaLabel = _ref.removeAriaLabel,
-      editable = _ref.editable,
-      onClick = _ref.onClick,
-      onRemove = _ref.onRemove,
-      onFocus = _ref.onFocus,
-      style = _ref.style;
+    id = _ref.id,
+    active = _ref.active,
+    _ref$tab = _ref.tab,
+    key = _ref$tab.key,
+    label = _ref$tab.label,
+    disabled = _ref$tab.disabled,
+    closeIcon = _ref$tab.closeIcon,
+    closable = _ref.closable,
+    renderWrapper = _ref.renderWrapper,
+    removeAriaLabel = _ref.removeAriaLabel,
+    editable = _ref.editable,
+    onClick = _ref.onClick,
+    onRemove = _ref.onRemove,
+    onFocus = _ref.onFocus,
+    style = _ref.style;
   var tabPrefix = "".concat(prefixCls, "-tab");
@@ -49,3 +39,2 @@ React.useEffect(function () {
   var removable = editable && closable !== false && !disabled;
-
   function onInternalClick(e) {
@@ -55,6 +44,4 @@ if (disabled) {
     }
-
     onClick(e);
   }
-
   function onRemoveTab(event) {
@@ -68,3 +55,2 @@ event.preventDefault();
   }
-
   var node = /*#__PURE__*/React.createElement("div", {
@@ -107,5 +93,3 @@ key: key,
 }
-
 var _default = /*#__PURE__*/React.forwardRef(TabNode);
-
 exports.default = _default;

lib/TabNavList/Wrapper.d.ts

 import type { TabNavListProps } from '.';
-export declare type TabNavListWrapperProps = Required<Omit<TabNavListProps, 'children' | 'className'>> & TabNavListProps;
+export type TabNavListWrapperProps = Required<Omit<TabNavListProps, 'children' | 'className'>> & TabNavListProps;
 export default function TabNavListWrapper({ renderTabBar, ...restProps }: TabNavListWrapperProps): JSX.Element;

lib/TabNavList/Wrapper.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,32 +9,19 @@ value: true
 exports.default = TabNavListWrapper;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _ = _interopRequireDefault(require("."));
-
 var _TabContext = _interopRequireDefault(require("../TabContext"));
-
 var _TabPane = _interopRequireDefault(require("../TabPanelList/TabPane"));
-
 var _excluded = ["renderTabBar"],
-    _excluded2 = ["label", "key"];
-
+  _excluded2 = ["label", "key"];
 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; }
-
 // We have to create a TabNavList components.
 function TabNavListWrapper(_ref) {
   var renderTabBar = _ref.renderTabBar,
-      restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-
+    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var _useContext = (0, _react.useContext)(_TabContext.default),
-      tabs = _useContext.tabs;
-
+    tabs = _useContext.tabs;
   if (renderTabBar) {
@@ -47,4 +32,4 @@ var tabNavBarProps = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, restProps), {}, {
         var label = _ref2.label,
-            key = _ref2.key,
-            restTabProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
+          key = _ref2.key,
+          restTabProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
         return /*#__PURE__*/_react.default.createElement(_TabPane.default, (0, _extends2.default)({
@@ -59,4 +44,3 @@ tab: label,
   }
-
   return /*#__PURE__*/_react.default.createElement(_.default, restProps);
 }

lib/TabPanelList/index.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,38 +9,23 @@ value: true
 exports.default = TabPanelList;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _rcMotion = _interopRequireDefault(require("rc-motion"));
-
 var _TabContext = _interopRequireDefault(require("../TabContext"));
-
 var _TabPane = _interopRequireDefault(require("./TabPane"));
-
 var _excluded = ["key", "forceRender", "style", "className"];
-
 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; }
-
 function TabPanelList(_ref) {
   var id = _ref.id,
-      activeKey = _ref.activeKey,
-      animated = _ref.animated,
-      tabPosition = _ref.tabPosition,
-      destroyInactiveTabPane = _ref.destroyInactiveTabPane;
-
+    activeKey = _ref.activeKey,
+    animated = _ref.animated,
+    tabPosition = _ref.tabPosition,
+    destroyInactiveTabPane = _ref.destroyInactiveTabPane;
   var _React$useContext = React.useContext(_TabContext.default),
-      prefixCls = _React$useContext.prefixCls,
-      tabs = _React$useContext.tabs;
-
+    prefixCls = _React$useContext.prefixCls,
+    tabs = _React$useContext.tabs;
   var tabPaneAnimated = animated.tabPane;
@@ -56,6 +39,6 @@ var tabPanePrefixCls = "".concat(prefixCls, "-tabpane");
     var key = _ref2.key,
-        forceRender = _ref2.forceRender,
-        paneStyle = _ref2.style,
-        paneClassName = _ref2.className,
-        restTabProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+      forceRender = _ref2.forceRender,
+      paneStyle = _ref2.style,
+      paneClassName = _ref2.className,
+      restTabProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
     var active = key === activeKey;
@@ -70,3 +53,3 @@ return /*#__PURE__*/React.createElement(_rcMotion.default, (0, _extends2.default)({
       var motionStyle = _ref3.style,
-          motionClassName = _ref3.className;
+        motionClassName = _ref3.className;
       return /*#__PURE__*/React.createElement(_TabPane.default, (0, _extends2.default)({}, restTabProps, {
@@ -73,0 +56,0 @@ prefixCls: tabPanePrefixCls,

lib/TabPanelList/TabPane.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,19 +9,14 @@ value: true
 exports.default = void 0;
-
 var React = _interopRequireWildcard(require("react"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 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 TabPane = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var prefixCls = _ref.prefixCls,
-      className = _ref.className,
-      style = _ref.style,
-      id = _ref.id,
-      active = _ref.active,
-      tabKey = _ref.tabKey,
-      children = _ref.children;
+    className = _ref.className,
+    style = _ref.style,
+    id = _ref.id,
+    active = _ref.active,
+    tabKey = _ref.tabKey,
+    children = _ref.children;
   return /*#__PURE__*/React.createElement("div", {
@@ -40,8 +33,6 @@ id: id && "".concat(id, "-panel-").concat(tabKey),
 });
-
 if (process.env.NODE_ENV !== 'production') {
   TabPane.displayName = 'TabPane';
 }
-
 var _default = TabPane;
 exports.default = _default;

lib/Tabs.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof3 = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,37 +9,19 @@ value: true
 exports.default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _isMobile = _interopRequireDefault(require("rc-util/lib/isMobile"));
-
 var _useMergedState5 = _interopRequireDefault(require("rc-util/lib/hooks/useMergedState"));
-
 var _TabPanelList = _interopRequireDefault(require("./TabPanelList"));
-
 var _TabContext = _interopRequireDefault(require("./TabContext"));
-
 var _Wrapper = _interopRequireDefault(require("./TabNavList/Wrapper"));
-
 var _useAnimateConfig = _interopRequireDefault(require("./hooks/useAnimateConfig"));
-
 var _excluded = ["id", "prefixCls", "className", "items", "direction", "activeKey", "defaultActiveKey", "editable", "animated", "tabPosition", "tabBarGutter", "tabBarStyle", "tabBarExtraContent", "locale", "moreIcon", "moreTransitionName", "destroyInactiveTabPane", "renderTabBar", "onChange", "onTabClick", "onTabScroll", "getPopupContainer", "popupClassName"];
-
 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 || _typeof3(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; }
-
 /**
@@ -58,32 +38,30 @@ * Should added antd:
 var uuid = 0;
-
 function Tabs(_ref, ref) {
   var _classNames;
-
   var id = _ref.id,
-      _ref$prefixCls = _ref.prefixCls,
-      prefixCls = _ref$prefixCls === void 0 ? 'rc-tabs' : _ref$prefixCls,
-      className = _ref.className,
-      items = _ref.items,
-      direction = _ref.direction,
-      activeKey = _ref.activeKey,
-      defaultActiveKey = _ref.defaultActiveKey,
-      editable = _ref.editable,
-      animated = _ref.animated,
-      _ref$tabPosition = _ref.tabPosition,
-      tabPosition = _ref$tabPosition === void 0 ? 'top' : _ref$tabPosition,
-      tabBarGutter = _ref.tabBarGutter,
-      tabBarStyle = _ref.tabBarStyle,
-      tabBarExtraContent = _ref.tabBarExtraContent,
-      locale = _ref.locale,
-      moreIcon = _ref.moreIcon,
-      moreTransitionName = _ref.moreTransitionName,
-      destroyInactiveTabPane = _ref.destroyInactiveTabPane,
-      renderTabBar = _ref.renderTabBar,
-      onChange = _ref.onChange,
-      onTabClick = _ref.onTabClick,
-      onTabScroll = _ref.onTabScroll,
-      getPopupContainer = _ref.getPopupContainer,
-      popupClassName = _ref.popupClassName,
-      restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+    _ref$prefixCls = _ref.prefixCls,
+    prefixCls = _ref$prefixCls === void 0 ? 'rc-tabs' : _ref$prefixCls,
+    className = _ref.className,
+    items = _ref.items,
+    direction = _ref.direction,
+    activeKey = _ref.activeKey,
+    defaultActiveKey = _ref.defaultActiveKey,
+    editable = _ref.editable,
+    animated = _ref.animated,
+    _ref$tabPosition = _ref.tabPosition,
+    tabPosition = _ref$tabPosition === void 0 ? 'top' : _ref$tabPosition,
+    tabBarGutter = _ref.tabBarGutter,
+    tabBarStyle = _ref.tabBarStyle,
+    tabBarExtraContent = _ref.tabBarExtraContent,
+    locale = _ref.locale,
+    moreIcon = _ref.moreIcon,
+    moreTransitionName = _ref.moreTransitionName,
+    destroyInactiveTabPane = _ref.destroyInactiveTabPane,
+    renderTabBar = _ref.renderTabBar,
+    onChange = _ref.onChange,
+    onTabClick = _ref.onTabClick,
+    onTabScroll = _ref.onTabScroll,
+    getPopupContainer = _ref.getPopupContainer,
+    popupClassName = _ref.popupClassName,
+    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var tabs = React.useMemo(function () {
@@ -95,36 +73,32 @@ return (items || []).filter(function (item) {
   var rtl = direction === 'rtl';
-  var mergedAnimated = (0, _useAnimateConfig.default)(animated); // ======================== Mobile ========================
-
+  var mergedAnimated = (0, _useAnimateConfig.default)(animated);
+  // ======================== Mobile ========================
   var _useState = (0, React.useState)(false),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      mobile = _useState2[0],
-      setMobile = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    mobile = _useState2[0],
+    setMobile = _useState2[1];
   (0, React.useEffect)(function () {
     // Only update on the client side
     setMobile((0, _isMobile.default)());
-  }, []); // ====================== Active Key ======================
-
+  }, []);
+  // ====================== Active Key ======================
   var _useMergedState = (0, _useMergedState5.default)(function () {
-    var _tabs$;
-
-    return (_tabs$ = tabs[0]) === null || _tabs$ === void 0 ? void 0 : _tabs$.key;
-  }, {
-    value: activeKey,
-    defaultValue: defaultActiveKey
-  }),
-      _useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
-      mergedActiveKey = _useMergedState2[0],
-      setMergedActiveKey = _useMergedState2[1];
-
+      var _tabs$;
+      return (_tabs$ = tabs[0]) === null || _tabs$ === void 0 ? void 0 : _tabs$.key;
+    }, {
+      value: activeKey,
+      defaultValue: defaultActiveKey
+    }),
+    _useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
+    mergedActiveKey = _useMergedState2[0],
+    setMergedActiveKey = _useMergedState2[1];
   var _useState3 = (0, React.useState)(function () {
-    return tabs.findIndex(function (tab) {
-      return tab.key === mergedActiveKey;
-    });
-  }),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      activeIndex = _useState4[0],
-      setActiveIndex = _useState4[1]; // Reset active key if not exist anymore
-
-
+      return tabs.findIndex(function (tab) {
+        return tab.key === mergedActiveKey;
+      });
+    }),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    activeIndex = _useState4[0],
+    setActiveIndex = _useState4[1];
+  // Reset active key if not exist anymore
   (0, React.useEffect)(function () {
@@ -134,23 +108,19 @@ var newActiveIndex = tabs.findIndex(function (tab) {
     });
-
     if (newActiveIndex === -1) {
       var _tabs$newActiveIndex;
-
       newActiveIndex = Math.max(0, Math.min(activeIndex, tabs.length - 1));
       setMergedActiveKey((_tabs$newActiveIndex = tabs[newActiveIndex]) === null || _tabs$newActiveIndex === void 0 ? void 0 : _tabs$newActiveIndex.key);
     }
-
     setActiveIndex(newActiveIndex);
   }, [tabs.map(function (tab) {
     return tab.key;
-  }).join('_'), mergedActiveKey, activeIndex]); // ===================== Accessibility ====================
-
+  }).join('_'), mergedActiveKey, activeIndex]);
+  // ===================== Accessibility ====================
   var _useMergedState3 = (0, _useMergedState5.default)(null, {
-    value: id
-  }),
-      _useMergedState4 = (0, _slicedToArray2.default)(_useMergedState3, 2),
-      mergedId = _useMergedState4[0],
-      setMergedId = _useMergedState4[1]; // Async generate id to avoid ssr mapping failed
-
-
+      value: id
+    }),
+    _useMergedState4 = (0, _slicedToArray2.default)(_useMergedState3, 2),
+    mergedId = _useMergedState4[0],
+    setMergedId = _useMergedState4[1];
+  // Async generate id to avoid ssr mapping failed
   (0, React.useEffect)(function () {
@@ -161,4 +131,4 @@ if (!id) {
     }
-  }, []); // ======================== Events ========================
-
+  }, []);
+  // ======================== Events ========================
   function onInternalTabClick(key, e) {
@@ -168,9 +138,7 @@ onTabClick === null || onTabClick === void 0 ? void 0 : onTabClick(key, e);
     setMergedActiveKey(key);
-
     if (isActiveChanged) {
       onChange === null || onChange === void 0 ? void 0 : onChange(key);
     }
-  } // ======================== Render ========================
-
-
+  }
+  // ======================== Render ========================
   var sharedProps = {
@@ -216,10 +184,7 @@ id: mergedId,
 }
-
 var ForwardTabs = /*#__PURE__*/React.forwardRef(Tabs);
-
 if (process.env.NODE_ENV !== 'production') {
   ForwardTabs.displayName = 'Tabs';
 }
-
 var _default = ForwardTabs;
 exports.default = _default;

lib/util.js

@@ -7,3 +7,2 @@ "use strict";
 exports.stringify = stringify;
-
 /**
@@ -15,3 +14,2 @@ * We trade Map as deps which may change with same value but different ref object.
   var tgt;
-
   if (obj instanceof Map) {
@@ -25,4 +23,3 @@ tgt = {};
   }
-
   return JSON.stringify(tgt);
 }

package.json

 {
   "name": "rc-tabs",
-  "version": "12.3.0",
+  "version": "12.4.1",
   "description": "tabs ui component for react",
@@ -82,3 +82,3 @@ "engines": {
     "rc-dropdown": "~4.0.0",
-    "rc-menu": "~9.7.2",
+    "rc-menu": "~9.8.0",
     "rc-motion": "^2.6.2",
@@ -85,0 +85,0 @@ "rc-resize-observer": "^1.0.0",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Lines of code

3699

increased by2.64%

Worsened metrics

Total package byte prevSize

155315

decreased by-0.7%

Dependency changes

• + Addedrc-menu@9.8.4(transitive)

• - Removedrc-menu@9.7.2(transitive)

• - Removedshallowequal@1.1.0(transitive)

• Updatedrc-menu@~9.8.0