diff --git a/components/lib/fileupload/FileUpload.js b/components/lib/fileupload/FileUpload.js index 3336e4fcf9..69c484cf85 100644 --- a/components/lib/fileupload/FileUpload.js +++ b/components/lib/fileupload/FileUpload.js @@ -292,8 +292,7 @@ export const FileUpload = React.memo( }; const onKeyDown = (event) => { - if (event.which === 13) { - // enter + if (event.code === 'Enter') { choose(); } }; @@ -530,7 +529,12 @@ export const FileUpload = React.memo( const createProgressBarContent = () => { if (props.progressBarTemplate) { - return ObjectUtils.getJSXElement(props.progressBarTemplate, props); + const defaultProgressBarTemplateOptions = { + progress: progressState, + props + }; + + return ObjectUtils.getJSXElement(props.progressBarTemplate, defaultProgressBarTemplateOptions); } return ; diff --git a/components/lib/fileupload/fileupload.d.ts b/components/lib/fileupload/fileupload.d.ts index d4b7f12e85..43759ec041 100644 --- a/components/lib/fileupload/fileupload.d.ts +++ b/components/lib/fileupload/fileupload.d.ts @@ -218,6 +218,22 @@ interface FileUploadHeaderTemplateOptions { props: FileUploadProps; } +/** + * Custom file upload progressbar template options + */ +interface FileUploadProgressBarTemplateOptions { + /** + * Current progress state as a number. + * @defaultValue 0 + */ + progress: number; + /** + * The props passed to the component. + * @type {FileUploadProps} + */ + props: FileUploadProps; +} + /** * Custom item template options */ @@ -532,7 +548,7 @@ interface FileUploadProps { /** * Custom template of progressBar content in the container. */ - progressBarTemplate?: React.ReactNode | ((props: FileUploadProps) => React.ReactNode); + progressBarTemplate?: React.ReactNode | ((options: FileUploadProgressBarTemplateOptions) => React.ReactNode); /** * Callback to invoke before file upload begins to customize the request such as post parameters before the files. * @param {FileUploadBeforeUploadEvent} event - Custom beforeUpload.