@sheinx/base 3.5.5-beta.4 → 3.5.5-beta.6

package/cjs/tabs/tabs-header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-header.d.ts","sourceRoot":"","sources":["tabs-header.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAwBrD,QAAA,MAAM,UAAU,UAAW,eAAe,gBAmRzC,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"tabs-header.d.ts","sourceRoot":"","sources":["tabs-header.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAwBrD,QAAA,MAAM,UAAU,UAAW,eAAe,gBA4QzC,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/cjs/tabs/tabs-header.js

@@ -1,6 +1,5 @@
 "use strict";
 
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -14,17 +13,18 @@ var _button = _interopRequireDefault(require("../button"));
 var _config = require("../config");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var getRectDiff = function getRectDiff(node, pNode) {
   var nodeRect = node.getBoundingClientRect();
   var pNodeRect = pNode.getBoundingClientRect();
@@ -48,14 +48,9 @@ var TabsHeader = function TabsHeader(props) {
     extra = props.extra,
     splitColor = props.splitColor,
     tabBarStyle = props.tabBarStyle,
-    getPosition = props.getPosition,
-    sticky = props.sticky;
+    getPosition = props.getPosition;
   var headerRef = (0, _react.useRef)(null);
   var scrollRef = (0, _react.useRef)(null);
-  var _useState = (0, _react.useState)(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    loaded = _useState2[0],
-    setLoaded = _useState2[1];
   var tabRef = (0, _react.useRef)({});
   var _useTabsContext = (0, _hooks.useTabsContext)(),
     shape = _useTabsContext.shape,
@@ -64,11 +59,6 @@ var TabsHeader = function TabsHeader(props) {
     active = _useTabsContext.active;
   var config = (0, _config.useConfig)();
   var isRtl = config.direction === 'rtl';
-  (0, _react.useEffect)(function () {
-    if (sticky && headerRef.current && scrollRef.current && !loaded) {
-      setLoaded(true);
-    }
-  }, [loaded, sticky]);
   var _useTransform = (0, _hooks.useTransform)({
       autoScroll: true,
       direction: isVertical ? 'Y' : 'X',
@@ -130,17 +120,17 @@ var TabsHeader = function TabsHeader(props) {
     var single = isRtl && !isVertical ? -1 : 1;
     setTransform(delta + headerRef.current.clientWidth * single);
   };
-  var _useState3 = (0, _react.useState)({
+  var _useState = (0, _react.useState)({
       offsetTop: 0,
       offsetLeft: 0
     }),
+    _useState2 = _slicedToArray(_useState, 2),
+    currentTabOffset = _useState2[0],
+    setCurrentTabOffset = _useState2[1];
+  var _useState3 = (0, _react.useState)(null),
     _useState4 = _slicedToArray(_useState3, 2),
-    currentTabOffset = _useState4[0],
-    setCurrentTabOffset = _useState4[1];
-  var _useState5 = (0, _react.useState)(null),
-    _useState6 = _slicedToArray(_useState5, 2),
-    currentTabRect = _useState6[0],
-    setCurrentTabRect = _useState6[1];
+    currentTabRect = _useState4[0],
+    setCurrentTabRect = _useState4[1];
   (0, _react.useEffect)(function () {
     var _currentTab$getBoundi;
     if (shape !== 'line' && shape !== 'dash') return;

package/cjs/tabs/tabs-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-panel.d.ts","sourceRoot":"","sources":["tabs-panel.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAGnD,QAAA,MAAM,SAAS,UAAW,cAAc,uBA0DvC,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"tabs-panel.d.ts","sourceRoot":"","sources":["tabs-panel.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAGnD,QAAA,MAAM,SAAS,UAAW,cAAc,uBAqEvC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/cjs/tabs/tabs-panel.js

@@ -25,6 +25,7 @@ var TabsPanel = function TabsPanel(props) {
   var _jssStyle$tabs;
   var children = props.children,
     id = props.id,
+    indexInTabs = props.index,
     tab = props.tab,
     className = props.className,
     style = props.style,
@@ -46,16 +47,22 @@ var TabsPanel = function TabsPanel(props) {
       color: props.color || (active === id ? color : undefined)
     };
     setTabs(function (prev) {
-      var prevTab = prev.find(function (item) {
+      var oldTab = prev.find(function (item) {
         return item.id === id;
       });
-      if (prevTab) {
+      if (oldTab) {
         return prev.map(function (item) {
           if (item.id !== id) return item;
           return _objectSpread(_objectSpread({}, item), tabData);
         });
       }
-      return [].concat(_toConsumableArray(prev), [tabData]);
+      if (indexInTabs === undefined) {
+        return [].concat(_toConsumableArray(prev), [tabData]);
+      }
+
+      // 向indexInTabs位置插入tabData
+      var newTabs = [].concat(_toConsumableArray(prev.slice(0, indexInTabs)), [tabData], _toConsumableArray(prev.slice(indexInTabs)));
+      return newTabs;
     });
     return function () {
       // Panel卸载了通知父组件，去销毁相应的TabsHeader
@@ -65,7 +72,7 @@ var TabsPanel = function TabsPanel(props) {
         });
       });
     };
-  }, [id, tab, color].concat(_toConsumableArray(color ? [active] : []), [props.disabled, props.jssStyle]));
+  }, [id, tab, color, active, props.disabled, props.jssStyle]);
   if (!isActive && lazy && !keekAlive.current) {
     return null;
   }

package/cjs/tabs/tabs-panel.type.d.ts

@@ -44,5 +44,11 @@ export interface TabsPanelProps extends Omit<TabsContextProps, 'tabs' | 'setTabs
      * @cn 标签页文字颜色，仅当 shape 为 "card" 时生效
      */
     color?: string;
+    /**
+     * @en The index of the panel
+     * @cn 面板的索引
+     * @private
+     */
+    index?: number;
 }
 //# sourceMappingURL=tabs-panel.type.d.ts.map

package/cjs/tabs/tabs-panel.type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-panel.type.d.ts","sourceRoot":"","sources":["tabs-panel.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC,EAChD,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IACzC,QAAQ,CAAC,EAAE;QACT,IAAI,EAAE,MAAM,WAAW,CAAC;QACxB,MAAM,EAAE,MAAM,aAAa,CAAC;KAC7B,CAAC;IACF;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACrB;;;;OAIG;IACH,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;IACrB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB"}
+{"version":3,"file":"tabs-panel.type.d.ts","sourceRoot":"","sources":["tabs-panel.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC,EAChD,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IACzC,QAAQ,CAAC,EAAE;QACT,IAAI,EAAE,MAAM,WAAW,CAAC;QACxB,MAAM,EAAE,MAAM,aAAa,CAAC;KAC7B,CAAC;IACF;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACrB;;;;OAIG;IACH,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;IACrB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB"}

package/cjs/tabs/tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["tabs.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAe,SAAS,EAAE,MAAM,aAAa,CAAC;AAErD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAOnD,QAAA,MAAM,IAAI;YAAW,SAAS;;CA2Q7B,CAAC;AAIF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["tabs.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAe,SAAS,EAAE,MAAM,aAAa,CAAC;AAErD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAOnD,QAAA,MAAM,IAAI;YAAW,SAAS;;CA4Q7B,CAAC;AAIF,eAAe,IAAI,CAAC"}

package/cjs/tabs/tabs.js

@@ -185,7 +185,8 @@ var Tabs = function Tabs(props) {
         var Child = child;
         if (isNamedComponent(Child.type) && Child.type.displayName === 'ShineoutTabsPanel') {
           return /*#__PURE__*/(0, _react.cloneElement)(Child, {
-            id: Child.props.id !== undefined ? Child.props.id : index
+            id: Child.props.id !== undefined ? Child.props.id : index,
+            index: index
           });
         }
         if (allowNonPanel) {

package/esm/tabs/tabs-header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-header.d.ts","sourceRoot":"","sources":["tabs-header.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAwBrD,QAAA,MAAM,UAAU,UAAW,eAAe,gBAmRzC,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"tabs-header.d.ts","sourceRoot":"","sources":["tabs-header.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAwBrD,QAAA,MAAM,UAAU,UAAW,eAAe,gBA4QzC,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/esm/tabs/tabs-header.js

@@ -1,15 +1,15 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import { useEffect, useRef, useState } from 'react';
 import classNames from 'classnames';
 import { useTabsContext, useTransform, util } from '@sheinx/hooks';
@@ -42,14 +42,9 @@ var TabsHeader = function TabsHeader(props) {
     extra = props.extra,
     splitColor = props.splitColor,
     tabBarStyle = props.tabBarStyle,
-    getPosition = props.getPosition,
-    sticky = props.sticky;
+    getPosition = props.getPosition;
   var headerRef = useRef(null);
   var scrollRef = useRef(null);
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    loaded = _useState2[0],
-    setLoaded = _useState2[1];
   var tabRef = useRef({});
   var _useTabsContext = useTabsContext(),
     shape = _useTabsContext.shape,
@@ -58,11 +53,6 @@ var TabsHeader = function TabsHeader(props) {
     active = _useTabsContext.active;
   var config = useConfig();
   var isRtl = config.direction === 'rtl';
-  useEffect(function () {
-    if (sticky && headerRef.current && scrollRef.current && !loaded) {
-      setLoaded(true);
-    }
-  }, [loaded, sticky]);
   var _useTransform = useTransform({
       autoScroll: true,
       direction: isVertical ? 'Y' : 'X',
@@ -124,17 +114,17 @@ var TabsHeader = function TabsHeader(props) {
     var single = isRtl && !isVertical ? -1 : 1;
     setTransform(delta + headerRef.current.clientWidth * single);
   };
-  var _useState3 = useState({
+  var _useState = useState({
       offsetTop: 0,
       offsetLeft: 0
     }),
+    _useState2 = _slicedToArray(_useState, 2),
+    currentTabOffset = _useState2[0],
+    setCurrentTabOffset = _useState2[1];
+  var _useState3 = useState(null),
     _useState4 = _slicedToArray(_useState3, 2),
-    currentTabOffset = _useState4[0],
-    setCurrentTabOffset = _useState4[1];
-  var _useState5 = useState(null),
-    _useState6 = _slicedToArray(_useState5, 2),
-    currentTabRect = _useState6[0],
-    setCurrentTabRect = _useState6[1];
+    currentTabRect = _useState4[0],
+    setCurrentTabRect = _useState4[1];
   useEffect(function () {
     var _currentTab$getBoundi;
     if (shape !== 'line' && shape !== 'dash') return;

package/esm/tabs/tabs-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-panel.d.ts","sourceRoot":"","sources":["tabs-panel.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAGnD,QAAA,MAAM,SAAS,UAAW,cAAc,uBA0DvC,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"tabs-panel.d.ts","sourceRoot":"","sources":["tabs-panel.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAGnD,QAAA,MAAM,SAAS,UAAW,cAAc,uBAqEvC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/esm/tabs/tabs-panel.js

@@ -18,6 +18,7 @@ var TabsPanel = function TabsPanel(props) {
   var _jssStyle$tabs;
   var children = props.children,
     id = props.id,
+    indexInTabs = props.index,
     tab = props.tab,
     className = props.className,
     style = props.style,
@@ -39,16 +40,22 @@ var TabsPanel = function TabsPanel(props) {
       color: props.color || (active === id ? color : undefined)
     };
     setTabs(function (prev) {
-      var prevTab = prev.find(function (item) {
+      var oldTab = prev.find(function (item) {
         return item.id === id;
       });
-      if (prevTab) {
+      if (oldTab) {
         return prev.map(function (item) {
           if (item.id !== id) return item;
           return _objectSpread(_objectSpread({}, item), tabData);
         });
       }
-      return [].concat(_toConsumableArray(prev), [tabData]);
+      if (indexInTabs === undefined) {
+        return [].concat(_toConsumableArray(prev), [tabData]);
+      }
+
+      // 向indexInTabs位置插入tabData
+      var newTabs = [].concat(_toConsumableArray(prev.slice(0, indexInTabs)), [tabData], _toConsumableArray(prev.slice(indexInTabs)));
+      return newTabs;
     });
     return function () {
       // Panel卸载了通知父组件，去销毁相应的TabsHeader
@@ -58,7 +65,7 @@ var TabsPanel = function TabsPanel(props) {
         });
       });
     };
-  }, [id, tab, color].concat(_toConsumableArray(color ? [active] : []), [props.disabled, props.jssStyle]));
+  }, [id, tab, color, active, props.disabled, props.jssStyle]);
   if (!isActive && lazy && !keekAlive.current) {
     return null;
   }

package/esm/tabs/tabs-panel.type.d.ts

@@ -44,5 +44,11 @@ export interface TabsPanelProps extends Omit<TabsContextProps, 'tabs' | 'setTabs
      * @cn 标签页文字颜色，仅当 shape 为 "card" 时生效
      */
     color?: string;
+    /**
+     * @en The index of the panel
+     * @cn 面板的索引
+     * @private
+     */
+    index?: number;
 }
 //# sourceMappingURL=tabs-panel.type.d.ts.map

package/esm/tabs/tabs-panel.type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-panel.type.d.ts","sourceRoot":"","sources":["tabs-panel.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC,EAChD,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IACzC,QAAQ,CAAC,EAAE;QACT,IAAI,EAAE,MAAM,WAAW,CAAC;QACxB,MAAM,EAAE,MAAM,aAAa,CAAC;KAC7B,CAAC;IACF;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACrB;;;;OAIG;IACH,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;IACrB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB"}
+{"version":3,"file":"tabs-panel.type.d.ts","sourceRoot":"","sources":["tabs-panel.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC,EAChD,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IACzC,QAAQ,CAAC,EAAE;QACT,IAAI,EAAE,MAAM,WAAW,CAAC;QACxB,MAAM,EAAE,MAAM,aAAa,CAAC;KAC7B,CAAC;IACF;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACrB;;;;OAIG;IACH,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;IACrB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB"}

package/esm/tabs/tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["tabs.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAe,SAAS,EAAE,MAAM,aAAa,CAAC;AAErD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAOnD,QAAA,MAAM,IAAI;YAAW,SAAS;;CA2Q7B,CAAC;AAIF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["tabs.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAe,SAAS,EAAE,MAAM,aAAa,CAAC;AAErD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAOnD,QAAA,MAAM,IAAI;YAAW,SAAS;;CA4Q7B,CAAC;AAIF,eAAe,IAAI,CAAC"}

package/esm/tabs/tabs.js

@@ -178,7 +178,8 @@ var Tabs = function Tabs(props) {
         var Child = child;
         if (isNamedComponent(Child.type) && Child.type.displayName === 'ShineoutTabsPanel') {
           return /*#__PURE__*/cloneElement(Child, {
-            id: Child.props.id !== undefined ? Child.props.id : index
+            id: Child.props.id !== undefined ? Child.props.id : index,
+            index: index
           });
         }
         if (allowNonPanel) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sheinx/base",
-  "version": "3.5.5-beta.4",
+  "version": "3.5.5-beta.6",
   "description": "",
   "keywords": [],
   "license": "MIT",
@@ -10,7 +10,7 @@
   "module": "./esm/index.js",
   "typings": "./cjs/index.d.ts",
   "dependencies": {
-    "@sheinx/hooks": "3.5.5-beta.4",
+    "@sheinx/hooks": "3.5.5-beta.6",
     "immer": "^10.0.0",
     "classnames": "^2.0.0",
     "@shined/reactive": "^0.1.3-alpha.0"