Pass `dataTransfer` through in `onDrop`
- Dominant language
- TypeScript
- Stars
- 15.9k
- Forks
- 1.6k
- Avg merge
- 3d 9m
- Merged PRs (30d)
- 59
Description
### Provide a general summary of the feature here
I use DropZone in a form, and would like to have an easy way to set the associated input's `files` property. Currently I have to construct my own `FileList`, but the original `dataTransfer` is right there, just discarded:
https://github.com/adobe/react-spectrum/blob/3691c7fc9c4f4138e268704bb776694018f04259/packages/%40react-aria/dnd/src/useDrop.ts#L253-L267
### 🤔 Expected Behavior?
I wish I could just do this:
```ts
{
ok(inputRef.current);
inputRef.current.files = event.dataTransfer.files;
}}
>
Select files
Drop files here
```
### 😯 Current Behavior
Currently I have to do this:
```ts
{
const dataTransfer = new DataTransfer();
const files = await Promise.all(
event.items
.filter((x) => x.kind === 'file')
.map(async (x) => x.getFile()),
);
for (const file of files) dataTransfer.items.add(file);
ok(inputRef.current);
inputRef.current.files = dataTransfer.files;
}}
>
Select files
Drop files here
```
Contributor guide
Assessment
This issue has not been assessed yet.