react-use-file-upload - npm Package Compare versions

Comparing version 0.6.2 to 0.7.0

package.json

		{
		"name": "react-use-file-upload",
		"version": "0.6.2",
		"version": "0.7.0",
		"description": "A React Hook to make dealing with file uploading easier.",
		@@ -20,5 +20,7 @@ "main": "dist/index.js",
		"keywords": [
		"boilerplate",
		"typescript",
		"npm package boilerplate"
		"upload",
		"file uploading",
		"files",
		"react hook",
		"use file upload"
		],
		@@ -25,0 +27,0 @@ "author": "Daniel Zuzevich",

README.md

		# React useFileUpload

		A React Hook to make dealing with files in an upload scenario easier. It extracts away a lot of the boilerplate that comes with allowing users to add their own files to your web application.
		A React Hook to make uploading files easier. It extracts away a lot of the boilerplate that comes with allowing users to attach and upload files to your web application. The default browser implementation for [uploading files](https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications) is lame, and doesn't allow you to remove attached files manually, or allow the user to select more files without deleting the previously attached ones.

		This hook changes that, and allows you to remove, append, and write over files as you choose. You'll want to hide the default browser input, and create your own custom looking form.

		## Usage
		@@ -13,4 +15,12 @@
		const Upload = () => {
		const { files, handleDragDropEvent, clearAllFiles, createFormData, setFiles, fileNames, fileTypes, removeFile } =
		useFileUpload();
		const {
		files,
		handleDragDropEvent,
		clearAllFiles,
		createFormData,
		setFiles,
		fileNames,
		fileTypes,
		removeFile
		} = useFileUpload();

		@@ -81,3 +91,9 @@ const inputRef = useRef();
		{/* Hide the crappy looking default HTML input */}
		<input ref={inputRef} type="file" multiple style={{ display: 'none' }} onChange={(e) => setFiles(e, 'a')} />
		<input
		ref={inputRef}
		type="file"
		multiple
		style={{ display: 'none' }}
		onChange={(e) => setFiles(e, 'a')}
		/>
		</div>
		@@ -84,0 +100,0 @@ </div>

New alerts