Unify File Import Behavior Across Input, Drop Events, and File System APIs

[tabcat]

I'm considering adding some utilities that would help unify behavior between all the separate import methods.
The idea is to make importing the same set of files/dirs result in an identical cid independent of which import method was used.
This is important as it will provide users with a solution to reliably import from most browser platforms.

I also want to make it easy to wrap the imported content in a directory on the condition of there being multiple pieces of content without a shared root directory.

The separate import methods:

• <input type="file" /> with or without multiple and webkitdirectory properties (FileList)
• HTMLElement: drop event (FileSystemEntry or FileSystemHandle)
• window.showOpenFilePicker and window.showDirectoryPicker (FileSystemHandle)

Behaviors:

Method / Element	Result Type	Items	Support Level	Mobile Friendly
<input type="file">	FileList	1 file	✅ Standard	✅ Yes
<input type="file" multiple>	FileList	1 + files	✅ Standard	✅ Yes
<input type="file" webkitdirectory>	FileList	0 + files (in dirs)	☑️ Non-standard	✅ Yes
Drop Event	FileSystemEntry[] / FileSystemHandle[]	1 + files / dirs	☑️ Partially standard	❌ No
showOpenFilePicker()	FileSystemFileHandle[]	1 + files	🟡 Draft standard	✅ Yes
showDirectoryPicker()	FileSystemDirectoryHandle	1 dir	🟡 Draft standard	✅ Yes

[tabcat]

going to mark this as closed by 01fa388

use hasCommonRoot === false for the wrapWithDirectory option in unixfs.addAll

this will make sure there is a shared root dir for the uploaded files if there wasnt one. so uploading the same set of files as another dir should result in the same root cid.

[tabcat]

Thinking of creating handler functions for Drop (FileSystemEntry and FileSystemHandle) and Click (FileList) events.
They would check if what's being used is supported and throw readable errors.