@arco-design/mobile-react 2.25.4 → 2.26.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.d.ts

@@ -1,20 +1,17 @@
+export { default as Button } from './button';
 export { default as ActionSheet } from './action-sheet';
-export { default as Cell } from './cell';
-export { default as Loading } from './loading';
-export { default as Badge } from './badge';
 export { default as Avatar } from './avatar';
-export { default as Button } from './button';
+export { default as Badge } from './badge';
 export { default as Carousel } from './carousel';
-export { default as Toast } from './toast';
-export { default as Switch } from './switch';
+export { default as Cell } from './cell';
 export { default as Checkbox } from './checkbox';
 export { default as CircleProgress } from './circle-progress';
 export { default as Collapse } from './collapse';
-export { default as Tabs } from './tabs';
 export { default as ContextProvider } from './context-provider';
-export { default as Dialog } from './dialog';
 export { default as CountDown } from './count-down';
 export { default as DatePicker } from './date-picker';
+export { default as Divider } from './divider';
+export { default as Dialog } from './dialog';
 export { default as Dropdown } from './dropdown';
 export { default as DropdownMenu } from './dropdown-menu';
 export { default as Ellipsis } from './ellipsis';
@@ -22,14 +19,15 @@ export { default as Form } from './form';
 export { default as Input } from './input';
 export { default as Textarea } from './textarea';
 export { default as Radio } from './radio';
-export { default as ImagePicker } from './image-picker';
 export { default as Rate } from './rate';
 export { default as Slider } from './slider';
 export { default as Grid } from './grid';
 export { default as Image } from './image';
 export { default as ShowMonitor } from './show-monitor';
+export { default as ImagePicker } from './image-picker';
 export { default as ImagePreview } from './image-preview';
 export { default as LoadMore } from './load-more';
+export { default as Loading } from './loading';
 export { default as Masking } from './masking';
 export { default as NavBar } from './nav-bar';
 export { default as NoticeBar } from './notice-bar';
@@ -49,6 +47,9 @@ export { default as Steps } from './steps';
 export { default as Sticky } from './sticky';
 export { default as SwipeAction } from './swipe-action';
 export { default as SwipeLoad } from './swipe-load';
+export { default as Switch } from './switch';
 export { default as TabBar } from './tab-bar';
+export { default as Tabs } from './tabs';
 export { default as Tag } from './tag';
+export { default as Toast } from './toast';
 export { default as Transition } from './transition';

package/umd/index.js

@@ -1,55 +1,50 @@
 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "./action-sheet", "./cell", "./loading", "./badge", "./avatar", "./button", "./carousel", "./toast", "./switch", "./checkbox", "./circle-progress", "./collapse", "./tabs", "./context-provider", "./dialog", "./count-down", "./date-picker", "./dropdown", "./dropdown-menu", "./ellipsis", "./form", "./input", "./textarea", "./radio", "./image-picker", "./rate", "./slider", "./grid", "./image", "./show-monitor", "./image-preview", "./load-more", "./masking", "./nav-bar", "./notice-bar", "./notify", "./pagination", "./picker", "./picker-view", "./popover", "./popup", "./popup-swiper", "./portal", "./progress", "./pull-refresh", "./search-bar", "./stepper", "./steps", "./sticky", "./swipe-action", "./swipe-load", "./tab-bar", "./tag", "./transition"], factory);
+    define(["exports", "./button", "./action-sheet", "./avatar", "./badge", "./carousel", "./cell", "./checkbox", "./circle-progress", "./collapse", "./context-provider", "./count-down", "./date-picker", "./divider", "./dialog", "./dropdown", "./dropdown-menu", "./ellipsis", "./form", "./input", "./textarea", "./radio", "./rate", "./slider", "./grid", "./image", "./show-monitor", "./image-picker", "./image-preview", "./load-more", "./loading", "./masking", "./nav-bar", "./notice-bar", "./notify", "./pagination", "./picker", "./picker-view", "./popover", "./popup", "./popup-swiper", "./portal", "./progress", "./pull-refresh", "./search-bar", "./stepper", "./steps", "./sticky", "./swipe-action", "./swipe-load", "./switch", "./tab-bar", "./tabs", "./tag", "./toast", "./transition"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("./action-sheet"), require("./cell"), require("./loading"), require("./badge"), require("./avatar"), require("./button"), require("./carousel"), require("./toast"), require("./switch"), require("./checkbox"), require("./circle-progress"), require("./collapse"), require("./tabs"), require("./context-provider"), require("./dialog"), require("./count-down"), require("./date-picker"), require("./dropdown"), require("./dropdown-menu"), require("./ellipsis"), require("./form"), require("./input"), require("./textarea"), require("./radio"), require("./image-picker"), require("./rate"), require("./slider"), require("./grid"), require("./image"), require("./show-monitor"), require("./image-preview"), require("./load-more"), require("./masking"), require("./nav-bar"), require("./notice-bar"), require("./notify"), require("./pagination"), require("./picker"), require("./picker-view"), require("./popover"), require("./popup"), require("./popup-swiper"), require("./portal"), require("./progress"), require("./pull-refresh"), require("./search-bar"), require("./stepper"), require("./steps"), require("./sticky"), require("./swipe-action"), require("./swipe-load"), require("./tab-bar"), require("./tag"), require("./transition"));
+    factory(exports, require("./button"), require("./action-sheet"), require("./avatar"), require("./badge"), require("./carousel"), require("./cell"), require("./checkbox"), require("./circle-progress"), require("./collapse"), require("./context-provider"), require("./count-down"), require("./date-picker"), require("./divider"), require("./dialog"), require("./dropdown"), require("./dropdown-menu"), require("./ellipsis"), require("./form"), require("./input"), require("./textarea"), require("./radio"), require("./rate"), require("./slider"), require("./grid"), require("./image"), require("./show-monitor"), require("./image-picker"), require("./image-preview"), require("./load-more"), require("./loading"), require("./masking"), require("./nav-bar"), require("./notice-bar"), require("./notify"), require("./pagination"), require("./picker"), require("./picker-view"), require("./popover"), require("./popup"), require("./popup-swiper"), require("./portal"), require("./progress"), require("./pull-refresh"), require("./search-bar"), require("./stepper"), require("./steps"), require("./sticky"), require("./swipe-action"), require("./swipe-load"), require("./switch"), require("./tab-bar"), require("./tabs"), require("./tag"), require("./toast"), require("./transition"));
   } else {
     var mod = {
       exports: {}
     };
-    factory(mod.exports, global.actionSheet, global.cell, global.loading, global.badge, global.avatar, global.button, global.carousel, global.toast, global._switch, global.checkbox, global.circleProgress, global.collapse, global.tabs, global.contextProvider, global.dialog, global.countDown, global.datePicker, global.dropdown, global.dropdownMenu, global.ellipsis, global.form, global.input, global.textarea, global.radio, global.imagePicker, global.rate, global.slider, global.grid, global.image, global.showMonitor, global.imagePreview, global.loadMore, global.masking, global.navBar, global.noticeBar, global.notify, global.pagination, global.picker, global.pickerView, global.popover, global.popup, global.popupSwiper, global.portal, global.progress, global.pullRefresh, global.searchBar, global.stepper, global.steps, global.sticky, global.swipeAction, global.swipeLoad, global.tabBar, global.tag, global.transition);
+    factory(mod.exports, global.button, global.actionSheet, global.avatar, global.badge, global.carousel, global.cell, global.checkbox, global.circleProgress, global.collapse, global.contextProvider, global.countDown, global.datePicker, global.divider, global.dialog, global.dropdown, global.dropdownMenu, global.ellipsis, global.form, global.input, global.textarea, global.radio, global.rate, global.slider, global.grid, global.image, global.showMonitor, global.imagePicker, global.imagePreview, global.loadMore, global.loading, global.masking, global.navBar, global.noticeBar, global.notify, global.pagination, global.picker, global.pickerView, global.popover, global.popup, global.popupSwiper, global.portal, global.progress, global.pullRefresh, global.searchBar, global.stepper, global.steps, global.sticky, global.swipeAction, global.swipeLoad, global._switch, global.tabBar, global.tabs, global.tag, global.toast, global.transition);
     global.index = mod.exports;
   }
-})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _actionSheet, _cell, _loading, _badge, _avatar, _button, _carousel, _toast, _switch, _checkbox, _circleProgress, _collapse, _tabs, _contextProvider, _dialog, _countDown, _datePicker, _dropdown, _dropdownMenu, _ellipsis, _form, _input, _textarea, _radio, _imagePicker, _rate, _slider, _grid, _image, _showMonitor, _imagePreview, _loadMore, _masking, _navBar, _noticeBar, _notify, _pagination, _picker, _pickerView, _popover, _popup, _popupSwiper, _portal, _progress, _pullRefresh, _searchBar, _stepper, _steps, _sticky, _swipeAction, _swipeLoad, _tabBar, _tag, _transition) {
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _button, _actionSheet, _avatar, _badge, _carousel, _cell, _checkbox, _circleProgress, _collapse, _contextProvider, _countDown, _datePicker, _divider, _dialog, _dropdown, _dropdownMenu, _ellipsis, _form, _input, _textarea, _radio, _rate, _slider, _grid, _image, _showMonitor, _imagePicker, _imagePreview, _loadMore, _loading, _masking, _navBar, _noticeBar, _notify, _pagination, _picker, _pickerView, _popover, _popup, _popupSwiper, _portal, _progress, _pullRefresh, _searchBar, _stepper, _steps, _sticky, _swipeAction, _swipeLoad, _switch, _tabBar, _tabs, _tag, _toast, _transition) {
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
   _exports.__esModule = true;
-  _exports.Transition = _exports.Toast = _exports.Textarea = _exports.Tag = _exports.Tabs = _exports.TabBar = _exports.Switch = _exports.SwipeLoad = _exports.SwipeAction = _exports.Sticky = _exports.Steps = _exports.Stepper = _exports.Slider = _exports.ShowMonitor = _exports.SearchBar = _exports.Rate = _exports.Radio = _exports.PullRefresh = _exports.Progress = _exports.Portal = _exports.PopupSwiper = _exports.Popup = _exports.Popover = _exports.PickerView = _exports.Picker = _exports.Pagination = _exports.Notify = _exports.NoticeBar = _exports.NavBar = _exports.Masking = _exports.Loading = _exports.LoadMore = _exports.Input = _exports.ImagePreview = _exports.ImagePicker = _exports.Image = _exports.Grid = _exports.Form = _exports.Ellipsis = _exports.DropdownMenu = _exports.Dropdown = _exports.Dialog = _exports.DatePicker = _exports.CountDown = _exports.ContextProvider = _exports.Collapse = _exports.CircleProgress = _exports.Checkbox = _exports.Cell = _exports.Carousel = _exports.Button = _exports.Badge = _exports.Avatar = _exports.ActionSheet = void 0;
+  _exports.Transition = _exports.Toast = _exports.Textarea = _exports.Tag = _exports.Tabs = _exports.TabBar = _exports.Switch = _exports.SwipeLoad = _exports.SwipeAction = _exports.Sticky = _exports.Steps = _exports.Stepper = _exports.Slider = _exports.ShowMonitor = _exports.SearchBar = _exports.Rate = _exports.Radio = _exports.PullRefresh = _exports.Progress = _exports.Portal = _exports.PopupSwiper = _exports.Popup = _exports.Popover = _exports.PickerView = _exports.Picker = _exports.Pagination = _exports.Notify = _exports.NoticeBar = _exports.NavBar = _exports.Masking = _exports.Loading = _exports.LoadMore = _exports.Input = _exports.ImagePreview = _exports.ImagePicker = _exports.Image = _exports.Grid = _exports.Form = _exports.Ellipsis = _exports.DropdownMenu = _exports.Dropdown = _exports.Divider = _exports.Dialog = _exports.DatePicker = _exports.CountDown = _exports.ContextProvider = _exports.Collapse = _exports.CircleProgress = _exports.Checkbox = _exports.Cell = _exports.Carousel = _exports.Button = _exports.Badge = _exports.Avatar = _exports.ActionSheet = void 0;
+  _button = _interopRequireDefault(_button);
+  _exports.Button = _button.default;
   _actionSheet = _interopRequireDefault(_actionSheet);
   _exports.ActionSheet = _actionSheet.default;
-  _cell = _interopRequireDefault(_cell);
-  _exports.Cell = _cell.default;
-  _loading = _interopRequireDefault(_loading);
-  _exports.Loading = _loading.default;
-  _badge = _interopRequireDefault(_badge);
-  _exports.Badge = _badge.default;
   _avatar = _interopRequireDefault(_avatar);
   _exports.Avatar = _avatar.default;
-  _button = _interopRequireDefault(_button);
-  _exports.Button = _button.default;
+  _badge = _interopRequireDefault(_badge);
+  _exports.Badge = _badge.default;
   _carousel = _interopRequireDefault(_carousel);
   _exports.Carousel = _carousel.default;
-  _toast = _interopRequireDefault(_toast);
-  _exports.Toast = _toast.default;
-  _switch = _interopRequireDefault(_switch);
-  _exports.Switch = _switch.default;
+  _cell = _interopRequireDefault(_cell);
+  _exports.Cell = _cell.default;
   _checkbox = _interopRequireDefault(_checkbox);
   _exports.Checkbox = _checkbox.default;
   _circleProgress = _interopRequireDefault(_circleProgress);
   _exports.CircleProgress = _circleProgress.default;
   _collapse = _interopRequireDefault(_collapse);
   _exports.Collapse = _collapse.default;
-  _tabs = _interopRequireDefault(_tabs);
-  _exports.Tabs = _tabs.default;
   _contextProvider = _interopRequireDefault(_contextProvider);
   _exports.ContextProvider = _contextProvider.default;
-  _dialog = _interopRequireDefault(_dialog);
-  _exports.Dialog = _dialog.default;
   _countDown = _interopRequireDefault(_countDown);
   _exports.CountDown = _countDown.default;
   _datePicker = _interopRequireDefault(_datePicker);
   _exports.DatePicker = _datePicker.default;
+  _divider = _interopRequireDefault(_divider);
+  _exports.Divider = _divider.default;
+  _dialog = _interopRequireDefault(_dialog);
+  _exports.Dialog = _dialog.default;
   _dropdown = _interopRequireDefault(_dropdown);
   _exports.Dropdown = _dropdown.default;
   _dropdownMenu = _interopRequireDefault(_dropdownMenu);
@@ -64,8 +59,6 @@
   _exports.Textarea = _textarea.default;
   _radio = _interopRequireDefault(_radio);
   _exports.Radio = _radio.default;
-  _imagePicker = _interopRequireDefault(_imagePicker);
-  _exports.ImagePicker = _imagePicker.default;
   _rate = _interopRequireDefault(_rate);
   _exports.Rate = _rate.default;
   _slider = _interopRequireDefault(_slider);
@@ -76,10 +69,14 @@
   _exports.Image = _image.default;
   _showMonitor = _interopRequireDefault(_showMonitor);
   _exports.ShowMonitor = _showMonitor.default;
+  _imagePicker = _interopRequireDefault(_imagePicker);
+  _exports.ImagePicker = _imagePicker.default;
   _imagePreview = _interopRequireDefault(_imagePreview);
   _exports.ImagePreview = _imagePreview.default;
   _loadMore = _interopRequireDefault(_loadMore);
   _exports.LoadMore = _loadMore.default;
+  _loading = _interopRequireDefault(_loading);
+  _exports.Loading = _loading.default;
   _masking = _interopRequireDefault(_masking);
   _exports.Masking = _masking.default;
   _navBar = _interopRequireDefault(_navBar);
@@ -118,10 +115,16 @@
   _exports.SwipeAction = _swipeAction.default;
   _swipeLoad = _interopRequireDefault(_swipeLoad);
   _exports.SwipeLoad = _swipeLoad.default;
+  _switch = _interopRequireDefault(_switch);
+  _exports.Switch = _switch.default;
   _tabBar = _interopRequireDefault(_tabBar);
   _exports.TabBar = _tabBar.default;
+  _tabs = _interopRequireDefault(_tabs);
+  _exports.Tabs = _tabs.default;
   _tag = _interopRequireDefault(_tag);
   _exports.Tag = _tag.default;
+  _toast = _interopRequireDefault(_toast);
+  _exports.Toast = _toast.default;
   _transition = _interopRequireDefault(_transition);
   _exports.Transition = _transition.default;
 });

package/umd/input/demo/style/css/mobile.css

@@ -52,7 +52,7 @@
   font-size: 0.26rem;
   line-height: 0.36rem;
   margin-bottom: -0.16rem;
-  padding: 0.32rem 0 0 0.32rem;
+  padding: 0.32rem 0.32rem 0 0.32rem;
 }
 #demo-input .demo-input-btn-input .arco-input-wrap {
   height: auto;
@@ -65,3 +65,7 @@
   font-weight: bold;
   margin-right: -0.24rem;
 }
+[dir="rtl"] #demo-input .demo-input-money {
+  margin-right: initial;
+  margin-left: -0.24rem;
+}

package/umd/input/demo/style/mobile.less

@@ -57,7 +57,7 @@
         .rem(font-size, 13);
         .rem(line-height, 18);
         .rem(margin-bottom, -8);
-        .rem(padding, 16, 0, 0, 16);
+        .rem(padding, 16, 16, 0, 16);
     }
     .demo-input-btn-input .@{prefix}-input-wrap {
         height: auto;
@@ -70,6 +70,6 @@
     .demo-input-money {
         .rem(font-size, 20);
         font-weight: bold;
-        .rem(margin-right, -12);
+        .rem-with-rtl(margin-right, -12);
     }
 }

package/umd/input/hooks.js

@@ -14,52 +14,61 @@
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
   _exports.__esModule = true;
   _exports.useInputLogic = useInputLogic;
   _react = _interopRequireWildcard(_react);
   _IconClear = _interopRequireDefault(_IconClear);
+
   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按钮之后会手动聚焦一下
@@ -77,13 +86,16 @@
      * 如果这个标志为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 () {
@@ -91,6 +103,28 @@
         }, 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
@@ -98,10 +132,12 @@
         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)) {
@@ -110,54 +146,69 @@
         } 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.
@@ -169,29 +220,35 @@
       } 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",
@@ -219,6 +276,7 @@
         className: prefixCls + "-suffix"
       }, suffix) : null), renderPendNode(append));
     }
+
     return {
       inputValue: actualInputValue,
       handleChange: handleChange,

package/umd/input/index.js

@@ -14,47 +14,54 @@
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
   _exports.__esModule = true;
   _exports.default = void 0;
   _extends2 = _interopRequireDefault(_extends2);
   _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 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";
@@ -83,9 +90,9 @@
         "aria-label": ariaLabel
       })));
     }
+
     return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, renderInput);
   });
-
   /**
    * 输入框组件，支持添加前后缀。
    * @en The input box, supports adding prefixes and suffixes.
@@ -95,6 +102,8 @@
    * @name_en Input
    * @displayName Input
    */
+
   var _default = (0, _mobileUtils.componentWrapper)(Input, 'Input');
+
   _exports.default = _default;
 });