@arco-design/mobile-react 2.25.3 → 2.26.0

package/cjs/input/hooks.js

@@ -1,54 +1,67 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 exports.__esModule = true;
 exports.useInputLogic = useInputLogic;
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _mobileUtils = require("@arco-design/mobile-utils");
+
 var _IconClear = _interopRequireDefault(require("../icon/IconClear"));
+
 var _helpers = require("../_helpers");
+
 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 useInputLogic(props, inputRef) {
   var value = props.value,
-    defaultValue = props.defaultValue,
-    validator = props.validator,
-    onChange = props.onChange,
-    onInput = props.onInput,
-    className = props.className,
-    style = props.style,
-    label = props.label,
-    required = props.required,
-    prepend = props.prepend,
-    append = props.append,
-    blurBeforeFocus = props.blurBeforeFocus,
-    onKeyDown = props.onKeyDown,
-    onPressEnter = props.onPressEnter,
-    onFocus = props.onFocus,
-    onBlur = props.onBlur,
-    onClick = props.onClick,
-    disabled = props.disabled,
-    _props$border = props.border,
-    border = _props$border === void 0 ? 'half' : _props$border,
-    prefix = props.prefix,
-    suffix = props.suffix,
-    clearable = props.clearable,
-    _props$clearShowType = props.clearShowType,
-    clearShowType = _props$clearShowType === void 0 ? 'focus' : _props$clearShowType,
-    _props$clearIcon = props.clearIcon,
-    clearIcon = _props$clearIcon === void 0 ? /*#__PURE__*/_react.default.createElement(_IconClear.default, null) : _props$clearIcon,
-    _props$preventEventWh = props.preventEventWhenClearing,
-    preventEventWhenClearing = _props$preventEventWh === void 0 ? true : _props$preventEventWh,
-    onClear = props.onClear,
-    autoFocus = props.autoFocus;
+      defaultValue = props.defaultValue,
+      validator = props.validator,
+      onChange = props.onChange,
+      onInput = props.onInput,
+      className = props.className,
+      style = props.style,
+      label = props.label,
+      required = props.required,
+      prepend = props.prepend,
+      append = props.append,
+      blurBeforeFocus = props.blurBeforeFocus,
+      onKeyDown = props.onKeyDown,
+      onPressEnter = props.onPressEnter,
+      onFocus = props.onFocus,
+      onBlur = props.onBlur,
+      onClick = props.onClick,
+      disabled = props.disabled,
+      _props$border = props.border,
+      border = _props$border === void 0 ? 'half' : _props$border,
+      prefix = props.prefix,
+      suffix = props.suffix,
+      clearable = props.clearable,
+      _props$clearShowType = props.clearShowType,
+      clearShowType = _props$clearShowType === void 0 ? 'focus' : _props$clearShowType,
+      _props$clearIcon = props.clearIcon,
+      clearIcon = _props$clearIcon === void 0 ? /*#__PURE__*/_react.default.createElement(_IconClear.default, null) : _props$clearIcon,
+      _props$preventEventWh = props.preventEventWhenClearing,
+      preventEventWhenClearing = _props$preventEventWh === void 0 ? true : _props$preventEventWh,
+      onClear = props.onClear,
+      autoFocus = props.autoFocus,
+      blockChangeWhenCompositing = props.blockChangeWhenCompositing;
+
   var _useState = (0, _react.useState)(value || defaultValue || ''),
-    inputValue = _useState[0],
-    setInputValue = _useState[1];
+      inputValue = _useState[0],
+      setInputValue = _useState[1];
+
   var _useState2 = (0, _react.useState)(function () {
-      return clearShowType === 'always' || clearShowType === 'value' && Boolean(value || defaultValue);
-    }),
-    showClear = _useState2[0],
-    toggleClear = _useState2[1];
+    return clearShowType === 'always' || clearShowType === 'value' && Boolean(value || defaultValue);
+  }),
+      showClear = _useState2[0],
+      toggleClear = _useState2[1];
+
+  var compositingRef = (0, _react.useRef)(false);
   /**
    * clear相关问题背景
    * 如果点击clear按钮之前已经是focusing状态了，那么在点完clear按钮之后会手动聚焦一下
@@ -66,13 +79,16 @@ function useInputLogic(props, inputRef) {
    * 如果这个标志为true，则跳过调用外部的onBlur和onFocus，并在最后再将标志置回false
    *
    */
+
   var _useState3 = (0, _react.useState)(false),
-    isFocusing = _useState3[0],
-    setIsFocusing = _useState3[1];
+      isFocusing = _useState3[0],
+      setIsFocusing = _useState3[1];
+
   var shouldPreventEvent = (0, _react.useRef)(false);
   var actualInputValue = value !== void 0 ? value : inputValue;
   var system = (0, _helpers.useSystem)();
   var wrapRef = (0, _react.useRef)(null);
+  var needComposition = system === 'ios' && blockChangeWhenCompositing;
   (0, _react.useEffect)(function () {
     if (autoFocus) {
       setTimeout(function () {
@@ -80,6 +96,28 @@ function useInputLogic(props, inputRef) {
       }, 200);
     }
   }, []);
+  (0, _react.useEffect)(function () {
+    var handleCompositionStart = function handleCompositionStart() {
+      compositingRef.current = true;
+    };
+
+    var handleCompositionEnd = function handleCompositionEnd(e) {
+      compositingRef.current = false;
+      handleChange(e);
+    };
+
+    if (inputRef.current && needComposition) {
+      inputRef.current.addEventListener('compositionstart', handleCompositionStart);
+      inputRef.current.addEventListener('compositionend', handleCompositionEnd);
+    }
+
+    return function () {
+      if (inputRef.current && needComposition) {
+        inputRef.current.removeEventListener('compositionstart', handleCompositionStart);
+        inputRef.current.removeEventListener('compositionend', handleCompositionEnd);
+      }
+    };
+  }, [needComposition]);
   (0, _react.useEffect)(function () {
     // 处理受控模式下的showClear
     // @en Handling showClear in controlled mode
@@ -87,10 +125,12 @@ function useInputLogic(props, inputRef) {
       toggleClear(Boolean(value));
     }
   }, [value]);
+
   function changeValue(nowValue, callback) {
     if (callback === void 0) {
       callback = function callback() {};
     }
+
     if (nowValue && validator) {
       if (typeof validator === 'function') {
         if (!validator(nowValue)) {
@@ -99,54 +139,69 @@ function useInputLogic(props, inputRef) {
       } else if (!validator.test(nowValue)) {
         return;
       }
-    }
-    // 处理非受控模式下的showClear
+    } // 处理非受控模式下的showClear
     // @en Handling showClear in uncontrolled mode
+
+
     if (clearShowType === 'value' && value === void 0) {
       toggleClear(Boolean(nowValue));
     }
+
     setInputValue(nowValue);
     callback();
   }
+
   function handleChange(e) {
+    if (needComposition && compositingRef.current) {
+      return;
+    }
+
     var newValue = e.target.value;
     changeValue(newValue, function () {
       onChange && onChange(e, newValue);
     });
   }
+
   function handleInput(e) {
     var newValue = e.target.value;
     changeValue(newValue, function () {
       onInput && onInput(e, newValue);
     });
   }
+
   function handleKeyDown(e) {
     if (e.keyCode === 13) {
       onPressEnter && onPressEnter(e);
     }
+
     onKeyDown && onKeyDown(e);
   }
+
   function handleFocus(e) {
     (0, _mobileUtils.nextTick)(function () {
       if (preventEventWhenClearing && shouldPreventEvent.current) {
         shouldPreventEvent.current = false;
         return;
       }
+
       setIsFocusing(true);
       clearShowType === 'focus' && toggleClear(true);
       onFocus && onFocus(e);
     });
   }
+
   function handleBlur(e) {
     (0, _mobileUtils.nextTick)(function () {
       if (preventEventWhenClearing && shouldPreventEvent.current) {
         return;
       }
+
       setIsFocusing(false);
       clearShowType === 'focus' && toggleClear(false);
       onBlur && onBlur(e);
     });
   }
+
   function handleClick(e) {
     // 安卓才会有键盘切换不过来的问题，ios不开启此项，因为blur之后不能再自动focus
     // @en Android will have the problem that the keyboard cannot be switched. iOS does not enable this, because it can no longer automatically focus after blur.
@@ -158,29 +213,35 @@ function useInputLogic(props, inputRef) {
     } else {
       inputRef.current && inputRef.current.focus();
     }
+
     onClick && onClick(e);
   }
+
   function handleClear(e) {
     // 不展示清除按钮时不触发事件
     // @en No event fired when clear button is not displayed
     if (!clearable || !showClear) {
       return;
     }
+
     changeValue('', function () {
-      onClear && onClear(e);
-      // 当点击clear前是focus时强制执行focus
+      onClear && onClear(e); // 当点击clear前是focus时强制执行focus
       // @en Enforce focus when focus is before clicking clear
+
       if (isFocusing) {
         if (preventEventWhenClearing) {
           shouldPreventEvent.current = true;
         }
+
         inputRef.current && inputRef.current.focus();
       }
     });
   }
+
   function renderPendNode(pend) {
     return typeof pend === 'function' ? pend(isFocusing, actualInputValue) : pend;
   }
+
   function renderWrapper(prefixCls, type, children) {
     return /*#__PURE__*/_react.default.createElement("div", {
       role: "search",
@@ -208,6 +269,7 @@ function useInputLogic(props, inputRef) {
       className: prefixCls + "-suffix"
     }, suffix) : null), renderPendNode(append));
   }
+
   return {
     inputValue: actualInputValue,
     handleChange: handleChange,

package/cjs/input/index.js

@@ -1,50 +1,62 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 exports.__esModule = true;
 exports.default = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _mobileUtils = require("@arco-design/mobile-utils");
+
 var _contextProvider = require("../context-provider");
+
 var _hooks = require("./hooks");
+
 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 Input = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var id = props.id,
-    name = props.name,
-    maxLength = props.maxLength,
-    placeholder = props.placeholder,
-    readOnly = props.readOnly,
-    onKeyUp = props.onKeyUp,
-    onKeyPress = props.onKeyPress,
-    _props$type = props.type,
-    type = _props$type === void 0 ? 'text' : _props$type,
-    disabled = props.disabled,
-    pattern = props.pattern,
-    inputClass = props.inputClass,
-    inputStyle = props.inputStyle,
-    _props$nativeProps = props.nativeProps,
-    nativeProps = _props$nativeProps === void 0 ? {} : _props$nativeProps,
-    _props$ariaLabel = props.ariaLabel,
-    ariaLabel = _props$ariaLabel === void 0 ? '' : _props$ariaLabel;
+      name = props.name,
+      maxLength = props.maxLength,
+      placeholder = props.placeholder,
+      readOnly = props.readOnly,
+      onKeyUp = props.onKeyUp,
+      onKeyPress = props.onKeyPress,
+      _props$type = props.type,
+      type = _props$type === void 0 ? 'text' : _props$type,
+      disabled = props.disabled,
+      pattern = props.pattern,
+      inputClass = props.inputClass,
+      inputStyle = props.inputStyle,
+      _props$nativeProps = props.nativeProps,
+      nativeProps = _props$nativeProps === void 0 ? {} : _props$nativeProps,
+      _props$ariaLabel = props.ariaLabel,
+      ariaLabel = _props$ariaLabel === void 0 ? '' : _props$ariaLabel;
   var inputRef = (0, _react.useRef)(null);
+
   var _useInputLogic = (0, _hooks.useInputLogic)(props, inputRef),
-    inputValue = _useInputLogic.inputValue,
-    handleChange = _useInputLogic.handleChange,
-    handleInput = _useInputLogic.handleInput,
-    handleKeyDown = _useInputLogic.handleKeyDown,
-    handleFocus = _useInputLogic.handleFocus,
-    handleBlur = _useInputLogic.handleBlur,
-    handleClick = _useInputLogic.handleClick,
-    renderWrapper = _useInputLogic.renderWrapper,
-    wrapRef = _useInputLogic.wrapRef;
+      inputValue = _useInputLogic.inputValue,
+      handleChange = _useInputLogic.handleChange,
+      handleInput = _useInputLogic.handleInput,
+      handleKeyDown = _useInputLogic.handleKeyDown,
+      handleFocus = _useInputLogic.handleFocus,
+      handleBlur = _useInputLogic.handleBlur,
+      handleClick = _useInputLogic.handleClick,
+      renderWrapper = _useInputLogic.renderWrapper,
+      wrapRef = _useInputLogic.wrapRef;
+
   (0, _react.useImperativeHandle)(ref, function () {
     return {
       dom: wrapRef.current,
       input: inputRef.current
     };
   });
+
   function renderInput(_ref) {
     var prefixCls = _ref.prefixCls;
     var prefix = prefixCls + "-input";
@@ -73,9 +85,9 @@ var Input = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       "aria-label": ariaLabel
     })));
   }
+
   return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, renderInput);
 });
-
 /**
  * 输入框组件，支持添加前后缀。
  * @en The input box, supports adding prefixes and suffixes.
@@ -85,5 +97,7 @@ var Input = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
  * @name_en Input
  * @displayName Input
  */
+
 var _default = (0, _mobileUtils.componentWrapper)(Input, 'Input');
+
 exports.default = _default;

package/cjs/input/props.d.ts

@@ -61,6 +61,12 @@ export interface BasicInputProps<T = HTMLInputElement> {
      * @en Whether to automatically get the focus
      */
     autoFocus?: boolean;
+    /**
+     * 当 ios 输入中文时，输拼音的过程不触发onChange，仅确认选择后触发
+     * @en When inputting Chinese on ios, onChange is not triggered during pinyin input, but only after confirming the selection
+     * @default false
+     */
+    blockChangeWhenCompositing?: boolean;
     /**
      * 输入框左侧文本
      * @en text to the left of the input box

package/cjs/input/style/css/index.css

@@ -118,10 +118,19 @@
 .arco-input-prefix {
   padding-right:  0.48rem ;
 }
+[dir="rtl"] .arco-input-prefix {
+  padding-right: initial;
+  padding-left:  0.48rem ;
+}
 .arco-input-clear,
 .arco-input-suffix {
   padding-left:  0.32rem ;
 }
+[dir="rtl"] .arco-input-clear,
+[dir="rtl"] .arco-input-suffix {
+  padding-left: initial;
+  padding-right:  0.32rem ;
+}
 .arco-input-clear {
   color:  #c9cdd4 ;
   font-size:  16PX ;

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

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

package/cjs/input/style/index.js

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

package/cjs/input/style/index.less

@@ -77,11 +77,11 @@
     display: flex;
 }
 .@{prefix}-input-prefix {
-    .use-var(padding-right, input-label-gutter);
+    .use-var-with-rtl(padding-right, input-label-gutter);
 }
 .@{prefix}-input-clear,
 .@{prefix}-input-suffix {
-    .use-var(padding-left, input-horizontal-padding);
+    .use-var-with-rtl(padding-left, input-horizontal-padding);
 }
 .@{prefix}-input-clear {
     .use-var(color, input-clear-icon-color);

package/cjs/load-more/index.js

@@ -1,15 +1,24 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 exports.__esModule = true;
 exports.default = void 0;
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _lodash = _interopRequireDefault(require("lodash.throttle"));
+
 var _mobileUtils = require("@arco-design/mobile-utils");
+
 var _contextProvider = require("../context-provider");
+
 var _helpers = require("../_helpers");
+
 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; }
+
 /**
  * 上拉加载组件，支持`scroll`和`click`两种触发加载方式，支持滚动监听。支持受控与不受控两种形式。<br>如果引入组件后发现仅触发了初始的`getData`，请确认是否在`getData`方法内没有调用`callback`移除 loading 状态，且未设置`blockWhenLoading`属性为 false。
  * @en Pull-up loading component, supports `scroll` and `click` two trigger loading methods, supports scroll monitoring. Both controlled and uncontrolled forms are supported. <br>If only the initial `getData` is triggered after the component is introduced, please make sure that the `callback` is not called in the `getData` method to remove the loading state, and the `blockWhenLoading` property is not set to false.
@@ -20,36 +29,38 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
  */
 var LoadMore = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var _props$className = props.className,
-    className = _props$className === void 0 ? '' : _props$className,
-    style = props.style,
-    beforeReadyArea = props.beforeReadyArea,
-    loadingArea = props.loadingArea,
-    noMoreArea = props.noMoreArea,
-    prepareArea = props.prepareArea,
-    retryArea = props.retryArea,
-    _props$defaultStatus = props.defaultStatus,
-    defaultStatus = _props$defaultStatus === void 0 ? 'prepare' : _props$defaultStatus,
-    status = props.status,
-    getScrollContainer = props.getScrollContainer,
-    _props$trigger = props.trigger,
-    trigger = _props$trigger === void 0 ? 'scroll' : _props$trigger,
-    _props$threshold = props.threshold,
-    threshold = _props$threshold === void 0 ? 200 : _props$threshold,
-    _props$throttle = props.throttle,
-    throttle = _props$throttle === void 0 ? 0 : _props$throttle,
-    _props$getDataAtFirst = props.getDataAtFirst,
-    getDataAtFirst = _props$getDataAtFirst === void 0 ? true : _props$getDataAtFirst,
-    getData = props.getData,
-    _props$blockWhenLoadi = props.blockWhenLoading,
-    blockWhenLoading = _props$blockWhenLoadi === void 0 ? true : _props$blockWhenLoadi,
-    onStatusChange = props.onStatusChange,
-    onClick = props.onClick,
-    onEndReached = props.onEndReached;
+      className = _props$className === void 0 ? '' : _props$className,
+      style = props.style,
+      beforeReadyArea = props.beforeReadyArea,
+      loadingArea = props.loadingArea,
+      noMoreArea = props.noMoreArea,
+      prepareArea = props.prepareArea,
+      retryArea = props.retryArea,
+      _props$defaultStatus = props.defaultStatus,
+      defaultStatus = _props$defaultStatus === void 0 ? 'prepare' : _props$defaultStatus,
+      status = props.status,
+      getScrollContainer = props.getScrollContainer,
+      _props$trigger = props.trigger,
+      trigger = _props$trigger === void 0 ? 'scroll' : _props$trigger,
+      _props$threshold = props.threshold,
+      threshold = _props$threshold === void 0 ? 200 : _props$threshold,
+      _props$throttle = props.throttle,
+      throttle = _props$throttle === void 0 ? 0 : _props$throttle,
+      _props$getDataAtFirst = props.getDataAtFirst,
+      getDataAtFirst = _props$getDataAtFirst === void 0 ? true : _props$getDataAtFirst,
+      getData = props.getData,
+      _props$blockWhenLoadi = props.blockWhenLoading,
+      blockWhenLoading = _props$blockWhenLoadi === void 0 ? true : _props$blockWhenLoadi,
+      onStatusChange = props.onStatusChange,
+      onClick = props.onClick,
+      onEndReached = props.onEndReached;
   var domRef = (0, _react.useRef)(null);
   var requestAtFirst = trigger === 'scroll' ? getDataAtFirst : false;
+
   var _useState = (0, _react.useState)(defaultStatus),
-    innerStatus = _useState[0],
-    setInnerStatus = _useState[1];
+      innerStatus = _useState[0],
+      setInnerStatus = _useState[1];
+
   var lastScrollEndRef = (0, _react.useRef)(false);
   var nowStatus = status || innerStatus;
   var statusRef = (0, _react.useRef)(nowStatus);
@@ -61,6 +72,7 @@ var LoadMore = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     if (blockWhenLoading && statusRef.current === 'loading') {
       return;
     }
+
     changeStatus('loading', scene);
     getData == null ? void 0 : getData(function (st) {
       lastScrollEndRef.current = false;
@@ -86,10 +98,12 @@ var LoadMore = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   }, [trigger]);
   var handleContainerScroll = (0, _react.useCallback)(function () {
     var scrollTop = (0, _mobileUtils.getScrollContainerAttribute)('scrollTop', getScrollContainer);
+
     if (checkNeedTrigger(scrollTop, threshold + 1)) {
       if (!lastScrollEndRef.current) {
         lastScrollEndRef.current = true;
         onEndReached && onEndReached();
+
         if (!['nomore', 'retry', 'before-ready'].includes(statusRef.current)) {
           triggerGetData('scrollEnd');
         }
@@ -101,13 +115,16 @@ var LoadMore = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   (0, _react.useEffect)(function () {
     var binded = null;
     var scrollFunc = throttle ? (0, _lodash.default)(handleContainerScroll, throttle) : handleContainerScroll;
+
     if (trigger === 'scroll') {
       var container = (0, _mobileUtils.getValidScrollContainer)(getScrollContainer);
+
       if (container) {
         container.addEventListener('scroll', scrollFunc);
         binded = container;
       }
     }
+
     return function () {
       if (binded) {
         binded.removeEventListener('scroll', scrollFunc);
@@ -120,45 +137,55 @@ var LoadMore = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       changeStatus: changeStatus
     };
   }, [changeStatus]);
+
   function checkNeedTrigger(top, ths) {
     var scrollHeight = (0, _mobileUtils.getScrollContainerAttribute)('scrollHeight', getScrollContainer);
     var clientHeight = (0, _mobileUtils.getScrollContainerAttribute)('clientHeight', getScrollContainer);
     return scrollHeight - top - clientHeight <= ths;
   }
+
   function handleClick(e) {
     if (trigger === 'click' && statusRef.current === 'prepare' || statusRef.current === 'retry') {
       triggerGetData('click');
     }
+
     onClick && onClick(e);
   }
+
   function renderArea(locale) {
     switch (nowStatus) {
       case 'before-ready':
         return beforeReadyArea;
+
       case 'prepare':
         return prepareArea === void 0 ? /*#__PURE__*/_react.default.createElement("div", {
           className: "load-more-text prepare"
         }, trigger === 'scroll' ? locale.LoadMore.prepareScrollText : locale.LoadMore.prepareClickText, locale.LoadMore.loadMoreText) : prepareArea;
+
       case 'loading':
         return loadingArea === void 0 ? /*#__PURE__*/_react.default.createElement("div", {
           className: "load-more-text loading"
         }, locale.LoadMore.loadingText) : loadingArea;
+
       case 'nomore':
         return noMoreArea === void 0 ? /*#__PURE__*/_react.default.createElement("div", {
           className: "load-more-text nomore"
         }, locale.LoadMore.noDataText) : noMoreArea;
+
       case 'retry':
         return retryArea === void 0 ? /*#__PURE__*/_react.default.createElement("div", {
           className: "load-more-text retry"
         }, locale.LoadMore.failLoadText) : retryArea;
+
       default:
         return null;
     }
   }
+
   return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, function (_ref) {
     var prefixCls = _ref.prefixCls,
-      _ref$locale = _ref.locale,
-      locale = _ref$locale === void 0 ? _mobileUtils.defaultLocale : _ref$locale;
+        _ref$locale = _ref.locale,
+        locale = _ref$locale === void 0 ? _mobileUtils.defaultLocale : _ref$locale;
     return /*#__PURE__*/_react.default.createElement("div", {
       className: prefixCls + "-load-more status-" + nowStatus + " " + className,
       ref: domRef,

package/cjs/load-more/style/css/index.js

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

package/cjs/load-more/style/index.js

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