Skip to main content

FileUploaderField


Example

Props

NameTypeDefault ValueRequiredDescription
textsFileUploaderTextsYes

Texts used in the component

renderIssue(issue: E | ErrorCode, file?: File) => ChildrenYes

A function to render validation issues. It's used to display a user-friendly error message under the field.

issuesNonEmptyArray<E>No

A non-empty array of validation issues for the field

maxFileSizenumberNo

The maximum size of uploaded files, in megabytes.

allowedFileTypesRecord<string, string[]>No

An object where the keys are MIME types and the values are file extensions.

validate(file: File) => Promise<E>async () => nullNo

Custom validation function. If the function returns an error code, the file is considered invalid. Returning null means the file is valid.

heightstring | numberNo

The field height

isUploadingbooleanNo

A parameter that allows external control of the uploading status.

labelstringYes
disabledbooleanNo
hintPlacement"bottom" | "left" | "right" | "top" | "bottom-end" | "bottom-start" | "left-end" | "left-start" | "right-end" | "right-start" | "top-end" | "top-start"No
autoFocusbooleanNo
onBlur() => unknownNo
namestringNo
valueFileResult<E>Yes
onChange(value: FileResult<E>) => unknownYes
hintstringNo

Related components