@arco-design/mobile-react 2.24.2 → 2.25.0

package/cjs/image-preview/methods.js

@@ -1,16 +1,11 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 exports.__esModule = true;
 exports.open = open;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _mobileUtils = require("@arco-design/mobile-utils");
-
 var _render = require("../_helpers/render");
-
 function open(Component) {
   return function (config, context) {
     var baseProps = (0, _extends2.default)({
@@ -18,40 +13,32 @@ function open(Component) {
     }, config || {}, {
       close: function close() {}
     });
-    var dynamicProps = (0, _extends2.default)({}, baseProps); // 不同的key用不同的容器挂载
-    // @en Different keys are mounted in different containers
+    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/cjs/image-preview/style/css/index.css

@@ -25,6 +25,7 @@
   user-select: none;
   /* Non-prefixed version, currently*/
 }
+.arco-image-preview .preview-image-wrap-container,
 .arco-image-preview .preview-image-wrap {
   width: 100%;
   height: 100%;

package/cjs/image-preview/style/css/index.js

@@ -1,11 +1,7 @@
 "use strict";
 
 require("../../../../style/css/public.css");
-
 require("../../../transition/style/css");
-
 require("../../../carousel/style/css");
-
 require("../../../image/style/css");
-
 require("./index.css");

package/cjs/image-preview/style/index.js

@@ -1,11 +1,7 @@
 "use strict";
 
 require("../../../style/public.less");
-
 require("../../transition/style");
-
 require("../../carousel/style");
-
 require("../../image/style");
-
 require("./index.less");

package/cjs/image-preview/style/index.less

@@ -18,7 +18,7 @@
         .noselect();
     }
 
-    .preview-image-wrap {
+    .preview-image-wrap-container, .preview-image-wrap {
         width: 100%;
         height: 100%;
     }

package/cjs/index.d.ts

@@ -18,12 +18,17 @@ export { default as DatePicker } from './date-picker';
 export { default as Dropdown } from './dropdown';
 export { default as DropdownMenu } from './dropdown-menu';
 export { default as Ellipsis } from './ellipsis';
+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 Input } from './input';
 export { default as LoadMore } from './load-more';
 export { default as Masking } from './masking';
 export { default as NavBar } from './nav-bar';
@@ -38,9 +43,6 @@ export { default as PopupSwiper } from './popup-swiper';
 export { default as Portal } from './portal';
 export { default as Progress } from './progress';
 export { default as PullRefresh } from './pull-refresh';
-export { default as Radio } from './radio';
-export { default as Rate } from './rate';
-export { default as Slider } from './slider';
 export { default as SearchBar } from './search-bar';
 export { default as Stepper } from './stepper';
 export { default as Steps } from './steps';
@@ -49,5 +51,4 @@ export { default as SwipeAction } from './swipe-action';
 export { default as SwipeLoad } from './swipe-load';
 export { default as TabBar } from './tab-bar';
 export { default as Tag } from './tag';
-export { default as Textarea } from './textarea';
 export { default as Transition } from './transition';

package/cjs/index.js

@@ -1,218 +1,113 @@
 "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.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.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;
 var _actionSheet = _interopRequireDefault(require("./action-sheet"));
-
 exports.ActionSheet = _actionSheet.default;
-
 var _cell = _interopRequireDefault(require("./cell"));
-
 exports.Cell = _cell.default;
-
 var _loading = _interopRequireDefault(require("./loading"));
-
 exports.Loading = _loading.default;
-
 var _badge = _interopRequireDefault(require("./badge"));
-
 exports.Badge = _badge.default;
-
 var _avatar = _interopRequireDefault(require("./avatar"));
-
 exports.Avatar = _avatar.default;
-
 var _button = _interopRequireDefault(require("./button"));
-
 exports.Button = _button.default;
-
 var _carousel = _interopRequireDefault(require("./carousel"));
-
 exports.Carousel = _carousel.default;
-
 var _toast = _interopRequireDefault(require("./toast"));
-
 exports.Toast = _toast.default;
-
 var _switch = _interopRequireDefault(require("./switch"));
-
 exports.Switch = _switch.default;
-
 var _checkbox = _interopRequireDefault(require("./checkbox"));
-
 exports.Checkbox = _checkbox.default;
-
 var _circleProgress = _interopRequireDefault(require("./circle-progress"));
-
 exports.CircleProgress = _circleProgress.default;
-
 var _collapse = _interopRequireDefault(require("./collapse"));
-
 exports.Collapse = _collapse.default;
-
 var _tabs = _interopRequireDefault(require("./tabs"));
-
 exports.Tabs = _tabs.default;
-
 var _contextProvider = _interopRequireDefault(require("./context-provider"));
-
 exports.ContextProvider = _contextProvider.default;
-
 var _dialog = _interopRequireDefault(require("./dialog"));
-
 exports.Dialog = _dialog.default;
-
 var _countDown = _interopRequireDefault(require("./count-down"));
-
 exports.CountDown = _countDown.default;
-
 var _datePicker = _interopRequireDefault(require("./date-picker"));
-
 exports.DatePicker = _datePicker.default;
-
 var _dropdown = _interopRequireDefault(require("./dropdown"));
-
 exports.Dropdown = _dropdown.default;
-
 var _dropdownMenu = _interopRequireDefault(require("./dropdown-menu"));
-
 exports.DropdownMenu = _dropdownMenu.default;
-
 var _ellipsis = _interopRequireDefault(require("./ellipsis"));
-
 exports.Ellipsis = _ellipsis.default;
-
+var _form = _interopRequireDefault(require("./form"));
+exports.Form = _form.default;
+var _input = _interopRequireDefault(require("./input"));
+exports.Input = _input.default;
+var _textarea = _interopRequireDefault(require("./textarea"));
+exports.Textarea = _textarea.default;
+var _radio = _interopRequireDefault(require("./radio"));
+exports.Radio = _radio.default;
+var _imagePicker = _interopRequireDefault(require("./image-picker"));
+exports.ImagePicker = _imagePicker.default;
+var _rate = _interopRequireDefault(require("./rate"));
+exports.Rate = _rate.default;
+var _slider = _interopRequireDefault(require("./slider"));
+exports.Slider = _slider.default;
 var _grid = _interopRequireDefault(require("./grid"));
-
 exports.Grid = _grid.default;
-
 var _image = _interopRequireDefault(require("./image"));
-
 exports.Image = _image.default;
-
 var _showMonitor = _interopRequireDefault(require("./show-monitor"));
-
 exports.ShowMonitor = _showMonitor.default;
-
-var _imagePicker = _interopRequireDefault(require("./image-picker"));
-
-exports.ImagePicker = _imagePicker.default;
-
 var _imagePreview = _interopRequireDefault(require("./image-preview"));
-
 exports.ImagePreview = _imagePreview.default;
-
-var _input = _interopRequireDefault(require("./input"));
-
-exports.Input = _input.default;
-
 var _loadMore = _interopRequireDefault(require("./load-more"));
-
 exports.LoadMore = _loadMore.default;
-
 var _masking = _interopRequireDefault(require("./masking"));
-
 exports.Masking = _masking.default;
-
 var _navBar = _interopRequireDefault(require("./nav-bar"));
-
 exports.NavBar = _navBar.default;
-
 var _noticeBar = _interopRequireDefault(require("./notice-bar"));
-
 exports.NoticeBar = _noticeBar.default;
-
 var _notify = _interopRequireDefault(require("./notify"));
-
 exports.Notify = _notify.default;
-
 var _pagination = _interopRequireDefault(require("./pagination"));
-
 exports.Pagination = _pagination.default;
-
 var _picker = _interopRequireDefault(require("./picker"));
-
 exports.Picker = _picker.default;
-
 var _pickerView = _interopRequireDefault(require("./picker-view"));
-
 exports.PickerView = _pickerView.default;
-
 var _popover = _interopRequireDefault(require("./popover"));
-
 exports.Popover = _popover.default;
-
 var _popup = _interopRequireDefault(require("./popup"));
-
 exports.Popup = _popup.default;
-
 var _popupSwiper = _interopRequireDefault(require("./popup-swiper"));
-
 exports.PopupSwiper = _popupSwiper.default;
-
 var _portal = _interopRequireDefault(require("./portal"));
-
 exports.Portal = _portal.default;
-
 var _progress = _interopRequireDefault(require("./progress"));
-
 exports.Progress = _progress.default;
-
 var _pullRefresh = _interopRequireDefault(require("./pull-refresh"));
-
 exports.PullRefresh = _pullRefresh.default;
-
-var _radio = _interopRequireDefault(require("./radio"));
-
-exports.Radio = _radio.default;
-
-var _rate = _interopRequireDefault(require("./rate"));
-
-exports.Rate = _rate.default;
-
-var _slider = _interopRequireDefault(require("./slider"));
-
-exports.Slider = _slider.default;
-
 var _searchBar = _interopRequireDefault(require("./search-bar"));
-
 exports.SearchBar = _searchBar.default;
-
 var _stepper = _interopRequireDefault(require("./stepper"));
-
 exports.Stepper = _stepper.default;
-
 var _steps = _interopRequireDefault(require("./steps"));
-
 exports.Steps = _steps.default;
-
 var _sticky = _interopRequireDefault(require("./sticky"));
-
 exports.Sticky = _sticky.default;
-
 var _swipeAction = _interopRequireDefault(require("./swipe-action"));
-
 exports.SwipeAction = _swipeAction.default;
-
 var _swipeLoad = _interopRequireDefault(require("./swipe-load"));
-
 exports.SwipeLoad = _swipeLoad.default;
-
 var _tabBar = _interopRequireDefault(require("./tab-bar"));
-
 exports.TabBar = _tabBar.default;
-
 var _tag = _interopRequireDefault(require("./tag"));
-
 exports.Tag = _tag.default;
-
-var _textarea = _interopRequireDefault(require("./textarea"));
-
-exports.Textarea = _textarea.default;
-
 var _transition = _interopRequireDefault(require("./transition"));
-
 exports.Transition = _transition.default;

package/cjs/input/hooks.js

@@ -1,64 +1,54 @@
 "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;
   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];
   /**
    * clear相关问题背景
    * 如果点击clear按钮之前已经是focusing状态了，那么在点完clear按钮之后会手动聚焦一下
@@ -76,12 +66,9 @@ 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)();
@@ -100,12 +87,10 @@ 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)) {
@@ -114,65 +99,54 @@ 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) {
     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.
@@ -184,35 +158,29 @@ 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",
@@ -240,7 +208,6 @@ function useInputLogic(props, inputRef) {
       className: prefixCls + "-suffix"
     }, suffix) : null), renderPendNode(append));
   }
-
   return {
     inputValue: actualInputValue,
     handleChange: handleChange,

package/cjs/input/index.d.ts

@@ -45,6 +45,7 @@ export interface InputRef {
      */
     input: HTMLInputElement | null;
 }
+declare const _default: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<InputRef>> & "Input";
 /**
  * 输入框组件，支持添加前后缀。
  * @en The input box, supports adding prefixes and suffixes.
@@ -52,6 +53,6 @@ export interface InputRef {
  * @type_en Data Entry
  * @name 输入框
  * @name_en Input
+ * @displayName Input
  */
-declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<InputRef>>;
-export default Input;
+export default _default;