@arco-design/mobile-react 2.25.4 → 2.27.0

package/umd/image-preview/methods.js

@@ -14,9 +14,11 @@
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
   _exports.__esModule = true;
   _exports.open = open;
   _extends2 = _interopRequireDefault(_extends2);
+
   function open(Component) {
     return function (config, context) {
       var baseProps = (0, _extends2.default)({
@@ -24,32 +26,40 @@
       }, config || {}, {
         close: function close() {}
       });
-      var dynamicProps = (0, _extends2.default)({}, baseProps);
-
-      // 不同的key用不同的容器挂载
+      var dynamicProps = (0, _extends2.default)({}, baseProps); // 不同的key用不同的容器挂载
       // @en Different keys are mounted in different containers
+
       var id = "_ARCO_IMAGE_PREVIEW_DIV_" + (baseProps.key || '') + "_";
+
       var _appendElementById = (0, _mobileUtils.appendElementById)(id, baseProps.getContainer),
-        div = _appendElementById.child;
+          div = _appendElementById.child;
+
       var leaving = false;
+
       var _ReactDOMRender = new _render.ReactDOMRender(Component, div, context),
-        render = _ReactDOMRender.render;
+          render = _ReactDOMRender.render;
+
       function update(newConfig) {
         dynamicProps = (0, _extends2.default)({}, dynamicProps, newConfig || {});
         render(dynamicProps);
       }
+
       function close() {
         leaving = true;
         dynamicProps.openIndex = -1;
         render(dynamicProps);
       }
+
       dynamicProps.close = close;
+
       dynamicProps.onClose = function () {
         baseProps.onClose && baseProps.onClose();
+
         if (baseProps.unmountOnExit) {
           (0, _mobileUtils.removeElement)(div);
         }
       };
+
       dynamicProps.openIndex = -1;
       render(dynamicProps);
       setTimeout(function () {

package/umd/index-bar/context.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { IndexBarContext as IndexBarContextType } from './type';
+export declare const IndexBarContext: import("react").Context<IndexBarContextType>;

package/umd/index-bar/context.js

@@ -0,0 +1,26 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports", "react"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports, require("react"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports, global.react);
+    global.context = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _react) {
+  "use strict";
+
+  _exports.__esModule = true;
+  _exports.IndexBarContext = void 0;
+  var IndexBarContext = /*#__PURE__*/(0, _react.createContext)({
+    sticky: true,
+    getScrollContainer: function getScrollContainer() {
+      return null;
+    },
+    updateRef: function updateRef() {}
+  });
+  _exports.IndexBarContext = IndexBarContext;
+});

package/umd/index-bar/demo/style/css/mobile.css

@@ -0,0 +1,23 @@
+#demo-index-bar {
+  padding-bottom: 0px;
+}
+#demo-index-bar .arcodesign-mobile-title {
+  display: none;
+}
+#demo-index-bar .arcodesign-mobile-demo-content {
+  padding: 0;
+  background: transparent;
+  font-size: 0.32rem;
+}
+#demo-index-bar .arcodesign-mobile-demo-nav-inner::after {
+  border-bottom-color: transparent;
+}
+#demo-index-bar .custom-index-bar-height {
+  height: 480px;
+}
+#demo-index-bar .arco-tab-cell.vertical.line {
+  font-size: 0.32rem;
+}
+#demo-index-bar .arco-tab-cell.vertical.line:not(.last) {
+  margin-right: 2.78rem;
+}

package/umd/index-bar/demo/style/mobile.less

@@ -0,0 +1,26 @@
+@import '../../../../style/mixin.less';
+
+#demo-index-bar {
+    padding-bottom: 0px;
+    .arcodesign-mobile-title {
+        display: none;
+    }
+    .arcodesign-mobile-demo-content {
+        padding: 0;
+        background: transparent;
+        .rem(font-size, 16);
+    }
+    .arcodesign-mobile-demo-nav-inner::after {
+        border-bottom-color: transparent;
+    }
+
+    .custom-index-bar-height {
+        height: 480px;
+    }
+    .arco-tab-cell.vertical.line {
+        .rem(font-size, 16);
+        &:not(.last) {
+            .rem(margin-right, 139);
+        }
+    }
+}

package/umd/index-bar/group.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IndexBarBaseData, IndexBarGroupProps, IndexBarGroupRef } from './type';
+export declare const IndexBarGroup: React.ForwardRefExoticComponent<IndexBarGroupProps<IndexBarBaseData> & React.RefAttributes<IndexBarGroupRef>>;

package/umd/index-bar/group.js

@@ -0,0 +1,107 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports", "@arco-design/mobile-utils", "react", "../context-provider", "../sticky", "./context"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports, require("@arco-design/mobile-utils"), require("react"), require("../context-provider"), require("../sticky"), require("./context"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports, global.mobileUtils, global.react, global.contextProvider, global.sticky, global.context);
+    global.group = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _mobileUtils, _react, _contextProvider, _sticky, _context) {
+  "use strict";
+
+  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+  _exports.__esModule = true;
+  _exports.IndexBarGroup = void 0;
+  _react = _interopRequireWildcard(_react);
+  _sticky = _interopRequireDefault(_sticky);
+
+  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 IndexBarGroup = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
+    var groupIndex = props.index,
+        list = props.list,
+        className = props.className,
+        style = props.style,
+        children = props.children,
+        listKey = props.listKey,
+        onGroupItemClick = props.onGroupItemClick,
+        renderGroupItem = props.renderGroupItem,
+        renderStickyItem = props.renderStickyItem;
+
+    var _useContext = (0, _react.useContext)(_contextProvider.GlobalContext),
+        prefixCls = _useContext.prefixCls; // 有可能是IndexBar.Group的写法，因此sticky从context中获得
+
+
+    var _useContext2 = (0, _react.useContext)(_context.IndexBarContext),
+        sticky = _useContext2.sticky,
+        getScrollContainer = _useContext2.getScrollContainer,
+        activeIndex = _useContext2.activeIndex,
+        updateRef = _useContext2.updateRef;
+
+    var domRef = (0, _react.useRef)(null);
+    (0, _react.useImperativeHandle)(ref, function () {
+      return {
+        dom: domRef.current
+      };
+    }); // 用户自定义列表元素vnode的key
+
+    var formatGetListKey = function formatGetListKey(data, index) {
+      var _listKey;
+
+      return (_listKey = listKey == null ? void 0 : listKey(data, index)) != null ? _listKey : index;
+    };
+
+    var renderChildren = function renderChildren() {
+      var _ref;
+
+      return (_ref = children != null ? children : list == null ? void 0 : list.map(function (data, index) {
+        return /*#__PURE__*/_react.default.createElement("div", {
+          className: prefixCls + "-index-bar-group-item",
+          key: formatGetListKey(data, index),
+          onClick: function onClick() {
+            return onGroupItemClick == null ? void 0 : onGroupItemClick(groupIndex, data, index);
+          }
+        }, renderGroupItem ? renderGroupItem(groupIndex, data, index) : data.content);
+      })) != null ? _ref : null;
+    };
+
+    var renderIndexTitle = function renderIndexTitle() {
+      var _cls;
+
+      if (renderStickyItem) {
+        return renderStickyItem(groupIndex);
+      }
+
+      var titleDom = /*#__PURE__*/_react.default.createElement("div", {
+        className: (0, _mobileUtils.cls)(prefixCls + "-index-bar-group-title", (_cls = {}, _cls[prefixCls + "-index-bar-group-active"] = activeIndex === groupIndex, _cls))
+      }, groupIndex);
+
+      var groupDom = domRef.current;
+      return sticky ? /*#__PURE__*/_react.default.createElement(_sticky.default, {
+        getContainer: function getContainer() {
+          return groupDom;
+        },
+        stickyStyle: "absolute",
+        getScrollContainer: getScrollContainer,
+        ref: function ref(stickyRef) {
+          return stickyRef && updateRef(groupIndex, stickyRef);
+        }
+      }, titleDom) : titleDom;
+    };
+
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _mobileUtils.cls)(prefixCls + "-index-bar-group", className),
+      style: style,
+      "data-index": groupIndex,
+      ref: domRef
+    }, renderIndexTitle(), renderChildren());
+  });
+  _exports.IndexBarGroup = IndexBarGroup;
+});

package/umd/index-bar/index.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { IndexBarBaseData, IndexBarProps, IndexBarRef } from './type';
+export type { IndexBarProps, IndexBarRef, IndexBarGroupProps, IndexBarGroupRef, IndexBarChangeTrigger, IndexBarIndexType, IndexBarTipType, } from './type';
+declare const _default: React.ForwardRefExoticComponent<IndexBarProps<IndexBarBaseData> & React.RefAttributes<IndexBarRef>> & {
+    Group: React.ForwardRefExoticComponent<import("./type").IndexBarGroupProps<IndexBarBaseData> & React.RefAttributes<import("./type").IndexBarGroupRef>>;
+};
+/**
+ * 索引栏组件
+ * @en IndexBar component
+ * @type 导航
+ * @type_en Navigation
+ * @name 索引栏
+ * @name_en SearchBar
+ */
+export default _default;

package/umd/index-bar/index.js

@@ -0,0 +1,274 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports", "@arco-design/mobile-utils", "@arco-design/mobile-utils/utils", "lodash.throttle", "react", "../context-provider", "./context", "./group", "./side-bar", "./utils"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports, require("@arco-design/mobile-utils"), require("@arco-design/mobile-utils/utils"), require("lodash.throttle"), require("react"), require("../context-provider"), require("./context"), require("./group"), require("./side-bar"), require("./utils"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports, global.mobileUtils, global.utils, global.lodash, global.react, global.contextProvider, global.context, global.group, global.sideBar, global.utils);
+    global.index = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _mobileUtils, _utils, _lodash, _react, _contextProvider, _context, _group, _sideBar, _utils2) {
+  "use strict";
+
+  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+  _exports.__esModule = true;
+  _exports.default = void 0;
+  _lodash = _interopRequireDefault(_lodash);
+  _react = _interopRequireWildcard(_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 IndexBar = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
+    var _props$className = props.className,
+        className = _props$className === void 0 ? '' : _props$className,
+        style = props.style,
+        children = props.children,
+        _props$sticky = props.sticky,
+        sticky = _props$sticky === void 0 ? true : _props$sticky,
+        _props$groups = props.groups,
+        groups = _props$groups === void 0 ? [] : _props$groups,
+        _props$tipType = props.tipType,
+        tipType = _props$tipType === void 0 ? 'toast' : _props$tipType,
+        defaultIndex = props.defaultIndex,
+        scrollBezier = props.scrollBezier,
+        _props$scrollDuration = props.scrollDuration,
+        scrollDuration = _props$scrollDuration === void 0 ? 0 : _props$scrollDuration,
+        _props$disableSidebar = props.disableSidebar,
+        disableSidebar = _props$disableSidebar === void 0 ? false : _props$disableSidebar,
+        onChange = props.onChange,
+        onGroupItemClick = props.onGroupItemClick,
+        renderSideBar = props.renderSideBar,
+        renderSideBarItem = props.renderSideBarItem,
+        renderTip = props.renderTip,
+        renderStickyItem = props.renderStickyItem,
+        renderGroupItem = props.renderGroupItem; // 最外层dom元素的ref
+
+    var domRef = (0, _react.useRef)(null); // 所有group的容器dom，domRef的内容就是contanerRef和sidebar的内容
+
+    var containerRef = (0, _react.useRef)(null); // 过滤掉jsx写法中，奇怪的child
+
+    var formatChildren = (0, _utils2.filterValidIndexBarChild)(children); // 所有的索引内容，优先从props.groups中获取，再从formatChildren中获取
+
+    var indexes = (0, _react.useMemo)(function () {
+      if (groups.length) {
+        return groups.map(function (group) {
+          return group.index;
+        });
+      }
+
+      return formatChildren.map(function (child) {
+        return child.props.index;
+      });
+    }, [children, groups]);
+    var groupRefs = (0, _react.useRef)({}); // 当前激活的Index
+
+    var _useState = (0, _react.useState)(function () {
+      return defaultIndex != null ? defaultIndex : indexes == null ? void 0 : indexes[0];
+    }),
+        activeIndex = _useState[0],
+        setActiveIndex = _useState[1]; // 给IndexBarGroup用的上下文，主要是为了兼容jsx的写法
+
+
+    var contextValue = (0, _react.useMemo)(function () {
+      return {
+        sticky: sticky,
+        getScrollContainer: function getScrollContainer() {
+          return containerRef.current;
+        },
+        activeIndex: activeIndex,
+        updateRef: function updateRef(groupIndex, stickyRef) {
+          groupRefs.current[groupIndex] = stickyRef;
+        }
+      };
+    }, [sticky, activeIndex]); // 用户是否正在触碰sidebar, 如果为true的话，禁用handleScroll的处理
+
+    var isScrollHandlerDisabledRef = (0, _react.useRef)(false);
+
+    var handleChangeActiveIndex = function handleChangeActiveIndex(index, type) {
+      setActiveIndex(function (oldActiveIndex) {
+        var newActiveIndex = (0, _utils2.getFormatIndex)(index, oldActiveIndex); // 和上一次激活的acitveIndex不同，再触发onChange事件
+
+        if (newActiveIndex !== oldActiveIndex) {
+          onChange == null ? void 0 : onChange(newActiveIndex, type);
+        }
+
+        return newActiveIndex;
+      });
+    }; // 要滚动到哪个指定的index
+
+
+    var handleScrollIntoIndex = function handleScrollIntoIndex(params) {
+      var index = params.index,
+          type = params.type,
+          _params$rightNow = params.rightNow,
+          rightNow = _params$rightNow === void 0 ? false : _params$rightNow; // 不传index默认走第一个index
+
+      var formatIndex = index != null ? index : indexes == null ? void 0 : indexes[0];
+      var containerDom = containerRef.current;
+
+      if (!(0, _utils2.isValidIndex)(index) || !containerDom) {
+        return;
+      } // 寻找Index对应的groupDom
+
+
+      var groupDom = (0, _utils2.getGroupDomFromIndex)(containerDom, formatIndex);
+
+      if (groupDom) {
+        handleChangeActiveIndex(formatIndex, type);
+        var duration = rightNow ? 0 : scrollDuration;
+        var targetScrollTop = groupDom.offsetTop; // 将屏幕滚动到groupDom
+        // 手动触发需要禁用handleScroll事件
+
+        if (type === 'manual') {
+          isScrollHandlerDisabledRef.current = true;
+          setTimeout(function () {
+            isScrollHandlerDisabledRef.current = false;
+          }, duration);
+        }
+
+        if (duration > 0) {
+          (0, _utils.scrollWithAnimation)(containerDom.scrollTop, targetScrollTop, function (top) {
+            return containerDom.scrollTop = top;
+          }, duration, scrollBezier);
+        } else {
+          containerDom.scrollTop = targetScrollTop;
+        }
+      }
+    };
+
+    (0, _react.useImperativeHandle)(ref, function () {
+      return {
+        dom: domRef.current,
+        scrollToIndex: function scrollToIndex(index, rightNow) {
+          if ((0, _utils2.isValidIndex)(index)) {
+            handleScrollIntoIndex({
+              index: index,
+              rightNow: rightNow,
+              type: 'manual'
+            });
+          }
+        },
+        recalculatePosition: function recalculatePosition(targetIndex) {
+          var formatIndex = targetIndex != null ? targetIndex : activeIndex;
+
+          if (formatIndex) {
+            var targetStickyRef = groupRefs.current[formatIndex];
+
+            if (targetStickyRef && targetStickyRef.recalculatePosition) {
+              targetStickyRef.recalculatePosition();
+            }
+          }
+        }
+      };
+    });
+
+    var renderChildren = function renderChildren() {
+      if (formatChildren.length) {
+        return formatChildren;
+      }
+
+      return groups == null ? void 0 : groups.map(function (group) {
+        return /*#__PURE__*/_react.default.createElement(_group.IndexBarGroup, {
+          index: group.index,
+          key: group.index,
+          list: group.list,
+          onGroupItemClick: onGroupItemClick,
+          renderGroupItem: renderGroupItem,
+          renderStickyItem: renderStickyItem
+        });
+      });
+    };
+
+    (0, _react.useEffect)(function () {
+      var _containerRef$current;
+
+      var handleScroll = (0, _lodash.default)(function () {
+        // 用户正在触碰sidebar和手动触发scroll时禁用滚动事件的处理
+        if (!containerRef.current || isScrollHandlerDisabledRef.current) {
+          return;
+        } // 根据滚动的距离，获取处于屏幕最顶部的group是哪个
+
+
+        var scrollTop = containerRef.current.scrollTop;
+
+        for (var i = 0; i < containerRef.current.children.length; i++) {
+          var child = containerRef.current.children[i];
+
+          if (!child || !child.dataset || typeof child.dataset.index === 'undefined') {
+            continue;
+          }
+
+          if (child.offsetTop + child.clientHeight >= scrollTop) {
+            handleChangeActiveIndex(child.dataset.index, 'swipe');
+            break;
+          }
+        }
+      }, 100); // 页面挂载时，如果是传入了defaultIndex，则滚动到对应位置
+
+      if (activeIndex) {
+        handleScrollIntoIndex({
+          index: activeIndex,
+          rightNow: true,
+          type: 'manual'
+        });
+      }
+
+      (_containerRef$current = containerRef.current) == null ? void 0 : _containerRef$current.addEventListener('scroll', handleScroll);
+      return function () {
+        var _containerRef$current2;
+
+        (_containerRef$current2 = containerRef.current) == null ? void 0 : _containerRef$current2.removeEventListener('scroll', handleScroll);
+      };
+    }, []);
+    return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, function (_ref) {
+      var prefixCls = _ref.prefixCls;
+      return /*#__PURE__*/_react.default.createElement(_context.IndexBarContext.Provider, {
+        value: contextValue
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        className: (0, _mobileUtils.cls)(prefixCls + "-index-bar", className),
+        style: style,
+        ref: domRef
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        className: prefixCls + "-index-bar-container",
+        ref: containerRef
+      }, renderChildren()), !disableSidebar && /*#__PURE__*/_react.default.createElement(_sideBar.IndexBarSideBar, {
+        tipType: tipType,
+        activeIndex: activeIndex,
+        prefixCls: prefixCls,
+        indexes: indexes,
+        onTouching: function onTouching(isTouching) {
+          return isScrollHandlerDisabledRef.current = isTouching;
+        },
+        onClick: function onClick(newIndex) {
+          return handleScrollIntoIndex({
+            index: newIndex,
+            type: 'sidebar'
+          });
+        },
+        renderSideBar: renderSideBar,
+        renderSideBarItem: renderSideBarItem,
+        renderTip: renderTip
+      })));
+    });
+  });
+  /**
+   * 索引栏组件
+   * @en IndexBar component
+   * @type 导航
+   * @type_en Navigation
+   * @name 索引栏
+   * @name_en SearchBar
+   */
+
+  var _default = (0, _mobileUtils.componentWrapper)(IndexBar, {
+    Group: _group.IndexBarGroup
+  });
+
+  _exports.default = _default;
+});

package/umd/index-bar/side-bar.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IndexBarSideBarProps } from './type';
+export declare function IndexBarSideBar(props: IndexBarSideBarProps): JSX.Element;

package/umd/index-bar/side-bar.js

@@ -0,0 +1,113 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports", "react", "@arco-design/mobile-utils"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports, require("react"), require("@arco-design/mobile-utils"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports, global.react, global.mobileUtils);
+    global.sideBar = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _react, _mobileUtils) {
+  "use strict";
+
+  _exports.__esModule = true;
+  _exports.IndexBarSideBar = IndexBarSideBar;
+  _react = _interopRequireWildcard(_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 IndexBarSideBar(props) {
+    var _cls;
+
+    var indexes = props.indexes,
+        prefixCls = props.prefixCls,
+        onTouching = props.onTouching,
+        onClick = props.onClick,
+        activeIndex = props.activeIndex,
+        tipType = props.tipType,
+        renderSideBar = props.renderSideBar,
+        _props$renderSideBarI = props.renderSideBarItem,
+        renderSideBarItem = _props$renderSideBarI === void 0 ? function (index) {
+      return index;
+    } : _props$renderSideBarI,
+        propsRenderTip = props.renderTip;
+
+    var _useState = (0, _react.useState)(false),
+        isTouching = _useState[0],
+        originSetIsTouching = _useState[1];
+
+    var setIsTouching = function setIsTouching(touching) {
+      originSetIsTouching(touching);
+      onTouching(touching);
+    };
+
+    var handleTouchingStart = function handleTouchingStart() {
+      return setIsTouching(true);
+    };
+
+    var handleTouchingStop = function handleTouchingStop() {
+      return setIsTouching(false);
+    };
+
+    var handleTouchMove = function handleTouchMove(e) {
+      var _e$touches, _target$dataset;
+
+      if (!isTouching || !((_e$touches = e.touches) != null && _e$touches.length)) {
+        return;
+      }
+
+      var _e$touches$ = e.touches[0],
+          clientX = _e$touches$.clientX,
+          clientY = _e$touches$.clientY;
+      var target = document.elementFromPoint(clientX, clientY);
+
+      if (target && (_target$dataset = target.dataset) != null && _target$dataset.index) {
+        onClick(target.dataset.index);
+      }
+    };
+
+    var renderSideBarTip = function renderSideBarTip(index, type) {
+      if (propsRenderTip) {
+        return propsRenderTip(index);
+      }
+
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: prefixCls + "-index-bar-sidebar-" + type
+      }, index);
+    };
+
+    var node = /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _mobileUtils.cls)(prefixCls + "-index-bar-sidebar", (_cls = {}, _cls[prefixCls + "-index-bar-sidebar-touching"] = isTouching, _cls)),
+      onTouchStart: function onTouchStart() {
+        return handleTouchingStart();
+      },
+      onTouchEnd: function onTouchEnd() {
+        return handleTouchingStop();
+      },
+      onTouchCancel: function onTouchCancel() {
+        return handleTouchingStop();
+      },
+      onTouchMove: handleTouchMove
+    }, tipType === 'toast' && isTouching && activeIndex && renderSideBarTip(activeIndex, 'toast'), indexes.map(function (index) {
+      var _cls2;
+
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: (0, _mobileUtils.cls)(prefixCls + "-index-bar-sidebar-item", (_cls2 = {}, _cls2[prefixCls + "-index-bar-sidebar-active"] = activeIndex === index, _cls2)),
+        key: index,
+        onTouchStart: function onTouchStart() {
+          return onClick(index);
+        },
+        "data-index": index
+      }, tipType === 'sweat' && isTouching && activeIndex === index && renderSideBarTip(index, 'sweat'), /*#__PURE__*/_react.default.createElement("div", {
+        className: prefixCls + "-index-bar-sidebar-item-wrapper"
+      }, renderSideBarItem(index)));
+    }));
+
+    return renderSideBar ? renderSideBar(node) : node;
+  }
+});