@arco-design/mobile-react 2.19.2-ee92494.5 → 2.21.1

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

@@ -1,5 +1,4 @@
-import React from 'react';
-import { DropdownMenuRef } from './type';
+/// <reference types="react" />
 export * from './type';
 /**
  * 下拉选择组件，点击选择器(select)展开下拉框(dropdown)，展示选择项(options)，兼容多个选择器的情况。
@@ -9,5 +8,5 @@ export * from './type';
  * @name 下拉选择菜单
  * @name_en DropdownMenu
  */
-declare const DropdownMenu: React.ForwardRefExoticComponent<(import("./type").DropdownMenuBasicProps & import("./type").SingleOptionProps & React.RefAttributes<DropdownMenuRef>) | (import("./type").DropdownMenuBasicProps & import("./type").MultipleOptionProps & React.RefAttributes<DropdownMenuRef>)>;
+declare const DropdownMenu: import("react").ForwardRefExoticComponent<(import("./type").DropdownMenuBasicProps & import("./type").SingleOptionProps & import("react").RefAttributes<import("./type").DropdownMenuRef>) | (import("./type").DropdownMenuBasicProps & import("./type").MultipleOptionProps & import("react").RefAttributes<import("./type").DropdownMenuRef>)>;
 export default DropdownMenu;

package/esm/dropdown-menu/index.js

@@ -1,10 +1,5 @@
-import _extends from "@babel/runtime/helpers/extends";
-import React, { useRef, useState, forwardRef, useImperativeHandle, useMemo, useCallback, useEffect, useContext } from 'react';
-import { cls } from '@arco-design/mobile-utils';
-import { GlobalContext } from '../context-provider';
-import { getFormattedOptions as defaultFormatFunc, isCascadeArray, isClassNameDom, isRefDom } from './helper';
+import { componentGenerator } from './dropdown-menu';
 import Dropdown from '../dropdown';
-import IconTriDown from '../icon/IconTriDown';
 export * from './type';
 /**
  * 下拉选择组件，点击选择器(select)展开下拉框(dropdown)，展示选择项(options)，兼容多个选择器的情况。
@@ -15,235 +10,5 @@ export * from './type';
  * @name_en DropdownMenu
  */
 
-var DropdownMenu = /*#__PURE__*/forwardRef(function (props, ref) {
-  var _props$className = props.className,
-      className = _props$className === void 0 ? '' : _props$className,
-      _props$style = props.style,
-      style = _props$style === void 0 ? {} : _props$style,
-      _props$options = props.options,
-      options = _props$options === void 0 ? [] : _props$options,
-      _props$disabled = props.disabled,
-      disabled = _props$disabled === void 0 ? [] : _props$disabled,
-      _props$selectTips = props.selectTips,
-      selectTips = _props$selectTips === void 0 ? [] : _props$selectTips,
-      values = props.values,
-      _props$defaultValues = props.defaultValues,
-      defaultValues = _props$defaultValues === void 0 ? [] : _props$defaultValues,
-      icon = props.icon,
-      _props$chooseAndClose = props.chooseAndClose,
-      chooseAndClose = _props$chooseAndClose === void 0 ? true : _props$chooseAndClose,
-      selectIndex = props.selectIndex,
-      _props$defaultSelectI = props.defaultSelectIndex,
-      defaultSelectIndex = _props$defaultSelectI === void 0 ? 0 : _props$defaultSelectI,
-      showDropdown = props.showDropdown,
-      _props$defaultShowDro = props.defaultShowDropdown,
-      defaultShowDropdown = _props$defaultShowDro === void 0 ? false : _props$defaultShowDro,
-      renderSelectLabel = props.renderSelectLabel,
-      onValuesChange = props.onValuesChange,
-      onSelectChange = props.onSelectChange,
-      onDropdownChange = props.onDropdownChange,
-      _props$getFormattedOp = props.getFormattedOptions,
-      getFormattedOptions = _props$getFormattedOp === void 0 ? defaultFormatFunc : _props$getFormattedOp,
-      children = props.children,
-      extraForDropdown = props.extraForDropdown;
-
-  var _useContext = useContext(GlobalContext),
-      prefixCls = _useContext.prefixCls,
-      locale = _useContext.locale;
-
-  var _useState = useState(defaultValues),
-      innerValues = _useState[0],
-      setInnerValues = _useState[1];
-
-  var _useState2 = useState(0),
-      defaultTop = _useState2[0],
-      setDefaultTop = _useState2[1];
-
-  var currentValues = values !== void 0 ? values : innerValues;
-
-  var _useState3 = useState(defaultShowDropdown),
-      innerShowDropdown = _useState3[0],
-      setInnerShowDropdown = _useState3[1];
-
-  var dropdownShown = showDropdown !== void 0 ? showDropdown : innerShowDropdown;
-
-  var _useState4 = useState(defaultSelectIndex),
-      innerSelectedIndex = _useState4[0],
-      setInnerSelectedIndex = _useState4[1];
-
-  var selectedIndex = selectIndex !== void 0 ? selectIndex : innerSelectedIndex;
-  var selectWrapper = useRef(null);
-  var domRef = useRef(null);
-  var defaultOpItem = {
-    label: locale == null ? void 0 : locale.DropdownMenu.select,
-    value: -1
-  };
-  /**
-   * 下拉框的容器
-   * @en Dropdown container
-   */
-
-  var getContainer = useCallback(function () {
-    if (props.getContainer) {
-      return props.getContainer() || selectWrapper.current;
-    }
-
-    return selectWrapper.current;
-  }, [selectWrapper.current]);
-  /**
-   * 更新选项数组和选择情况
-   * @en Update options list and selection
-   */
-
-  var _useMemo = useMemo(function () {
-    return getFormattedOptions(options, currentValues);
-  }, [options, currentValues]),
-      formattedOptions = _useMemo.formattedOptions;
-
-  var selectedOptions = useMemo(function () {
-    return formattedOptions.map(function (ops, index) {
-      return ops.find(function (op) {
-        var value = currentValues[index];
-        return Array.isArray(value) ? value.includes(op.value) : op.value === value;
-      }) || (props.multiple ? defaultOpItem : ops[0]);
-    });
-  }, [formattedOptions, currentValues]);
-  /**
-   * 当下拉框的状态变化
-   * @en When the state of the dropdown box changes
-   */
-
-  var handleShowDropdownChange = function handleShowDropdownChange(show, index) {
-    onDropdownChange && onDropdownChange(show, index);
-    setInnerShowDropdown(show);
-  };
-
-  var handleSelectedIndexChange = function handleSelectedIndexChange(idx) {
-    setInnerSelectedIndex(idx);
-    onSelectChange == null ? void 0 : onSelectChange(idx);
-  };
-
-  var handleValuesChange = function handleValuesChange(val) {
-    var newValue = [].concat(currentValues); // 级联情况下 selectedIndex 之后的选项值重置
-    // @en Option values are reset after selectedIndex in case of cascade
-
-    if (isCascadeArray(options)) {
-      newValue = newValue.slice(0, selectedIndex);
-    }
-
-    newValue[selectedIndex] = val;
-    newValue = getFormattedOptions(options, newValue).formattedValue;
-    setInnerValues(newValue);
-    onValuesChange == null ? void 0 : onValuesChange(newValue);
-  };
-  /**
-   * 处理选择框的点击事件
-   * @en Handle click event of dropdown box
-   */
-
-
-  var handleSelectClick = function handleSelectClick(idx) {
-    if (disabled[idx]) return;
-
-    if (Number(idx) === selectedIndex) {
-      handleShowDropdownChange(!dropdownShown, idx);
-    } else {
-      handleSelectedIndexChange(idx);
-      if (!dropdownShown) handleShowDropdownChange(true, idx);
-    }
-  };
-  /**
-   * 判断是否为当前实例下的选择框
-   * @en Determine whether it is the dropdown box under the current instance
-   */
-
-
-  var isCurrentSelectEl = function isCurrentSelectEl(target) {
-    var _ref = extraForDropdown || {},
-        isStopTouchEl = _ref.isStopTouchEl;
-
-    return isRefDom(target, selectWrapper) && isClassNameDom(target, 'select-item') || (isStopTouchEl == null ? void 0 : isStopTouchEl(target)) || false;
-  };
-
-  useImperativeHandle(ref, function () {
-    return {
-      dom: domRef.current
-    };
-  });
-  useEffect(function () {
-    var _getContainer;
-
-    setDefaultTop(((_getContainer = getContainer()) == null ? void 0 : _getContainer.getBoundingClientRect().bottom) || 0);
-  }, [getContainer, dropdownShown]);
-
-  var onCancel = props.onCancel || function () {
-    return handleShowDropdownChange(false);
-  };
-
-  var dropdownCommonProps = _extends({
-    showDropdown: dropdownShown,
-    top: (extraForDropdown == null ? void 0 : extraForDropdown.top) || defaultTop,
-    onCancel: onCancel
-  }, extraForDropdown || {}, {
-    isStopTouchEl: isCurrentSelectEl
-  });
-
-  return /*#__PURE__*/React.createElement("div", {
-    ref: domRef,
-    className: cls(prefixCls + "-dropdown-menu all-border-box " + (dropdownShown ? 'show' : ''), className),
-    style: style
-  }, /*#__PURE__*/React.createElement("div", {
-    className: cls(prefixCls + "-select"),
-    ref: selectWrapper
-  }, selectedOptions.map(function (op, index) {
-    var tip = selectTips[index] || '';
-    return /*#__PURE__*/React.createElement("div", {
-      className: cls(prefixCls + "-select-item", {
-        'is-disabled': disabled[index],
-        'is-selected': dropdownShown && selectedIndex === index
-      }),
-      key: index,
-      "data-idx": index,
-      onClick: function onClick() {
-        return handleSelectClick(index);
-      }
-    }, tip.length > 0 && /*#__PURE__*/React.createElement("span", {
-      className: cls(prefixCls + "-select-item-tip")
-    }, tip), /*#__PURE__*/React.createElement("div", {
-      className: cls(prefixCls + "-select-item-label")
-    }, renderSelectLabel ? renderSelectLabel(op, index) : /*#__PURE__*/React.createElement("div", {
-      className: cls(prefixCls + "-select-item-label-text")
-    }, op.label), icon === void 0 ? /*#__PURE__*/React.createElement(IconTriDown, {
-      className: cls(prefixCls + "-select-item-icon", {
-        'is-show': dropdownShown && selectedIndex === index
-      })
-    }) : icon));
-  }), props.multiple === true ? /*#__PURE__*/React.createElement(Dropdown, _extends({
-    multiple: true,
-    options: formattedOptions[selectedIndex] || [],
-    selectedValue: currentValues[selectedIndex] || [],
-    onOptionClick: function onOptionClick(selected, val, op) {
-      props.onOptionClick == null ? void 0 : props.onOptionClick(selected, val, op, selectedIndex);
-    },
-    onOptionChange: function onOptionChange(val, op) {
-      props.onOptionChange == null ? void 0 : props.onOptionChange(val, op, selectedIndex);
-      handleValuesChange(val);
-    }
-  }, dropdownCommonProps), children) : /*#__PURE__*/React.createElement(Dropdown, _extends({
-    multiple: props.multiple,
-    options: formattedOptions[selectedIndex] || [],
-    selectedValue: currentValues[selectedIndex] || 0,
-    onOptionClick: function onOptionClick(val, op) {
-      props.onOptionClick == null ? void 0 : props.onOptionClick(val, op, selectedIndex);
-
-      if (chooseAndClose) {
-        handleShowDropdownChange(false, selectedIndex);
-      }
-    },
-    onOptionChange: function onOptionChange(val, op) {
-      props.onOptionChange == null ? void 0 : props.onOptionChange(val, op, selectedIndex);
-      handleValuesChange(val);
-    }
-  }, dropdownCommonProps), children)));
-});
+var DropdownMenu = componentGenerator(Dropdown);
 export default DropdownMenu;

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

@@ -1,5 +1,5 @@
 import { CSSProperties, ReactNode } from 'react';
-import { OptionsItem, DropdownCommonProps } from '../dropdown';
+import { OptionsItem, DropdownCommonProps, OptionValueType } from '../dropdown';
 export type { OptionsItem, DropdownCommonProps };
 export interface CascadeOptions extends OptionsItem {
     /**
@@ -29,11 +29,6 @@ export interface DropdownMenuBasicProps {
      * @en The selected number of selector (controlled)
      */
     selectIndex?: number;
-    /**
-     * 自定义选择器
-     * @en Custom selector
-     */
-    renderSelectLabel?: (op: OptionsItem, index: number) => ReactNode;
     /**
      * 选择器禁用状态
      * @en Selector disabled state
@@ -112,47 +107,53 @@ export interface SingleOptionProps {
      * 初始选择项
      * @en initial selection item
      *  */
-    defaultValues?: number[];
+    defaultValues?: OptionValueType[];
     /**
      * (受控) 每个选择器选中的项
      * @en (Controlled) The item selected by each selector
      *  */
-    values?: number[];
+    values?: OptionValueType[];
+    /**
+     * 自定义选择器
+     * @en Custom selector
+     */
+    renderSelectLabel?: (op: OptionsItem, index: number) => ReactNode;
     /**
      * 点击选项时触发的回调函数
      * @en Callback when clicking option
      *  */
-    onOptionClick?: (value: number, item: OptionsItem, selectIndex?: number) => void;
+    onOptionClick?: (value: OptionValueType, item: OptionsItem, selectIndex?: number) => void;
     /**
      * 选项改变时触发的回调函数
      * @en Callback when options change
      *  */
-    onOptionChange?: (value: number, item: OptionsItem, selectIndex?: number) => void;
+    onOptionChange?: (value: OptionValueType, item: OptionsItem, selectIndex?: number) => void;
     /**
      * 所有选择器选项总值改变时的回调函数
      * @en Callback when the total value of all selector options changes
      *  */
-    onValuesChange?: (values: number[]) => void;
+    onValuesChange?: (values: OptionValueType[]) => void;
     /**
      * 格式化传入的options
      * @en Format the input options
      *  */
-    getFormattedOptions?: (options: SingleOptionProps['options'], values?: number[]) => {
+    getFormattedOptions?: (options: SingleOptionProps['options'], values?: OptionValueType[]) => {
         formattedOptions: OptionsItem[][];
-        formattedValue: number[];
+        formattedValue: OptionValueType[];
     };
 }
 export interface MultipleOptionProps {
     multiple: true;
     options: string[] | OptionsItem[][];
-    defaultValues?: number[][];
-    values?: number[][];
-    onOptionClick?: (selected: boolean, val: number, item: OptionsItem, selectIndex?: number) => void;
-    onOptionChange?: (vals: number[], item: OptionsItem, selectIndex?: number) => void;
-    onValuesChange?: (values: number[][]) => void;
-    getFormattedOptions?: (options: SingleOptionProps['options'], values?: number[][]) => {
+    defaultValues?: OptionValueType[][];
+    values?: OptionValueType[][];
+    renderSelectLabel?: (op: OptionsItem[], index: number) => ReactNode;
+    onOptionClick?: (selected: boolean, val: OptionValueType, item: OptionsItem, selectIndex?: number) => void;
+    onOptionChange?: (vals: OptionValueType[], item: OptionsItem, selectIndex?: number) => void;
+    onValuesChange?: (values: OptionValueType[][]) => void;
+    getFormattedOptions?: (options: SingleOptionProps['options'], values?: OptionValueType[][]) => {
         formattedOptions: OptionsItem[][];
-        formattedValue: number[][];
+        formattedValue: OptionValueType[][];
     };
 }
 export declare type OptionProps = SingleOptionProps | MultipleOptionProps;

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

@@ -11,8 +11,7 @@ var JsEllipsis = /*#__PURE__*/forwardRef(function (props, ref) {
       maxHeight = props.maxHeight,
       ellipsisNode = props.ellipsisNode,
       collapseNode = props.collapseNode,
-      _props$endExcludes = props.endExcludes,
-      endExcludes = _props$endExcludes === void 0 ? [] : _props$endExcludes,
+      endExcludes = props.endExcludes,
       reflowOnResize = props.reflowOnResize,
       onReflow = props.onReflow,
       onEllipsisNodeClick = props.onEllipsisNodeClick,
@@ -65,7 +64,7 @@ var JsEllipsis = /*#__PURE__*/forwardRef(function (props, ref) {
     } // Remove the exclude char at the end of the content.
 
 
-    while (endExcludes.includes(currentText[currentText.length - 1])) {
+    while (endExcludes && endExcludes.includes(currentText[currentText.length - 1])) {
       currentText = currentText.slice(0, -1);
     } // Callback after reflow.
 

package/esm/ellipsis/index.d.ts

@@ -4,7 +4,7 @@ export * from './type';
 /**
  * 文本缩略组件，支持多行缩略、富文本、自定义缩略符、尾字符过滤等。
  * @en Text ellipsis component supports multi-line abbreviations, rich text, custom abbreviations, tail character filtering, etc.
- * @type 数据展示
+ * @type 信息展示
  * @type_en Data Display
  * @name 文本缩略
  * @name_en Ellipsis

package/esm/ellipsis/index.js

@@ -8,7 +8,7 @@ export * from './type';
 /**
  * 文本缩略组件，支持多行缩略、富文本、自定义缩略符、尾字符过滤等。
  * @en Text ellipsis component supports multi-line abbreviations, rich text, custom abbreviations, tail character filtering, etc.
- * @type 数据展示
+ * @type 信息展示
  * @type_en Data Display
  * @name 文本缩略
  * @name_en Ellipsis
@@ -28,15 +28,14 @@ var Ellipsis = /*#__PURE__*/forwardRef(function (props, ref) {
       _props$collapseNode = props.collapseNode,
       collapseNode = _props$collapseNode === void 0 ? '' : _props$collapseNode,
       onCollapseNodeClick = props.onCollapseNodeClick,
-      _props$endExcludes = props.endExcludes,
-      endExcludes = _props$endExcludes === void 0 ? [] : _props$endExcludes,
+      endExcludes = props.endExcludes,
       _props$reflowOnResize = props.reflowOnResize,
       reflowOnResize = _props$reflowOnResize === void 0 ? false : _props$reflowOnResize,
       onReflow = props.onReflow,
       onEllipsisNodeClick = props.onEllipsisNodeClick;
   var domRef = useRef(null);
   var jsEllipsisRef = useRef(null);
-  var useNativeEllipsis = isSupportWebkitLineClamp() && maxHeight === void 0 && ellipsisNode === '...' && endExcludes.length === 0 && !onReflow && !onEllipsisNodeClick;
+  var useNativeEllipsis = isSupportWebkitLineClamp() && maxHeight === void 0 && ellipsisNode === '...' && (!endExcludes || endExcludes.length === 0) && !onReflow && !onEllipsisNodeClick;
   useImperativeHandle(ref, function () {
     var _jsEllipsisRef$curren;
 

package/esm/image/index.d.ts

@@ -177,7 +177,7 @@ export interface ImageRef {
 /**
  * 增强版的 img 标签，提供多种图片填充模式，支持图片加载中提示、加载失败提示。
  * @en Enhanced img tag, provides a variety of image filling modes, and supports image loading prompts and loading failure prompts.
- * @type 数据展示
+ * @type 信息展示
  * @type_en Data Display
  * @name 图片
  * @name_en Image

package/esm/image/index.js

@@ -8,7 +8,7 @@ import { useSystem, useWindowSize, getStyleWithVendor, useMountedState } from '.
 /**
  * 增强版的 img 标签，提供多种图片填充模式，支持图片加载中提示、加载失败提示。
  * @en Enhanced img tag, provides a variety of image filling modes, and supports image loading prompts and loading failure prompts.
- * @type 数据展示
+ * @type 信息展示
  * @type_en Data Display
  * @name 图片
  * @name_en Image
@@ -37,6 +37,7 @@ export var BaseImage = /*#__PURE__*/forwardRef(function (props, ref) {
   var wrapRef = useRef(null);
   var retryCountRef = useRef(0);
   var loadingImageRef = useRef(null);
+  var hasLoadedRef = useRef(false);
   var style = props.style,
       className = props.className,
       status = props.status,
@@ -160,6 +161,7 @@ export var BaseImage = /*#__PURE__*/forwardRef(function (props, ref) {
     image.onload = function (evt) {
       loadingImageRef.current = null;
       imageDomRef.current = image;
+      hasLoadedRef.current = true;
       changeStatus('loaded');
       var _image$width = image.width,
           imageWidth = _image$width === void 0 ? 0 : _image$width,
@@ -274,7 +276,8 @@ export var BaseImage = /*#__PURE__*/forwardRef(function (props, ref) {
     })) : null, /*#__PURE__*/React.createElement("div", {
       className: cls('image-container', validStatus, {
         animate: Boolean(animateDuration),
-        'static-label': staticLabel
+        'static-label': staticLabel,
+        'has-loaded': hasLoadedRef.current
       }),
       style: getStyleWithVendor({
         transitionDuration: animateDuration + "ms"

package/esm/image/style/css/index.css

@@ -66,7 +66,8 @@
 }
 .arco-image .image-container.static-label,
 .arco-image .image-container.loaded,
-.arco-image .image-container.error {
+.arco-image .image-container.error,
+.arco-image .image-container.has-loaded {
   opacity: 1;
 }
 .arco-image .image-container.animate {

package/esm/image/style/index.less

@@ -66,7 +66,8 @@
 
         &.static-label,
         &.loaded,
-        &.error {
+        &.error,
+        &.has-loaded {
             opacity: 1;
         }
 

package/esm/image-picker/index.d.ts

@@ -1,181 +1,10 @@
-import React, { InputHTMLAttributes } from 'react';
-import { ImageProps } from '../image';
-export interface ImagePickItem {
-    /**
-     * 图片地址
-     * @en Image Url
-     */
-    url: string;
-    /**
-     * 图片文件
-     * @en Image File
-     */
-    file?: File;
-    /**
-     * 图片状态
-     * @en Image Status
-     * @default 'loaded'
-     */
-    status: 'loaded' | 'loading' | 'error';
-}
-export interface AdapterFile {
-    url?: string;
-    size: number;
-    name: string;
-}
-export interface SelectCallback {
-    files: AdapterFile[];
-}
-export interface ImagePickerProps {
-    /**
-     * 自定义类名
-     * @en Custom className
-     */
-    className?: string;
-    /**
-     * 自定义样式
-     * @en Custom stylesheet
-     */
-    style?: React.CSSProperties;
-    /**
-     * 已选择图片列表
-     * @en selected images list
-     */
-    images: ImagePickItem[];
-    /**
-     * 可以选择的文件类型
-     * @en Available File Types
-     * @default 'image/*'
-     */
-    accept?: string;
-    /**
-     * 是否支持多选
-     * @en Whether To Support Multiple Selection
-     */
-    multiple?: boolean;
-    /**
-     * 图片选取模式 Image selection mode [capture MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture)
-     * @en Whether To Support Multiple Selection [capture MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture)
-     */
-    capture?: InputHTMLAttributes<unknown>['capture'];
-    /**
-     * 一行展示图片张数
-     * @en The Number Of Pictures Displayed In A Row
-     * @default 3
-     */
-    columns?: number;
-    /**
-     * 格子间的间距
-     * @en spacing between grids
-     * @default 8
-     */
-    gutter?: number;
-    /**
-     * 最多选择图片张数，超出数量自动隐藏上传按钮，0表示不做限制
-     * @en max Pictures Can Choose
-     */
-    limit?: number;
-    /**
-     * 文件大小限制，单位为K
-     * @en File size limit, in K
-     */
-    maxSize?: number;
-    /**
-     * 是否隐藏删除Icon
-     * @en Whether to hide delete Icon
-     * @default false
-     */
-    hideDelete?: boolean;
-    /**
-     * 是否隐藏选择Icon
-     * @en Whether to hide Select Icon
-     * @default false
-     */
-    hideSelect?: boolean;
-    /**
-     * 是否总是展示选择Icon，默认情况下当图片数量超出limit值时会自动隐藏选择Icon
-     * @en Whether to always show Select Icon
-     * @default false
-     */
-    alwaysShowSelect?: boolean;
-    /**
-     * 禁用选择和删除图片
-     * @en Disable Select & Delete Image
-     */
-    disabled?: boolean;
-    /**
-     * 自定义删除图标
-     * @en Defined Delete Icon
-     */
-    deleteIcon?: React.ReactNode;
-    /**
-     * 自定义选择图标
-     * @en Defined Select Icon
-     */
-    selectIcon?: React.ReactNode;
-    /**
-     * 透传给图片的属性
-     * @en Attributes passed through to the image
-     */
-    imageProps?: ImageProps;
-    /**
-     * 自定义上传失败展示
-     * @en Defined upload failed display
-     */
-    renderError?: (index?: number) => React.ReactNode | React.ReactNode;
-    /**
-     * 自定义上传中展示
-     * @en Defined uploading display
-     */
-    renderLoading?: (index?: number) => React.ReactNode | React.ReactNode;
-    /**
-     * 上传方法
-     * @en upload function
-     */
-    upload?: (file: ImagePickItem) => Promise<ImagePickItem | null>;
-    onSelect?: (...args: any[]) => void;
-    /**
-     * 已选图片列表发生变化
-     * @en The list of selected images changes
-     */
-    onChange?: (fileList: ImagePickItem[]) => Promise<void>;
-    /**
-     * 图片超过限制大小
-     * @en Image exceeds size limit
-     */
-    onMaxSizeExceed?: (file: File) => void;
-    /**
-     * 选择张数超过限制
-     * @en The number of pictures exceeds the limit
-     */
-    onLimitExceed?: (files: File[]) => void;
-    /**
-     * 图片点击
-     * @en click event
-     */
-    onClick?: (e: React.MouseEvent<HTMLElement, MouseEvent>, image: ImagePickItem, index: number) => void;
-    /**
-     * 图片长按事件
-     * @en long press event
-     */
-    onLongPress?: (e: React.TouchEvent<HTMLElement>, image: ImagePickItem, index: number) => void;
-    /**
-     * 图片选择适配器
-     * @en Select Adaptor
-     */
-    selectAdapter: () => Promise<SelectCallback>;
-}
-export interface ImagePickerRef {
-    /**
-     * 最外层 DOM 元素
-     * @en The outer DOM element of the component
-     */
-    dom: HTMLDivElement | null;
-}
+import React from 'react';
+import { ImagePickerProps, ImagePickerRef } from './type';
+export * from './type';
 /**
  * 图片选择器组件
  * @en ImagePicker Component
- * @type 数据输入
+ * @type 数据录入
  * @type_en Data Entry
  * @name 图片选择器
  * @name_en ImagePicker