import React from 'react'; import { FileRejection, Accept, FileWithPath, DropEvent, FileError } from 'react-dropzone'; import { ForwardRefWithStaticComponents } from '../utils/ForwardRefWithStaticComponents'; import { DefaultProps, KubedNumberSize } from '../theme'; import { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus'; export interface DropzoneProps extends DefaultProps, Omit, 'onDrop'> { /** Padding from theme.spacing, or number to set padding in px */ padding?: KubedNumberSize; /** Border radius from theme.radius or number to set border-radius in px */ radius?: KubedNumberSize; /** Dropzone statues */ children: React.ReactNode; /** Disable files capturing */ disabled?: boolean; /** Called when any files are dropped into dropzone */ onDropAny?(files: FileWithPath[], fileRejections: FileRejection[]): void; /** Called when valid files are dropped into dropzone */ onDrop(files: FileWithPath[]): void; /** Called when selected files don't meet file restrictions */ onReject?(fileRejections: FileRejection[]): void; /** Display loading overlay over dropzone */ loading?: boolean; /** File types to accept */ accept?: Accept | string[]; /** Get open function as ref */ openRef?: React.ForwardedRef<() => void | undefined>; /** Allow selection of multiple files */ multiple?: boolean; /** Set maximum file size in bytes */ maxSize?: number; /** Name of the form control. Submitted with the form as part of a name/value pair. */ name?: string; /** Number of files that user can pick */ maxFiles?: number; /** Set to true to autofocus the root element */ autoFocus?: boolean; /** If false, disables click to open the native file selection dialog */ activateOnClick?: boolean; /** If false, disables drag 'n' drop */ activateOnDrag?: boolean; /** If false, disables Space/Enter to open the native file selection dialog. Note that it also stops tracking the focus state. */ activateOnKeyboard?: boolean; /** If false, stops drag event propagation to parents */ dragEventsBubbling?: boolean; /** Called when the `dragenter` event occurs */ onDragEnter?(event: React.DragEvent): void; /** Called when the `dragleave` event occurs */ onDragLeave?(event: React.DragEvent): void; /** Called when the `dragover` event occurs */ onDragOver?(event: React.DragEvent): void; /** Called when user closes the file selection dialog with no selection */ onFileDialogCancel?(): void; /** Called when user opens the file selection dialog */ onFileDialogOpen?(): void; /** If false, allow dropped items to take over the current browser window */ preventDropOnDocument?: boolean; /** Set to true to use the File System Access API to open the file picker instead of using an click event, defaults to true */ useFsAccessApi?: boolean; /** Use this to provide a custom file aggregator */ getFilesFromEvent?: (event: DropEvent) => Promise>; /** Custom validation function. It must return null if there's no errors. */ validator?: (file: T) => FileError | FileError[] | null; } export declare function _Dropzone(props: DropzoneProps): React.JSX.Element; export declare namespace _Dropzone { var displayName: string; var Accept: { (props: import("./DropzoneStatus").DropzoneStatusProps): JSX.Element; displayName: string; }; var Reject: { (props: import("./DropzoneStatus").DropzoneStatusProps): JSX.Element; displayName: string; }; var Idle: { (props: import("./DropzoneStatus").DropzoneStatusProps): JSX.Element; displayName: string; }; } export declare const Dropzone: ForwardRefWithStaticComponents; //# sourceMappingURL=Dropzone.d.ts.map