react-dropzone

Dropzone: (
    props: DropzoneProps & React.RefAttributes<DropzoneRef>
) => JSX.Element;

useDropzone: (options?: DropzoneOptions) => DropzoneState;

type DropEvent =
    | React.DragEvent<HTMLElement>
    | React.ChangeEvent<HTMLInputElement>
    | DragEvent
    | Event;

type DropzoneOptions = Pick<React.HTMLProps<HTMLElement>, PropTypes> & {
    accept?: Accept;
    minSize?: number;
    maxSize?: number;
    maxFiles?: number;
    preventDropOnDocument?: boolean;
    noClick?: boolean;
    noKeyboard?: boolean;
    noDrag?: boolean;
    noDragEventsBubbling?: boolean;
    disabled?: boolean;
    onDrop?: <T extends File>(
        acceptedFiles: T[],
        fileRejections: FileRejection[],
        event: DropEvent
    ) => void;
    onDropAccepted?: <T extends File>(files: T[], event: DropEvent) => void;
    onDropRejected?: (fileRejections: FileRejection[], event: DropEvent) => void;
    getFilesFromEvent?: (
        event: DropEvent
    ) => Promise<Array<File | DataTransferItem>>;
    onFileDialogCancel?: () => void;
    onFileDialogOpen?: () => void;
    onError?: (err: Error) => void;
    validator?: <T extends File>(file: T) => FileError | readonly FileError[] | null;
    useFsAccessApi?: boolean;
    autoFocus?: boolean;
};

type DropzoneState = DropzoneRef & {
    isFocused: boolean;
    isDragActive: boolean;
    isDragAccept: boolean;
    isDragReject: boolean;
    isFileDialogActive: boolean;
    acceptedFiles: readonly FileWithPath[];
    fileRejections: readonly FileRejection[];
    rootRef: React.RefObject<HTMLElement>;
    inputRef: React.RefObject<HTMLInputElement>;
    getRootProps: <T extends DropzoneRootProps>(props?: T) => T;
    getInputProps: <T extends DropzoneInputProps>(props?: T) => T;
};