@arco-design/mobile-react 2.30.5 → 2.30.6

package/esm/date-picker/index.js

@@ -71,10 +71,8 @@ var DatePicker = /*#__PURE__*/forwardRef(function (props, ref) {
   });
 
   function _getColumns() {
-    var dateObj = {};
-    allTypes.forEach(function (type) {
-      dateObj[type] = _getActualArray(type, currentDateObjRef.current);
-    });
+    var dateObj = _getActualArray();
+
     var columns = keyOptions.map(function (opt) {
       return dateObj[opt];
     });
@@ -118,32 +116,52 @@ var DatePicker = /*#__PURE__*/forwardRef(function (props, ref) {
   // @en Dynamically change the options of other columns based on the currently selected date
 
 
-  function _getActualArray(type, nowDateObj) {
-    var normalRange = _getNormalRange(type, nowDateObj);
-
-    var range = [];
+  function _getActualArray() {
+    var dateObj = {}; // 当前时间对象
+    // @en current Date object
 
-    switch (type) {
-      case 'year':
-        range = [minDateObjRef.current.year, maxDateObjRef.current.year];
-        break;
-
-      default:
-        {
-          var checkKeys = allTypes.slice(0, allTypes.indexOf(type));
-          range = normalRange;
+    var currentDateObj = _extends({}, currentDateObjRef.current);
 
-          if (judgeObj(nowDateObj, minDateObjRef.current, checkKeys)) {
-            range[0] = minDateObjRef.current[type];
-          }
-
-          if (judgeObj(nowDateObj, maxDateObjRef.current, checkKeys)) {
-            range[range.length - 1] = maxDateObjRef.current[type];
+    allTypes.forEach(function (type) {
+      // 根据日期类型，计算出默认的日期范围
+      // @en According to the date type, calculate the default date range.
+      var normalRange = _getNormalRange(type, currentDateObj);
+
+      var range = [];
+
+      switch (type) {
+        case 'year':
+          // 默认使用minTs和maxTs年份区间
+          // @en Default use minTs and maxTs years.
+          range = [minDateObjRef.current.year, maxDateObjRef.current.year];
+          break;
+
+        default:
+          {
+            // 除了年份外，其他日期类型都需要判断上一级日期是否相同
+            // @en In addition to the year, other date types need to check if the upper-level date is the same.
+            var checkKeys = allTypes.slice(0, allTypes.indexOf(type));
+            range = normalRange;
+
+            if (judgeObj(currentDateObj, minDateObjRef.current, checkKeys)) {
+              var _extends2;
+
+              range[0] = minDateObjRef.current[type];
+              currentDateObj = _extends({}, currentDateObj, (_extends2 = {}, _extends2[type] = Math.max(minDateObjRef.current[type], currentDateObj[type]), _extends2));
+            }
+
+            if (judgeObj(currentDateObj, maxDateObjRef.current, checkKeys)) {
+              var _extends3;
+
+              range[range.length - 1] = maxDateObjRef.current[type];
+              currentDateObj = _extends({}, currentDateObj, (_extends3 = {}, _extends3[type] = Math.min(maxDateObjRef.current[type], currentDateObj[type]), _extends3));
+            }
           }
-        }
-    }
+      }
 
-    return _convertRangeToArr(type, range);
+      dateObj[type] = _convertRangeToArr(type, range);
+    });
+    return dateObj;
   }
 
   function _convertRangeToArr(type, range) {

package/esm/dropdown-menu/helper.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import React from 'react';
 import { OptionsItem } from '../dropdown';
 import { CascadeOptions, ValueType } from './type';
 /**
@@ -11,11 +11,6 @@ export declare function isStringArray(options: string[] | OptionsItem[][] | Casc
  * @en Determine if it is a nested array
  * */
 export declare function isCascadeArray(options: string[] | OptionsItem[][] | CascadeOptions[]): options is CascadeOptions[];
-/**
- * 判断是否为string类型
- * @en Determine whether it is of type string
- */
-export declare function isString(icon: string | ReactNode): icon is string;
 /**
  * 格式化传入的数组
  * @en format the input array

package/esm/dropdown-menu/helper.js

@@ -16,14 +16,6 @@ export function isStringArray(options) {
 export function isCascadeArray(options) {
   return typeof options[0] === 'object' && !isArray(options[0]);
 }
-/**
- * 判断是否为string类型
- * @en Determine whether it is of type string
- */
-
-export function isString(icon) {
-  return typeof icon === 'string';
-}
 /**
  * 格式化传入的数组
  * @en format the input array

package/esm/ellipsis/components/js-ellipsis.js

@@ -36,6 +36,13 @@ var JsEllipsis = /*#__PURE__*/forwardRef(function (props, ref) {
     }
   }
 
+  function getActualHeight(container) {
+    var _container$getBoundin = container.getBoundingClientRect(),
+        height = _container$getBoundin.height;
+
+    return Math.round(height);
+  }
+
   function truncateText(container, textContainer, max) {
     var content = textContainer.textContent || '';
     var currentText = '';
@@ -51,11 +58,9 @@ var JsEllipsis = /*#__PURE__*/forwardRef(function (props, ref) {
 
       var temp = content.slice(l, m);
       textContainer.innerText = currentText + temp;
+      var actualHeight = getActualHeight(container);
 
-      var _container$getBoundin = container.getBoundingClientRect(),
-          height = _container$getBoundin.height;
-
-      if (height > max) {
+      if (actualHeight > max) {
         r = m;
       } else {
         currentText += temp;
@@ -76,6 +81,7 @@ var JsEllipsis = /*#__PURE__*/forwardRef(function (props, ref) {
   function truncateHTML(container, textContainer, max) {
     // only enter this function when container overflow.
     var children = textContainer.childNodes;
+    var actualHeight = getActualHeight(container);
 
     if (children.length === 1) {
       var node = children[0];
@@ -87,10 +93,7 @@ var JsEllipsis = /*#__PURE__*/forwardRef(function (props, ref) {
 
         node.innerHTML = '';
 
-        var _container$getBoundin2 = container.getBoundingClientRect(),
-            height = _container$getBoundin2.height;
-
-        if (height > max) {
+        if (actualHeight > max) {
           // return after remove the node, if overflow with empty node.
           textContainer.removeChild(node);
           handleOnReflow(true, textContainer.innerHTML);
@@ -109,10 +112,7 @@ var JsEllipsis = /*#__PURE__*/forwardRef(function (props, ref) {
       while (i < nodes.length) {
         textContainer.appendChild(nodes[i]);
 
-        var _container$getBoundin3 = container.getBoundingClientRect(),
-            _height = _container$getBoundin3.height;
-
-        if (_height > max) {
+        if (actualHeight > max) {
           if (nodes[i].childNodes && nodes[i].childNodes.length) {
             break;
           } else {
@@ -152,13 +152,10 @@ var JsEllipsis = /*#__PURE__*/forwardRef(function (props, ref) {
     }
 
     textRef.current.classList.remove(prefixCls + "-js-content-text-pre");
-
-    var _domRef$current$getBo = domRef.current.getBoundingClientRect(),
-        height = _domRef$current$getBo.height;
-
+    var actualHeight = getActualHeight(domRef.current);
     var max = isNaN(Number(maxHeight)) ? lineHeightRef.current * maxLine : Number(maxHeight);
 
-    if (height <= max) {
+    if (actualHeight <= max) {
       handleOnReflow(false, text);
       return;
     }

package/esm/radio/style/css/index.css

@@ -502,6 +502,9 @@
   -webkit-align-items: center;
           align-items: center;
 }
+.arco-radio:focus {
+  outline: none;
+}
 .arco-radio .radio-icon {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;

package/esm/radio/style/index.less

@@ -4,6 +4,11 @@
     display: inline-flex;
     align-items: center;
 
+    // iOS low-end machine style compatibility issues
+    &:focus {
+        outline: none;
+    }
+
     .radio-icon {
         display: inline-flex;
         align-items: center;

package/esm/show-monitor/index.d.ts

@@ -97,6 +97,11 @@ export interface ShowMonitorRef {
      * @en Ignore the state of the element before and after, manually check whether the element is in the viewport, trigger the onVisibleChange callback function
      */
     checkVisible: () => boolean;
+    /**
+     * 重置元素初始可见态为false，并重新对元素可见度发起检测，优先级低于disabled（通常用在对ShowMonitor内部元素变化时发起的重新监听）
+     * @en Reset the initial visible state of the element to false, and re-detect the visibility of the element, the priority is lower than 'disabled'(Usually used to re-listen when elements inside ShowMonitor change)
+     */
+    flushVisibleStatus: () => void;
 }
 /**
  * 通过滚动事件监测 children 是否进入视口或离开视口。

package/esm/show-monitor/index.js

@@ -187,6 +187,7 @@ var ShowMonitor = /*#__PURE__*/forwardRef(function (props, ref) {
 
 
     curVisible !== preVisible && handleCheckChildrenExist() && onCompVisibleChange(curVisible, node);
+    component.isVisible = curVisible;
     var key = wrapperKey.current;
     /**
      * 监听一次后加入 pendingList 队列，随后被 listeners 过滤掉

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@arco-design/mobile-react",
-    "version": "2.30.5",
+    "version": "2.30.6",
     "description": "",
     "main": "cjs/index.js",
     "module": "esm/index.js",
@@ -15,7 +15,7 @@
     "author": "taoyiyue@bytedance.com",
     "license": "ISC",
     "dependencies": {
-        "@arco-design/mobile-utils": "2.17.5",
+        "@arco-design/mobile-utils": "2.17.6",
         "@arco-design/transformable": "^1.0.0",
         "lodash.throttle": "^4.1.1",
         "resize-observer-polyfill": "^1.5.1"
@@ -49,5 +49,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "ea9576d1c323fc6117d9437452d35a460d8ddf08"
+    "gitHead": "a6778485284e4fe9c39e79695d3665371fc2c9c8"
 }

package/umd/checkbox/style/css/index.css

@@ -502,6 +502,9 @@
   -webkit-align-items: center;
           align-items: center;
 }
+.arco-checkbox:focus {
+  outline: none;
+}
 .arco-checkbox .checkbox-icon {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;

package/umd/checkbox/style/index.less

@@ -4,6 +4,11 @@
     display: inline-flex;
     align-items: center;
 
+    // iOS low-end machine style compatibility issues
+    &:focus {
+        outline: none;
+    }
+
     .checkbox-icon {
         display: inline-flex;
         align-items: center;

package/umd/date-picker/index.js

@@ -10,7 +10,7 @@
     factory(mod.exports, global._extends, global.objectWithoutPropertiesLoose, global.react, global.mobileUtils, global.picker, global.contextProvider, global.helper, global.type);
     global.index = mod.exports;
   }
-})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _extends2, _objectWithoutPropertiesLoose2, _react, _mobileUtils, _picker, _contextProvider, _helper, _type) {
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _extends4, _objectWithoutPropertiesLoose2, _react, _mobileUtils, _picker, _contextProvider, _helper, _type) {
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -20,7 +20,7 @@
     YEAR: true
   };
   _exports.default = _exports.YEAR = void 0;
-  _extends2 = _interopRequireDefault(_extends2);
+  _extends4 = _interopRequireDefault(_extends4);
   _objectWithoutPropertiesLoose2 = _interopRequireDefault(_objectWithoutPropertiesLoose2);
   _react = _interopRequireWildcard(_react);
   _picker = _interopRequireDefault(_picker);
@@ -100,10 +100,8 @@
     });
 
     function _getColumns() {
-      var dateObj = {};
-      allTypes.forEach(function (type) {
-        dateObj[type] = _getActualArray(type, currentDateObjRef.current);
-      });
+      var dateObj = _getActualArray();
+
       var columns = keyOptions.map(function (opt) {
         return dateObj[opt];
       });
@@ -147,32 +145,51 @@
     // @en Dynamically change the options of other columns based on the currently selected date
 
 
-    function _getActualArray(type, nowDateObj) {
-      var normalRange = _getNormalRange(type, nowDateObj);
-
-      var range = [];
-
-      switch (type) {
-        case 'year':
-          range = [minDateObjRef.current.year, maxDateObjRef.current.year];
-          break;
-
-        default:
-          {
-            var checkKeys = allTypes.slice(0, allTypes.indexOf(type));
-            range = normalRange;
-
-            if ((0, _helper.judgeObj)(nowDateObj, minDateObjRef.current, checkKeys)) {
-              range[0] = minDateObjRef.current[type];
-            }
+    function _getActualArray() {
+      var dateObj = {}; // 当前时间对象
+      // @en current Date object
 
-            if ((0, _helper.judgeObj)(nowDateObj, maxDateObjRef.current, checkKeys)) {
-              range[range.length - 1] = maxDateObjRef.current[type];
+      var currentDateObj = (0, _extends4.default)({}, currentDateObjRef.current);
+      allTypes.forEach(function (type) {
+        // 根据日期类型，计算出默认的日期范围
+        // @en According to the date type, calculate the default date range.
+        var normalRange = _getNormalRange(type, currentDateObj);
+
+        var range = [];
+
+        switch (type) {
+          case 'year':
+            // 默认使用minTs和maxTs年份区间
+            // @en Default use minTs and maxTs years.
+            range = [minDateObjRef.current.year, maxDateObjRef.current.year];
+            break;
+
+          default:
+            {
+              // 除了年份外，其他日期类型都需要判断上一级日期是否相同
+              // @en In addition to the year, other date types need to check if the upper-level date is the same.
+              var checkKeys = allTypes.slice(0, allTypes.indexOf(type));
+              range = normalRange;
+
+              if ((0, _helper.judgeObj)(currentDateObj, minDateObjRef.current, checkKeys)) {
+                var _extends2;
+
+                range[0] = minDateObjRef.current[type];
+                currentDateObj = (0, _extends4.default)({}, currentDateObj, (_extends2 = {}, _extends2[type] = Math.max(minDateObjRef.current[type], currentDateObj[type]), _extends2));
+              }
+
+              if ((0, _helper.judgeObj)(currentDateObj, maxDateObjRef.current, checkKeys)) {
+                var _extends3;
+
+                range[range.length - 1] = maxDateObjRef.current[type];
+                currentDateObj = (0, _extends4.default)({}, currentDateObj, (_extends3 = {}, _extends3[type] = Math.min(maxDateObjRef.current[type], currentDateObj[type]), _extends3));
+              }
             }
-          }
-      }
+        }
 
-      return _convertRangeToArr(type, range);
+        dateObj[type] = _convertRangeToArr(type, range);
+      });
+      return dateObj;
     }
 
     function _convertRangeToArr(type, range) {
@@ -320,7 +337,7 @@
     }, [visible]);
     return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, function (_ref) {
       var prefixCls = _ref.prefixCls;
-      return /*#__PURE__*/_react.default.createElement(_picker.default, (0, _extends2.default)({}, otherProps, {
+      return /*#__PURE__*/_react.default.createElement(_picker.default, (0, _extends4.default)({}, otherProps, {
         ref: pickerRef,
         visible: visible,
         className: (0, _mobileUtils.cls)(className, prefixCls + "-date-picker"),

package/umd/dropdown-menu/helper.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import React from 'react';
 import { OptionsItem } from '../dropdown';
 import { CascadeOptions, ValueType } from './type';
 /**
@@ -11,11 +11,6 @@ export declare function isStringArray(options: string[] | OptionsItem[][] | Casc
  * @en Determine if it is a nested array
  * */
 export declare function isCascadeArray(options: string[] | OptionsItem[][] | CascadeOptions[]): options is CascadeOptions[];
-/**
- * 判断是否为string类型
- * @en Determine whether it is of type string
- */
-export declare function isString(icon: string | ReactNode): icon is string;
 /**
  * 格式化传入的数组
  * @en format the input array

package/umd/dropdown-menu/helper.js

@@ -19,7 +19,6 @@
   _exports.getFormattedOptions = void 0;
   _exports.isCascadeArray = isCascadeArray;
   _exports.isRefDom = _exports.isClassNameDom = void 0;
-  _exports.isString = isString;
   _exports.isStringArray = isStringArray;
   _extends2 = _interopRequireDefault(_extends2);
 
@@ -39,15 +38,6 @@
   function isCascadeArray(options) {
     return typeof options[0] === 'object' && !(0, _mobileUtils.isArray)(options[0]);
   }
-  /**
-   * 判断是否为string类型
-   * @en Determine whether it is of type string
-   */
-
-
-  function isString(icon) {
-    return typeof icon === 'string';
-  }
   /**
    * 格式化传入的数组
    * @en format the input array

package/umd/ellipsis/components/js-ellipsis.js

@@ -59,6 +59,13 @@
       }
     }
 
+    function getActualHeight(container) {
+      var _container$getBoundin = container.getBoundingClientRect(),
+          height = _container$getBoundin.height;
+
+      return Math.round(height);
+    }
+
     function truncateText(container, textContainer, max) {
       var content = textContainer.textContent || '';
       var currentText = '';
@@ -74,11 +81,9 @@
 
         var temp = content.slice(l, m);
         textContainer.innerText = currentText + temp;
+        var actualHeight = getActualHeight(container);
 
-        var _container$getBoundin = container.getBoundingClientRect(),
-            height = _container$getBoundin.height;
-
-        if (height > max) {
+        if (actualHeight > max) {
           r = m;
         } else {
           currentText += temp;
@@ -99,6 +104,7 @@
     function truncateHTML(container, textContainer, max) {
       // only enter this function when container overflow.
       var children = textContainer.childNodes;
+      var actualHeight = getActualHeight(container);
 
       if (children.length === 1) {
         var node = children[0];
@@ -110,10 +116,7 @@
 
           node.innerHTML = '';
 
-          var _container$getBoundin2 = container.getBoundingClientRect(),
-              height = _container$getBoundin2.height;
-
-          if (height > max) {
+          if (actualHeight > max) {
             // return after remove the node, if overflow with empty node.
             textContainer.removeChild(node);
             handleOnReflow(true, textContainer.innerHTML);
@@ -132,10 +135,7 @@
         while (i < nodes.length) {
           textContainer.appendChild(nodes[i]);
 
-          var _container$getBoundin3 = container.getBoundingClientRect(),
-              _height = _container$getBoundin3.height;
-
-          if (_height > max) {
+          if (actualHeight > max) {
             if (nodes[i].childNodes && nodes[i].childNodes.length) {
               break;
             } else {
@@ -175,13 +175,10 @@
       }
 
       textRef.current.classList.remove(prefixCls + "-js-content-text-pre");
-
-      var _domRef$current$getBo = domRef.current.getBoundingClientRect(),
-          height = _domRef$current$getBo.height;
-
+      var actualHeight = getActualHeight(domRef.current);
       var max = isNaN(Number(maxHeight)) ? lineHeightRef.current * maxLine : Number(maxHeight);
 
-      if (height <= max) {
+      if (actualHeight <= max) {
         handleOnReflow(false, text);
         return;
       }

package/umd/radio/style/css/index.css

@@ -502,6 +502,9 @@
   -webkit-align-items: center;
           align-items: center;
 }
+.arco-radio:focus {
+  outline: none;
+}
 .arco-radio .radio-icon {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;

package/umd/radio/style/index.less

@@ -4,6 +4,11 @@
     display: inline-flex;
     align-items: center;
 
+    // iOS low-end machine style compatibility issues
+    &:focus {
+        outline: none;
+    }
+
     .radio-icon {
         display: inline-flex;
         align-items: center;

package/umd/show-monitor/index.d.ts

@@ -97,6 +97,11 @@ export interface ShowMonitorRef {
      * @en Ignore the state of the element before and after, manually check whether the element is in the viewport, trigger the onVisibleChange callback function
      */
     checkVisible: () => boolean;
+    /**
+     * 重置元素初始可见态为false，并重新对元素可见度发起检测，优先级低于disabled（通常用在对ShowMonitor内部元素变化时发起的重新监听）
+     * @en Reset the initial visible state of the element to false, and re-detect the visibility of the element, the priority is lower than 'disabled'(Usually used to re-listen when elements inside ShowMonitor change)
+     */
+    flushVisibleStatus: () => void;
 }
 /**
  * 通过滚动事件监测 children 是否进入视口或离开视口。

package/umd/show-monitor/index.js

@@ -209,6 +209,7 @@
 
 
       curVisible !== preVisible && handleCheckChildrenExist() && onCompVisibleChange(curVisible, node);
+      component.isVisible = curVisible;
       var key = wrapperKey.current;
       /**
        * 监听一次后加入 pendingList 队列，随后被 listeners 过滤掉