import type { InputHTMLAttributes } from 'react';
import type { ImageProps } from '../image';
import type { UploadCommonProps, CommonFileItem } from '../uploader/upload/type';
export interface ImagePickItem extends CommonFileItem {
/**
* 图片地址
* @en Image Url
*/
url: string;
}
export interface ImagePickerProps extends Omit, 'files' | 'onUploadClick'> {
/**
* 自定义类名
* @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['capture'];
/**
* 一行展示图片张数
* @en The Number Of Pictures Displayed In A Row
* @default 3
*/
columns?: number;
/**
* 格子间的间距
* @en spacing between grids
* @default 8
*/
gutter?: 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?: Partial;
/**
* 自定义上传失败展示
* @en Defined upload failed display
*/
renderError?: (index?: number) => React.ReactNode | React.ReactNode;
/**
* 自定义上传中展示
* @en Defined uploading display
*/
renderLoading?: (index?: number) => React.ReactNode | React.ReactNode;
/**
* 选图点击事件(同onUploadClick)
* @en Select icon click event(same as onUploadClick)
* @deprecated Please use onUploadClick instead
*/
onSelectClick?: () => void;
/**
* 选图点击事件
* @en Select icon click event
*/
onUploadClick?: () => void;
}
export interface ImagePickerRef {
/**
* 最外层 DOM 元素
* @en The outer DOM element of the component
*/
dom: HTMLDivElement | null;
}