kobalte
kobalte copied to clipboard
Inconsistent behaviour of `FileField`'s `onFileChange`
Describe the bug
onFileChage sometimes reports only changed files, but on delete click reports all previously accepted files + last rejected files
To Reproduce Steps to reproduce the behavior:
- Use something like that
<FileField multiple onFileChange={(e) => console.log(e)} > <FileField.Trigger> Choose </FileField.Trigger> <FileField.HiddenInput /> <FileField.ItemList> {(file) => { return ( <FileField.Item> <FileField.ItemName /> <FileField.ItemDeleteTrigger> DELETE </FileField.ItemDeleteTrigger> </FileField.Item> ); }} </FileField.ItemList> </FileField> - Add files one by one (without error) - see logs of only newly added files one by one
- Delete some file with trigger - see log of all previously added files
- Extra behaviour: If you make file reject just before clicking delete, you'll get same reject report on deleting
Expected behavior
onFileChange should always report consistently all accepted files (and rejected just once - as they are rejected) or always report only changed files - so no report on delete
Eg.
From
onProcessFiles:
// trigger on change
mergedProps.onFileChange?.({ acceptedFiles, rejectedFiles });
removeFile:
// trigger on change
mergedProps.onFileChange?.({
acceptedFiles: unwrap(acceptedFilesState),
rejectedFiles: unwrap(rejectedFilesState),
});
To
onProcessFiles:
// trigger on change
mergedProps.onFileChange?.({
acceptedFiles: unwrap(acceptedFilesState),
rejectedFiles
});
removeFile:
// trigger on change
mergedProps.onFileChange?.({
acceptedFiles: unwrap(acceptedFilesState),
rejectedFiles: [],
});
+1