diff --git a/.gitignore b/.gitignore index d457b7fc..8d9b7f83 100644 --- a/.gitignore +++ b/.gitignore @@ -23,4 +23,5 @@ npm-debug.log* yarn-debug.log* yarn-error.log* -report* \ No newline at end of file +report* +/.vs diff --git a/README.md b/README.md index 8e964931..4cbc1b97 100644 --- a/README.md +++ b/README.md @@ -54,7 +54,8 @@ export default DragDrop; | ------------ | ---------------- | ------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------- | | name | string | the name for your form (if exist) | `"myFile"` | | multiple | boolean | a boolean to determine whether the multiple files is enabled or not | `true OR false - false by default` | -| label | string | the label (text) for your form (if exist) inside the uploading box - first word underlined | `"Upload or drop a file right here"` | +| label | string | the label (text) for your form (if exist) inside the uploading box - first word underlined | `"Upload or drop a file right here"` | +| labelAfter | string | the label (text) for your form (if exist) inside the uploading box - After the drop operation is done - first word underlined | `"Uploaded Successfully!. Upload another?"` | | disabled | boolean | this for disabled the input | `true OR false` | | hoverTitle | string | text appears(hover) when trying to drop a file | `"Drop here"` | | fileOrFiles | Array or File or null | this mainly made because if you would like to remove uploaded file(s) pass null or pass another file as initial | diff --git a/src/FileUploader.tsx b/src/FileUploader.tsx index 4bad9ee8..2ca0b843 100644 --- a/src/FileUploader.tsx +++ b/src/FileUploader.tsx @@ -22,6 +22,7 @@ type Props = { fileOrFiles?: Array | File | null; disabled?: boolean | false; label?: string | undefined; + labelAfter?: string | undefined; multiple?: boolean | false; onSizeError?: (arg0: string) => void; onTypeError?: (arg0: string) => void; @@ -38,6 +39,7 @@ type Props = { * @param typeError - boolean to check if the file has type errors * @param disabled - boolean to check if input is disabled * @param label - string to add custom label + * @param labelAfter - string to add custom label shown after drop completed * @returns JSX Element * * @internal @@ -71,7 +73,16 @@ const drawDescription = ( ) : ( <> - Uploaded Successfully!. Upload another? + {labelAfter ? ( + <> + {labelAfter.split(' ')[0]}{' '} + {labelAfter.substr(labelAfter.indexOf(' ') + 1)} + + ) : ( + <> + Uploaded Successfully!. Upload another? + + )} )}