File
Interface
export type IFileTypeValue = File | File[] | null;
export type FileAcceptType = 'image/*' | 'video/*' | 'audio/*' | 'application/pdf' | 'application/msword' | 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' | 'application/vnd.ms-excel' | 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' | 'application/vnd.ms-powerpoint' | 'application/vnd.openxmlformats-officedocument.presentationml.presentation' | '.jpg' | '.jpeg' | '.png' | '.gif' | '.svg' | '.webp' | '.mp4' | '.mp3' | '.wav' | '.ogg' | '.csv' | '.txt' | '.zip' | '.rar' | '.7z' | '.json' | '.xml' | '.pdf';
export interface IFileField extends CommonField {
type: 'file';
options?: {
accept?: FileAcceptType[];
multiple?: boolean;
};
private?: () => Promise<IFileTypeValue>;
render?: (v: IFileTypeValue) => JSX.Element;
validation?: Validation<IFileTypeValue>;
}Example
Single File
{
type: 'file',
name: 'YOUR_PATH',
options: {
accept: ['.jpg', '.jpeg', '.png'],
},
validation: z
.instanceof(File, { message: 'File non presente' })
.nullable()
.refine(
(files) => {
if (!files) return true
const validExt = (file: File) =>
['.jpg', '.jpeg', '.png'].includes(
'.' + (file.name.split('.').pop() || '').toLowerCase()
)
const validSize = (file: File) => file.size <= 1048576
return validExt(files) && validSize(files)
},
{
message:
'Only .jpg, .jpeg, .png file are allowed and max size is 1MB.'
}
)
}Multiple Files
{
type: 'file',
name: 'YOUR_PATH',
options: {
accept: ['.jpg', '.jpeg', '.png'],
multiple: true
},
validation: z
.array(z.instanceof(File, { message: 'File non presente' }))
.refine((Files) => {
return Files.every(
(file) =>
['.jpg', '.jpeg', '.png'].includes(
'.' + (file.name.split('.').pop() || '').toLowerCase()
) && file.size <= 1048576
)
})
}