2022-09-12 07:13:52 +00:00
const FileUploadProps = [
{
2022-09-14 14:26:41 +00:00
name : 'name' ,
type : 'string' ,
default : 'null' ,
description : 'Name of the request parameter to identify the files at backend.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'url' ,
type : 'string' ,
default : 'null' ,
description : 'Remote url to upload the files.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'mode' ,
type : 'string' ,
default : 'advanced' ,
2022-09-12 07:13:52 +00:00
description : 'Defines the UI of the component, possible values are "advanced" and "basic".'
} ,
{
2022-09-14 14:26:41 +00:00
name : 'multiple' ,
type : 'boolean' ,
default : 'false' ,
description : 'Used to select multiple files at once from file dialog.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'accept' ,
type : 'string' ,
default : 'null' ,
2022-09-12 07:13:52 +00:00
description : 'Pattern to restrict the allowed file types such as "image/*".'
} ,
{
2022-09-14 14:26:41 +00:00
name : 'disabled' ,
type : 'boolean' ,
default : 'false' ,
description : 'Disables the upload functionality.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'auto' ,
type : 'boolean' ,
default : 'false' ,
description : 'When enabled, upload begins automatically after selection is completed.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'maxFileSize' ,
type : 'number' ,
default : 'null' ,
description : 'Maximum file size allowed in bytes.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'invalidFileSizeMessage' ,
type : 'string' ,
2022-09-12 07:13:52 +00:00
default : '"{0}: Invalid file size, file size should be smaller than {1}."' ,
2022-09-14 14:26:41 +00:00
description : 'Message of the invalid fize size.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'invalidFileLimitMessage' ,
type : 'string' ,
default : 'Maximum number of files exceeded, limit is {0} at most.' ,
description : 'Message to display when number of files to be uploaded exceeeds the limit.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'fileLimit' ,
type : 'number' ,
default : 'null' ,
description : 'Maximum number of files that can be uploaded.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'withCredentials' ,
type : 'boolean' ,
default : 'false' ,
description : 'Cross-site Access-Control requests should be made using credentials such as cookies, authorization headers or TLS client certificates.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'previewWidth' ,
type : 'number' ,
default : '50' ,
description : 'Width of the image thumbnail in pixels.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'chooseLabel' ,
type : 'string' ,
default : 'null' ,
description : 'Label of the choose button. Defaults to PrimeVue Locale configuration.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'uploadLabel' ,
type : 'string' ,
default : 'Upoad' ,
description : 'Label of the upload button. Defaults to PrimeVue Locale configuration.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'cancelLabel' ,
type : 'string' ,
default : 'Cancel' ,
description : 'Label of the cancel button. Defaults to PrimeVue Locale configuration.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'customUpload' ,
type : 'boolean' ,
default : 'false' ,
description : 'Whether to use the default upload or a manual implementation defined in uploadHandler callback. Defaults to PrimeVue Locale configuration.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'showUploadButton' ,
type : 'boolean' ,
default : 'true' ,
description : 'Whether to show the upload button.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'showCancelButton' ,
type : 'boolean' ,
default : 'true' ,
description : 'Whether to cancel the upload button.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'chooseIcon' ,
type : 'string' ,
default : 'pi pi-plus' ,
description : 'Icon of the choose button.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'uploadIcon' ,
type : 'string' ,
default : 'pi pi-upload' ,
description : 'Icon of the upload button.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'cancelIcon' ,
type : 'string' ,
default : 'pi pi-times' ,
description : 'Icon of the cancel button.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'style' ,
type : 'any' ,
default : 'null' ,
description : 'Inline style of the component.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'class' ,
type : 'string' ,
default : 'null' ,
description : 'Style class of the component.'
2023-04-28 16:03:29 +00:00
} ,
{
name : 'pt' ,
type : 'any' ,
default : 'null' ,
description : 'Uses to pass attributes to DOM elements inside the component.'
2023-07-06 13:20:37 +00:00
} ,
{
name : 'unstyled' ,
type : 'boolean' ,
default : 'false' ,
description : 'When enabled, it removes component related styles in the core.'
2022-09-12 07:13:52 +00:00
}
] ;
const FileUploadEvents = [
{
2022-09-14 14:26:41 +00:00
name : 'before-upload' ,
description : 'Callback to invoke before file upload begins to customize the request such as post parameters before the files.' ,
2022-09-12 07:13:52 +00:00
arguments : [
{
2022-09-14 14:26:41 +00:00
name : 'event.xhr' ,
type : 'object' ,
description : 'XmlHttpRequest instance.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'event.formData' ,
type : 'object' ,
description : 'FormData object.'
2022-09-12 07:13:52 +00:00
}
]
} ,
{
2022-09-14 14:26:41 +00:00
name : 'before-send' ,
description : 'Callback to invoke before file send begins to customize the request such as adding headers.' ,
2022-09-12 07:13:52 +00:00
arguments : [
{
2022-09-14 14:26:41 +00:00
name : 'event.xhr' ,
type : 'object' ,
description : 'XmlHttpRequest instance.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'event.formData' ,
type : 'object' ,
description : 'FormData object.'
2022-09-12 07:13:52 +00:00
}
]
} ,
{
2022-09-14 14:26:41 +00:00
name : 'upload' ,
description : 'Callback to invoke when file upload is complete.' ,
2022-09-12 07:13:52 +00:00
arguments : [
{
2022-09-14 14:26:41 +00:00
name : 'event.xhr' ,
type : 'object' ,
description : 'XmlHttpRequest instance.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'event.files' ,
type : 'object' ,
description : 'Uploaded files.'
2022-09-12 07:13:52 +00:00
}
]
} ,
{
2022-09-14 14:26:41 +00:00
name : 'error' ,
description : 'Callback to invoke if file upload fails.' ,
2022-09-12 07:13:52 +00:00
arguments : [
{
2022-09-14 14:26:41 +00:00
name : 'event.xhr' ,
type : 'object' ,
description : 'XmlHttpRequest instance.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'event.files' ,
type : 'object' ,
description : 'Files that are not uploaded.'
2022-09-12 07:13:52 +00:00
}
]
} ,
{
2022-09-14 14:26:41 +00:00
name : 'clear' ,
description : 'Callback to invoke when files in queue are removed without uploading.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'select' ,
description : 'Callback to invoke when file upload is complete.' ,
2022-09-12 07:13:52 +00:00
arguments : [
{
2022-09-14 14:26:41 +00:00
name : 'event.originalEvent' ,
type : 'object' ,
description : 'Original browser event.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'event.files' ,
type : 'object' ,
description : 'List of selected files.'
2022-09-12 07:13:52 +00:00
}
]
} ,
{
2022-09-14 14:26:41 +00:00
name : 'progress' ,
description : 'Callback to invoke when files are selected.' ,
2022-09-12 07:13:52 +00:00
arguments : [
{
2022-09-14 14:26:41 +00:00
name : 'event.originalEvent' ,
type : 'object' ,
description : 'Original browser event.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'event.progress' ,
type : 'number' ,
description : 'Calculated progress value.'
2022-09-12 07:13:52 +00:00
}
]
} ,
{
2022-09-14 14:26:41 +00:00
name : 'uploader' ,
description : 'Callback to invoke to implement a custom upload.' ,
2022-09-12 07:13:52 +00:00
arguments : [
{
2022-09-14 14:26:41 +00:00
name : 'event.files' ,
type : 'object' ,
description : 'List of selected files.'
2022-09-12 07:13:52 +00:00
}
]
} ,
{
2022-09-14 14:26:41 +00:00
name : 'remove' ,
description : 'Callback to invoke when a singe file is removed from the list.' ,
2022-09-12 07:13:52 +00:00
arguments : [
{
2022-09-14 14:26:41 +00:00
name : 'event.file' ,
type : 'object' ,
description : 'Removed file.'
2022-09-12 07:13:52 +00:00
} ,
{
2022-09-14 14:26:41 +00:00
name : 'event.files' ,
type : 'object' ,
description : 'Remaining files to be uploaded.'
2022-09-12 07:13:52 +00:00
}
]
}
] ;
const FileUploadSlots = [
2023-04-18 13:42:36 +00:00
{
name : 'header' ,
description : 'Custom header template.'
} ,
{
name : 'content' ,
description : 'Custom content template.'
} ,
2022-09-12 07:13:52 +00:00
{
2022-09-14 14:26:41 +00:00
name : 'empty' ,
description : 'Custom content when there is no selected file'
2023-04-14 05:15:52 +00:00
} ,
{
name : 'chooseicon' ,
description : 'Custom choose icon template.'
} ,
{
name : 'uploadicon' ,
description : 'Custom upload icon template.'
} ,
{
name : 'cancelicon' ,
description : 'Custom cancel icon template.'
2023-04-15 11:34:56 +00:00
} ,
{
name : 'fileremoveicon' ,
description : 'Custom remove icon template for each file.'
2022-09-12 07:13:52 +00:00
}
] ;
module . exports = {
fileupload : {
2022-09-14 14:26:41 +00:00
name : 'FileUpload' ,
description : 'FileUpload is an advanced uploader with dragdrop support, multi file uploads, auto uploading, progress tracking and validations.' ,
2022-09-12 07:13:52 +00:00
props : FileUploadProps ,
events : FileUploadEvents ,
slots : FileUploadSlots
}
} ;