import { DropzoneProps, FileRejection } from 'react-dropzone'; import { ThemingProps, UseFormControlProps } from '@chakra-ui/react'; import type { Promisable } from 'type-fest'; interface WithForwardRefType extends React.FC> { (props: AttachmentProps): ReturnType>>; } type AttachmentValueProp = Multiple extends true ? { /** * Boolean flag on whether to support multiple file upload. */ multiple: true; /** * Callback to be invoked when the file is attached or removed. */ onChange: (files: File[]) => void; /** * Current value of the input. */ value: File[]; } : { /** * Boolean flag on whether to support multiple file upload. */ multiple?: false; /** * Callback to be invoked when the file is attached or removed. */ onChange: (file?: File) => void; /** * Current value of the input. ` */ value: File | undefined; }; export type AttachmentProps = UseFormControlProps & { /** * If exists, callback to be invoked when file has errors. */ onError?: (errMsg: string) => void; /** * Name of the input. */ name: string; /** * One or more * [unique file type specifiers](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers) * describing file types to allow */ accept?: DropzoneProps['accept']; /** * If exists, files cannot be attached if they are above the maximum size * (in bytes). */ maxSize?: DropzoneProps['maxSize']; /** * Boolean flag on whether to show the file size helper message below the * input. */ showFileSize?: boolean; /** * If provided, the image preview will be shown in the given size variant. */ imagePreview?: 'small' | 'large'; /** * Color scheme of the component. */ colorScheme?: ThemingProps<'Attachment'>['colorScheme']; /** * If provided, the file will be validated against the given function. * If the function returns a string, the file will be considered invalid * and the string will be used as the error message. * If the function returns null, the file will be considered valid. */ onFileValidation?: (file: File) => Promisable; /** * If provided, files that have been rejected will be displayed along with the reasons for rejection. */ rejections?: FileRejection[]; /** * If exists, callback to be invoked when file has errors. */ onRejection?: (rejections: FileRejection[]) => void; /** * Maximum number of files allowed when multiple upload is enabled. * If not specified, there is no limit. Only applicable when multiple is true. */ maxFiles?: number; } & AttachmentValueProp; export declare const Attachment: WithForwardRefType; export {};