TipTo allow users to select multiple files, ensure you pass the multiple: true option. Otherwise, the hook will default to a single-file selection.
NoteThis hook provides the state and logic for file handling but does not perform the actual upload. You should use the files array to build a FormData object for your API calls.
An unopinionated hook for handling file inputs. It abstracts the boilerplate of managing File[] states and provides a spreadable inputProps object to keep UI components clean while supporting both single and multiple file selections.
| Name | Type | Description |
|---|---|---|
| options.accept | string | File types accepted (e.g., '.png, .pdf'). Default: undefined. |
| options.disabled | boolean | Disables the file input. Default: false. |
| options.multiple | boolean | Allows selecting more than one file. Default: false. |
| Name | Type | Description |
|---|---|---|
| files | File[] | Array of currently selected File objects. |
| hasFiles | boolean | Utility boolean that is true if at least one file is selected. |
| inputProps | React.InputHTMLAttributes<HTMLInputElement> | Props to be spread onto a <input type='file' /> element. |
| reset | () => void | Function to clear the current selection. |
| setFiles | (files: File[] | FileList) => void | Manual setter for files (ideal for Drag & Drop implementations). |